• Bm7
    Terima kasih sudah berkunjung xD
Home » , , » Cara Membuat Related Post atau Artikel Terkait

Cara Membuat Related Post atau Artikel Terkait

Diposting oleh khaidar Senin, 03 September 2012 Label: , ,
Cara Membuat Artikel Terkait - Selamat sore sahabat blogger pada kesempatan kali ini kita akan membahas bagaimana cara membuat related post atau kita biasanya menyebutnya artikel terkait, cara membuat artikel terkait kali ini yang saya bahas dalam blog ini adalah sangat mudah, hanya menggunakan sedikit css.

Nah perhatikan langkah-langkah tutorial dibawah ini mungkin bisa membantu anda

1.Login ke Akun blogger sobat
2.Masuk pada template pilih edit HTML pilih lanjutkan
3.Centang Expand Template Widget 
4.Cari kode <data:post.body/> lalu masukkan script dibawah ini dibawah kode <data:post.body/>

Kode:
Kode:
<!-- Related Posts Scroll Code Start--> <b:if cond='data:blog.pageType == &quot;item&quot;'> <br/> <br/> <H2>.: Artikel Terkait :.</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 = 100; 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> <!-- Related Posts Scroll Code End-->

5.Kemudian cari kode ]]></b:skin> Paste kode dibawah ini diatas tag ]]></b:skin>

kode:
/*Artikelterkait*/ .rbbox{background-color:Transparent;-moz-border-radius:5px;opacity:0.9;filter:alpha(opacity=40);thisstyleopacity:6;box-shadow:-1px -1px 1px #666,1px 1px 1px #666,1px 1px 20px #33F;-moz-box-shadow:-1px -1px 1px #666,1px 1px 1px #666,1px 1px 20px #33F;-webkit-box-shadow:-1px -1px 1px #666,1px 1px 1px #666,1px 1px 20px #33F;transform:rotate(-3deg);-moz-transform:rotate(-3deg);-webkit-transform:rotate(-3deg);-o-transform:rotate(-3deg);margin:5px;padding:5px} .rbbox:hover{background:url(http://khaidar.wap.sh/black-market7-Fle/black-market7.blogspot.com_iconku-sharingan.gif)no-repeat left Top #696969;-moz-border-radius:5px;box-shadow:-1px -1px 1px #666,1px 1px 1px #666,1px 1px 20px #F70000;-moz-box-shadow:-1px -1px 1px #666,1px 1px 1px #666,1px 1px 20px #F70000;-webkit-box-shadow:-1px -1px 1px #666,1px 1px 1px #666,1px 1px 20px #F70000;transform:rotate(0deg);-moz-transform:rotate(0deg);-webkit-transform:rotate(0deg);-o-transform:rotate(0deg);margin:5px;padding:5px}

6.Kemudian Simpan templates
7.Contoh atau demo ada disetiap Akhir sebuah artikel yang ada dalam blog ini bertulisakan artkel terkait



Terimakasih telah berkunjung di http://black-market7.blogspot.com


.: Artikel Terkait :.

0 komentar:

Posting Komentar

Silahkan berkomentar asalkan tidak mengandung SPAM/SARA, jika komentar mengandng spam maka komentar tidak akan ditampilkan atau dihapus oleh admin blog ini. TERIMAKASIH

Langganan: Posting Komentar (Atom)

Facebook