Home » » Membuat Artikel Terkait di bawah postingan blogger

Membuat Artikel Terkait di bawah postingan blogger

Written By Parmin Prim on 13 April 2013 | 11.30

Hampir setiap blog yang beredar di dunia maya, saat menggunakan fasilitas Link yang mengarahkan pembaca ke Artikel lain.   Hal ini tentunya bertujuan agar pembaca tetap menelusuri postingan lain yang ada di blog.  Artikel terkait biasanya diletakkan di bawah postingan dengan maksud saat selesai membaca postingan tersebut, mata pembaca langsung tertuju pada link artikel yang baru.  Nah, bagi para master bo9g tentunya hal ini sudah tidak asing lagi, tetapi bagi mewbi seperti saya ini, tentunya sangat bermanfaat sekali.

Nah, untuk tutorial kali ini, kita akan mencoba cara membuat artikel terkait di bawah postingan blog yang mungkin bisa berguna untuk di pasang di blog anda.  Langsung aja, caranya sebagai berikut :
  1. Masuk / Login ke blogger anda
  2. Pilih Template

  3. Untuk kemanan blog anda, sebaiknya di download dulu template anda saat ini. Hal ini untuk menjaga jika penambahan fasilitas ini tidak berhasil dan templatenya berantakan, maka anda punya template cadangan. Caranya klik disebelah kanan Cadangkan/Pulihkan lalu Unduh Template Lengkap.
  4. Jika sudah di download template cadangan anda, maka tutup kotak dialog Template> Cadangkan/pulihkan sehingga kembali ke tampilan Template.
  5. Kemudian klik Edit HTML
  6. Tekan Ctrl F dan cari kode

    <data:post.body/></b:if>

  7. Letakkan kode dibawah ini tepat di bawah kode di atas. Jika ada beberapa kode diatas yang sama, pilih yang ke-empat.

  8. <b:if cond='data:blog.pageType == &quot;item&quot;'> <br/> <br/> <H2>Artikel menarik lainnya</H2> <div class='rbbox'> <div style='margin:0; padding:10px;height:200px;overflow:auto;border:1px solid #ccc;'> <div id='albri'/> <script type='text/javascript'> var homeUrl3 = &quot;<data:blog.homepageUrl/>&quot;; var maxNumberOfPostsPerLabel = 4; var maxNumberOfLabels = 10; maxNumberOfPostsPerLabel = 9999; maxNumberOfLabels = 3; 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;albri&#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> </div> </b:if>


  9. Setelah itu cari kode berikut.

    ]]></b:skin>

    Tambahkan kode di bawah ini sebelum kode di atas.

    .rbbox{border: 1px solid rgb(192, 192, 192);padding: 5px; background-color: #f0f0f0;-moz-border-radius:5px; margin:5px;} .rbbox:hover{background-color: rgb(255, 255, 255);}
Share this article :
Comments
0 Comments

0 komentar:

Poskan Komentar

Popular Posts

Posting Update

Chat Langsung

Diberdayakan oleh Blogger.

Follow by Email

 
Support : Primaya | Masprim | My Facebook
Redesain © 2015. primaya.blogspot.co.id - All Rights Reserved
Template Source from Creating Website
Proudly powered by Blogger