Cara memasang artiel terkait di tengah postingan

Cara membuat artikel terkait di dalam artikel dan beginilah cara membuatnya: 

Berikut langkah-langkah cara bikin related post di dalam artikel blogspot :

1. Masuk ke Dasboard
2. Pada menu Design => Edit Html
3. Backup dulu template anda => centeng Expand widget template
4. Cari kode </head> dan letakkan kode script dibawah ini di atas kode </head> 

<script type='text/javascript'> //&lt;![CDATA[ var relatedTitles = new Array(); var relatedTitlesNum = 0; var relatedUrls = new Array(); function related_results_labels(json) { for (var i = 0; i &lt; json.feed.entry.length; i++) { var entry = json.feed.entry[i]; relatedTitles[relatedTitlesNum] = entry.title.$t; for (var k = 0; k &lt; entry.link.length; k++) { if (entry.link[k].rel == &#39;alternate&#39;) { relatedUrls[relatedTitlesNum] = entry.link[k].href; relatedTitlesNum++; break; } } } } function removeRelatedDuplicates() { var tmp = new Array(0); var tmp2 = new Array(0); for(var i = 0; i &lt; relatedUrls.length; i++) { if(!contains(tmp, relatedUrls[i])) { tmp.length += 1; tmp[tmp.length - 1] = relatedUrls[i]; tmp2.length += 1; tmp2[tmp2.length - 1] = relatedTitles[i]; } } relatedTitles = tmp2; relatedUrls = tmp; } function contains(a, e) { for(var j = 0; j &lt; a.length; j++) if (a[j]==e) return true; return false; } function printRelatedLabels() { var r = Math.floor((relatedTitles.length - 1) * Math.random()); var i = 0; while (i &lt; relatedTitles.length &amp;&amp; i &lt; 20) { document.write(&#39;&lt;li&gt;&lt;a href=&quot;&#39; + relatedUrls[r] + &#39;&quot;&gt;&#39; + relatedTitles[r] + &#39;&lt;/a&gt;&lt;/li&gt;&#39;); if (r &lt; relatedTitles.length - 1) { r++; } else { r = 0; } i++; } } //]]&gt; </script>

5. Kemudian cari kode
<div class='entry entry-content'>
6. Lalu copy kode di bawah ini dan letakkan di bawah kode <div class='entry entry-content'>

<b:if cond='data:blog.pageType == &quot;item&quot;'>

<div style='float:right;'>

<div class='related-posts'>

<p>Related posts:</p>

<ol>

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

<b:if cond='data:blog.pageType == &quot;item&quot;'>

<script expr:src='&quot;/feeds/posts/default/-/&quot; + data:label.name + &quot;?alt=json-in-script&amp;callback=related_results_labels&amp;max-results=5&quot;' type='text/javascript'/>

</b:if>

</b:loop>

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

</ol>

</div>

</div>

</b:if>

7. Selesai, simpan template anda


Nah sekarang anda sudah punya Related post / artikel terkait pada blog anda, tapi untuk tampil lebih keren dan lebih menarik, saya akan beri tambahan sedikit sentuhan kode css,caranya yaitu :

- Cari kode ]]></b:skin>
- Lalu copy kode dibawah ini dan letakkan sebelum kode ]]></b:skin>

.related-posts {

border:1px solid #ddd;

background:#D8DFEA;

font-weight:bold;

width: 80%;

float:right;

}

.related-posts p {

margin:5px 10px 5px;

}

.related-posts ol {

font-weight:normal;

margin:0 0 0 25px;

}

.related-posts li {

margin-bottom: 2px;

}

selamat mencoba.

Tweet

Sign up here with your email address to receive updates from this blog in your inbox.