SELAMAT DATANG DI BLOG BISTORI (BISNIS DAN TUTORIAL) >> Blog yang berisi Panduan Cari Usaha Sampingan dan Bisnis Online Untuk Pemula/Gaptek Internet dan juga Mengenai Tutorial Komputer dan Blogger

Tuesday, 23 October 2012

Cara Membuat Artikel Terkait (Related Post) di Blog

Cara Membuat Artikel Terkait (Related Post) di Blog, Postingan saya kali ini Cara Membuat Artikel Terkait (Related Post) di Blog. Apakah blog anda ingin memasang artikel terkait seperti gambar di bawah, yang pasti banyak manfaatnya.

                                      

Manfaat dari adanya artikel di bawah posting banyak sekali salah satunya digunain untuk membuat pengunjung membaca artikel artikel yang terkait dengan apa yang kita post jadi bisa membetahkan pengunjung juga bisa nambah Page View bagi kita... itu manfaat yang terpenting . Udah tau manfaatnya.

Berikut Tutorial Cara Membuat Artikel Terkait (Related Post) di Blog :
  • Seperti biasa Login ke akun blog anda
  • Pada halaman dashboard pilih Tempelate
  • Pada halaman rancangan klik Edit HTML sebaiknya download tempelate blog anda untuk menghindari proses kesalahan waktu edit
  • Klik Lanjutkan kemudian centang Expand Template Wdget
  • Cari kode ]]></b:skin> (Gunakan tombol F3 pada keyboard untuk melakukan pencarian cepat).



  • Copy kode dibawah ini, lalu paste DI ATAS kode ]]><b/:skin> berikut kodenya :
.rbbox{-moz-box-shadow: inset 0 0 20px #f10c0c;
-webkit-box-shadow: inset 0 0 20px #f10c0c;
box-shadow: inset 0 0 20px #f10c0c;
.rbbox:hover{background-color:#000000);}


  • Selanjutnya, cari kode <data:post.body/> gunakan control F seperti diatas
  • Copy code ini di bawah <data:post.body/>
kode:
<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 = 10;
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>

  • Selanjutnya Simpan Temelate anda
Jika ingin mengganti warna background kotaknya, ganti kode warna ( #f10c0c; ) Dengan warna yang di ingin kan silakan Klik di Sini untuk melihat kode warna nya.
Sekian Cara Membuat Artikel Terkait (Related Post) di Blog semoga bermanfaat.