Membuat Memasang Related Post Link Within Blog

Cara Membuat Dan Memasang Related Post Link Within Di Blog - Baru beberapa waktu ini saya menggunakan widget LinkWithin dan hasilnya pun cukup lumayan, juga sebagai salah satu upaya saya untuk membuat pengunjung lebih mudah melihat-lihat lagi halaman postingan / artikel saya yang lainnya, sehingga bisa untuk meningkatkan jumlah pageview & cukup lumayan untuk sedikit menyumbangkan sejumlah traffic blog Anda. LinkWithin merupakan tool navigasi eksternal yang lumayan keren menurut saya. Halaman-halaman lama yang jarang tersentuh bisa dioptimalkan dengan penggunaan fitur  Link Within ini, karena fitur ini menampilkan post secara acak. Selain itu, widget yang satu ini juga menggunakan thumbnail, yang bisa meningkatkan daya tarik pengunjung. Tampilannya pun cukup keren menurut saya. Linkwithin ini selalu melakukan generating gambar dari page yang dimuat agar sesuai blog, atau jika memang tidak ada gambar dalam halaman postingan Anda, LinkWithin akan menampilkan sebuah gambar dengan dasar berwarna abu-abu juga sedikit bertekstur. Sistem yang digunakan fitur ini adalah sistem randoming content, jadi semi random, namun juga tetap melakukan persamaan konteks yang melalui judul, tag, atau label postingan Anda. Sehingga ketika halaman di load, juga dibutuhkan waktu untuk memuat dan menampilkan hasilnya. Namun, tidak terlalu lama juga. Lagi pula tidak ada apa-apanya dibandingkan dengan hasilnya. Jadi, bagaimana cara kita memasangnya? Ada 2 cara memasang widget Link Within ini, pertama dengan mendaftar (bukan sign up, hanya menuliskan url blog Anda disana) langsung di situs Link Within, dan cara yang kedua dengan meng-edit HTML langsung di blog Anda. Terserah Anda pilih yang mana, coba Anda simak berikut ini Cara Membuat Dan Memasang Related Post Link Within Di Blog :

A. Cara 1

Cara Mendapatkan Widget

1. Go to LinkWithin.

2. Setelah masuk ke halamannya, Anda lihat ke bagian kanan bawah dimana disana akan terdapat kolom untuk mengisi url blog Anda untuk mendapatkan widgetnya. Untuk lebih jelasnya lihat gambar dibawah.

3. Masukkan email valid yang Anda gunakan.

4. Isikan url blog/website Anda tentunya.

5. Pilih Platform blog anda (ini berfungsi untuk memasukkan secara otomatis melalui dashboard blog Anda langsung).

6. Pilihlah jumlah stories yang ingin anda tampilkan, jangan lupa sesuaikan dengan lebar post body di blog Anda. (pilih melalui dropdown menu di kolom Width)

7. Centang "My blog has light text on a dark background" hanya jika latar tampilan blog anda berwarna gelap.

8. Klik 'GetWidget!'.

9. Kemudian Anda akan masuk ke halaman selanjutnya dan akan dibimbing untuk melakukan langkah-langkah sesuai dengan platform blog, (atau simak cara berikut : Masuk ke Dashboard -> Tata Letak / Layout -> Anda pasti sudah bisa menemukan widget Link Within disana jika sudah berhasil. Kemudian edit letaknya dengan menggesernya di bawah posting) save dan check hasilnya.

Contoh tampilannya seperti ini:

 Kostumisasi Widget

a. Kata-kata "you might also like:" mungkin kurang keren atau kurang wah menurut anda, tenang, anda bisa menggantinya dengan cara:

1. Masuk ke Edit HTML di dahboard Anda

2. Carilah tag <head> (Agar lebuh mudah tekan Ctrl+F untuk masuk pencarian)

3. Kemudian Anda masukkan script berikut tepat di bawahnya:

<script>linkwithin_text='TEKS DISINI:'</script>

4. Ganti TEKS DISINI dengan teks yang Anda inginkan tentunya dan save template.

b. Jika Anda ingin menempatkan widget LinkWithin itu di posisi tertentu di bawah post body, karena mungkin disana terdapat banyak widget lain, seperti Adsense dan yang lainnya, Anda bisa meletakkan kode berikut di atas atau dibawah widget yang lain di bagian post body (cari lah widget-widget di bagian post body).

<div class="linkwithin_div"></div>

Lalu save template.

c. Ketika Anda berada di halaman utama (frontpage) atau halaman-halaman yang memuat query posts, widget ini akan muncul di bawah setiap post. Hal ini tentu saja tampak tidak elegan dan membutuhkan waktu loading yang lebih lama. So, jika anda ingin widget ini hanya muncul di bagian posting saja (menyembunyikannya dari halaman muka), lakukan langkah berikut:

1. Jika anda sudah terlajur memiliki widget LinkWithin yang terpasang, silakan di remove/delete terlebih dahulu.

2. Lakukan kembali langkah untuk mendapatkan widget LinkWithin diatas. Khusus pada menu Platform pilih 'Other'. Klik 'Get Widget!'

3. Anda akan menuju ke halaman selanjutnya, lalu copy script yang telah terbuat dan simpan script tersebut.

4. Kemudian masuk ke edit HTML template anda, dan ikuti langkah sederhana cara menampilkan widget hanya di post body.

5. Save dan lihat hasilnya.

B. Cara 2

1. Pertama, Anda harus masuk ke akun Blogger, buka Template > Edit HTML dan jangan lupa selalu centang "Expand Widget Templates"
2. Cari kode  </head>   dengan CTRL+F supaya lebih mudah mencari.
3. Ganti tersebut dengan kode berikut :

<!--Related Posts with thumbnails Scripts and Styles Start-->
<!-- remove --><b:if cond='data:blog.pageType == &quot;item&quot;'>
<style type="text/css">
#related-posts {
float:center;
text-transform:none;
height:100%;
min-height:100%;
padding-top:5px;
padding-left:5px;
}


#related-posts h2{
font-size: 1.6em;
font-weight: bold;
color: black;
font-family: Georgia, &#8220;Times New Roman&#8221;, Times, serif;
margin-bottom: 0.75em;
margin-top: 0em;
padding-top: 0em;
}
#related-posts a{
color:black;
}
#related-posts a:hover{
color:black;
}


#related-posts  a:hover {
background-color:#d4eaf2;
}
</style>
<script type='text/javascript'>
var defaultnoimage="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh34JIeZskMFZxx6eZo0e1OYKXcylvBYuE2JFwxZsbWhg6IQazpDTP_ApN6OpOTRqO0z04i0E4flJcvLYYuHO34r187ZsCpsFmZqx_E0eYFdkDdVwUwpuk4Gepr9uMWNYhn5wAmvLgl1Mg/s400/noimage.png";
var maxresults=5;
var splittercolor="#d4eaf2";
var relatedpoststitle="Related Posts";
</script>
<script src='http://bloggergadgets.googlecode.com/files/related_posts_with_thumbnails_min.js' type='text/javascript'/>
<!-- remove --></b:if>
<!--Related Posts with thumbnails Scripts and Styles End-->
</head>

4. Kemudian Anda cari kode berikut :

<div class='post-footer-line post-footer-line-1'>

5. Apabila Anda tidak menemukannya, maka Anda cari kode berikut

<p class='post-footer-line post-footer-line-1'>

6. Apabila salah satu kode diatas sudah Anda temukan maka tinggal copas kode berikut tepat dibawahnya.

<!-- Related Posts with Thumbnails Code Start-->
<!-- remove --><b:if cond='data:blog.pageType == &quot;item&quot;'>
<div id='related-posts'>
<b:loop values='data:post.labels' var='label'>
<b:if cond='data:label.isLast != &quot;true&quot;'>
</b:if>
<script expr:src='&quot;/feeds/posts/default/-/&quot; + data:label.name + &quot;?alt=json-in-script&amp;callback=related_results_labels_thumbs&amp;max-results=6&quot;' type='text/javascript'/></b:loop>
<script type='text/javascript'>
removeRelatedDuplicates_thumbs();
printRelatedLabels_thumbs(&quot;<data:post.url/>&quot;);
</script>
</div><div style='clear:both'/>
<!-- remove --></b:if>
<b:if cond='data:blog.url == data:blog.homepageUrl'><b:if cond='data:post.isFirstPost'>
<a href='http://www.bloggerplugins.org/2009/08/related-posts-thumbnails-blogger-widget.html'><img style="border: 0" alt="Related Posts Widget For Blogger with Thumbnails" src="http://image.bloggerplugins.org/blogger-widgets.png" /></a><a href='http://bloggertemplates.bloggerplugins.org/' ><img style="border: 0" alt="Blogger Templates" src="http://image.bloggerplugins.org/blogger-templates.png" /></a>
</b:if></b:if>
<!-- Related Posts with Thumbnails Code End-->

7. Klik Save Template
8. Untuk mengatur jumlah kotak yang ditampilkan Anda bisa ubah value dari kode berikut.

var maxresults=5;

9. Untuk mengubah jumlah post yang ingin Anda ditampilkan tiap label, Anda harus mengubah kode berikut.

max-results=6

10. Untuk mengubah title kata-kata "Related Post" maka editlah kode berikut.

var relatedpoststitle="Related Posts";

11. Untuk mengubah warna splitter/pembatas ubahlah kode berikut.

var splittercolor="#d4eaf2";

12. Untuk mengganti tampilan gambar kosong bisa mengubah URL dari kode berikut.

var defaultnoimage="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh34JIeZskMFZxx6eZo0e1OYKXcylvBYuE2JFwxZsbWhg6IQazpDTP_ApN6OpOTRqO0z04i0E4flJcvLYYuHO34r187ZsCpsFmZqx_E0eYFdkDdVwUwpuk4Gepr9uMWNYhn5wAmvLgl1Mg/s400/noimage.png";

Simpan dan lihat hasilnya. Nah Anda berhasil Memasang Related Post Link Within Di Blog Anda. Semoga bermanfaat dan selamat mencoba!

Tertarik dengan artikel ini? Tag artikel saya di blog Anda dengan memasang script permalink di bawah ke blog Anda. Terima kasih
<a href="https://panduanku-ngeblog.blogspot.com/2012/07/membuat-memasang-related-post-link.html">Membuat Memasang Related Post Link Within Blog</a>