Cara membuat artikel terkait di blog

Artikel terkait, atau biasanya sering juga di sebut dengan istilah related post memiliki manfaat bagi pemilik blog sendiri dan juga pengunjung. Selain untuk meningkatkan page view, related post juga berguna untuk mempermudah dalam melakukan navigasi ketika pengunjung ingin mencari sesuatu hal yang berhubungan. Banyak sekali postingan yang membahas tentang hal ini, namun tidak semua cara yang saya lakukan berhasil. Karena mungkin ada beberapa html yang kurang atau tidak compatible pada template yang anda gunakan.

Jika anda menggunakan template standard bawaan blogspot, mungkin anda bisa mencoba membuat related post dengan cara di bawah ini.

Cara membuat postingan terkait di blogspot :

– First, pastinya silahkan login dulu ke account blogger anda.

– Setelah login, klik ‘Template’ > ‘Edit html’.

– Sebelum melakukan perubahan pada html, pastikan centang ‘Expand Widget Templates’ dan silahkan mem-backup kode html blog anda untuk mengantisipasi jika seandainya cara ini tidak berhasil.

– Cari kode <div class=’post-footer-line post-footer-line-1′>. Untuk mempermudah, anda bisa melakukan pencarian cepat dengan menekan Ctrl+F.

– Setelah anda menemukan kode tersebut, pilih kode <div class=’post-footer-line post-footer-line-1′> yang pertama. Karena biasanya akan terdapat dua buah kode seperti di atas.

– Lalu, copy code di bawah ini :

<b:if cond=’data:blog.pageType == &quot;item&quot;’>
<H2>Postingan terkait :</H2>
<Div class=’rbbox’>
<Div style=’margin:0; padding:10px;height:120px;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 = 12;
maxNumberOfLabels = 4;
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>

– Kemudian paste-kan kode tersebut di bawah kode <div class=’post-footer-line post-footer-line-1′>

– Langkah terakhir, ‘Save Template’.

Silahkan di cek. Semoga berhasil ya..

Info tambahan :

Tulisan pada kode <H2>Postingan terkait :</H2> dapat anda ubah menjadi sesuai dengan keinginan anda. (Misalnya : Related Post, More Posts, Artikel lainnya).

maxNumberOfPostsPerLabel = 12; merupakan jumlah artikel terkait atau postingan yang ingin di tampilkan pada blog. Sedangkan maxNumberOfLabels = 4; adalah jumlah kategori atau label terkait yang ingin di tampilkan.Jika anda ingin merubahnya, cara cukup melakukan perubahan pada angkanya saja.

About Andy Febrian 532 Articles
Menyukai dunia web development, Wordpress lovers, writing dan blogging. Simple & apa adanya. Semoga tulisan di atas bermanfaat :)

Be the first to comment

Leave a Reply

Your email address will not be published.


*