Cara Membuat Related Post di Blogger / Blogspot

Thursday, August 16, 2012



Cara Membuat Related Post di Blogger / Blogspot - Tutorial blog kali ini akan membahas mengenai cara membuat related post atau artikel terkait di blogspot. Artikel atau posting terkait
yang dimaksud di sini adalah artikel yang berada pada kategori atau
label yang sama. Tentunya sobat blogger sudah mengerti dengan maksud
saya bukan.



Related post
ini tentu akan memudahkan pengunjung dalam menemukan artikel-artikel
yang berhubungan dengan artikel yang sedang dibaca. Selain itu, related
post juga akan berpengaruh terhadap SEO. Jadi, saya sarankan sobat untuk
menggunakan cara ini.



Nah, bagi sobat yang ingin membuat related post di blogspot ikuti tutorial berikut ini.




  1. Log ini ke akun blogger sobat;

  2. Pilih menu Rancangan » Edit HTML;

  3. Beri tanda centang pada tulisan Expand Template Widget;

  4. Carilah kode <data:post.body/>,biasanya terdapat 2 kode ini jika sobat memasang readmore, kemudian copaskan kode berikut tepat dibawah kode <data:post.body/> yang kedua.




<!-- BAWAH POST -->

<br/>

<a
href='http://indonesiadocuments.blogspot.com/2012/08/cara-membuat-related-post-di-blogger.html'
target='_blank' title='klik, untuk mengetahui cara membuat artikel
terkait'><b style='color:red;'>Baca Juga Artikel Menarik Lainnya :</b></a>


<DIV style='margin:0; padding:10px;height:300px;overflow:auto;'>

<DIV id='rizki'/>

<SCRIPT type='text/javascript'>

var homeUrl3 = &quot;<data:blog.homepageUrl/>&quot;;

var maxNumberOfPostsPerLabel = 5;

var maxNumberOfLabels = 10;

maxNumberOfPostsPerLabel = 100;

maxNumberOfLabels = 5;

function listEntries10(json) {

var ul = document.createElement(&#39;ul&#39;);

var maxPosts = (json.feed.entry.length &lt;= maxNumberOfPostsPerLabel) ?

json.feed.entry.length : maxNumberOfPostsPerLabel;

for (var i = 0; i &lt; maxPosts; i++) {

var entry = json.feed.entry[i];

var alturl;

for (var k = 0; k &lt; entry.link.length; k++) {

if (entry.link[k].rel == &#39;alternate&#39;) {

alturl = entry.link[k].href;

break;

}

}

var li = document.createElement(&#39;li&#39;);

var a = document.createElement(&#39;a&#39;);

a.href = alturl;

if(a.href!=location.href) {

var txt = document.createTextNode(entry.title.$t);

a.appendChild(txt);

li.appendChild(a);

ul.appendChild(li);

}

}

for (var l = 0; l &lt; json.feed.link.length; l++) {

if (json.feed.link[l].rel == &#39;alternate&#39;) {

var raw = json.feed.link[l].href;

var label = raw.substr(homeUrl3.length+13);

var k;

for (k=0; k&lt;20; k++) label = label.replace(&quot;%20&quot;, &quot; &quot;);

var txt = document.createTextNode(label);

var h = document.createElement(&#39;b&#39;);

h.appendChild(txt);

var div1 = document.createElement(&#39;div&#39;);

div1.appendChild(h);

div1.appendChild(ul);

document.getElementById(&#39;rizki&#39;).appendChild(div1);

}

}

}

function search10(query, label) {

var script = document.createElement(&#39;script&#39;);

script.setAttribute(&#39;src&#39;, query + &#39;feeds/posts/default/-/&#39;

+ label +

&#39;?alt=json-in-script&amp;callback=listEntries10&#39;);

script.setAttribute(&#39;type&#39;, &#39;text/javascript&#39;);

document.documentElement.firstChild.appendChild(script);

}

var labelArray = new Array();

var numLabel = 0;

<b:loop values='data:posts' var='post'>

<b:loop values='data:post.labels' var='label'>

textLabel = &quot;<data:label.name/>&quot;;

var test = 0;

for (var i = 0; i &lt; labelArray.length; i++)

if (labelArray[i] == textLabel) test = 1;

if (test == 0) {

labelArray.push(textLabel);

var maxLabels = (labelArray.length &lt;= maxNumberOfLabels) ?

labelArray.length : maxNumberOfLabels;

if (numLabel &lt; maxLabels) {

search10(homeUrl3, textLabel);

numLabel++;

}

}

</b:loop>

</b:loop>

</SCRIPT>


</DIV>

<script type='text/javascript'>RelPost();</script>


<!-- membuat posting terkait selesai -->



  1. Kemudian simpan template sobat dan lihat hasilnya.




Ket :


  1. Lihat tulisan yang berwarna merah, sobat bisa merubahnya sesuka hati sobat;

  2. Kode yang berwarna biru adalah untuk membuat scroll sehingga jika ada banyak postingan yang tampil hanya sedikit;

  3. Rubahlah ukuran height:500px;
    dengan ukuran sesuka hati sobat untuk membuat tinggi halaman. Tapi jika
    sobat ingin menampilkan semua artikel terkait, sobat tinggal menghapus
    kode div tersebut.

  4. Tutorial ini saya sisipkan link back ke blog ini, jika sobat berkenan, tolong jangan dihapus.





Semoga
Artikel diatas dapat membuat sobat senang dan aku berharap dapat
membantu serta bermanfaat bagi para sobat semuanya . Kami dari  INDONESIA DOCUMENTS
menyampaikan trimakasi Atas Kunjungan Sobat...n_n dan jika ada yang
kurang serta saran bagi kami silahkan teman teman bisa berkomentar di
bawah ini...trimakasi...n_n 


0 comments:

Post a Comment