Cara pasang related post di blog 2

walaupun postingan ini banyak di google tapi demi melengkapi blog saya. tak masalah kalau ini terbilang basi. Related post atau postingan terkait Sangat Berguna untuk Blog anda Terutama SEO. related pos bekerja ketika postingan anda akan di tampilkan di bawah postingan yang terkait dengan postingan tersebut sehingga merujuk pembaca untuk banyak membaca lebih banyak di blog anda sehingga membuat pengunjung betah untuk membaca lebih banyak postingan anda. untuk kali ini saya akan berbagi pada anda 2 buah related pos untuk anda

Note : INI beda dengan Penggunaan Link Within karenra link within bekerja secara random post dan tidak ada sangkut pautnya dengan posting terkait dan penggunaan label di setiap postingan Anda

1.yang pertama : ini mirip dengan yang saya pakai di bawah postingan saya
cara ini paling gampang untuk membuat related post

1.login ke akun blog anda klik rancangan lalu edit html

klik Expand Template Widget

cari kode : <data:post.body/> Note: gunakan CTRL+F untuk mencari codenya
copy code di bawah ini tepat di bawah kode <data:post.body/>

Note : bila anda sudah menggunakan auto readmore ada 4 atau 3 code anda letakan code di bawah ini di kode yang ke tiga lihat pada gambar di bawah

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<br/>
<br/>
<H2>Read other articles:</H2>
<div class='cayunbox'>
<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>

NOTE: Perhatikan code yang berwarna merah "Baca Artikel lainya"itu bisa Anda ganti dengan nama keinginan kalian

Selanjutnya untuk Pengaturan CSSny tapi ini tergantung anda mau pake atau tidak Disini Saya tidak pake Code CSS tapi saya tidak tahu untuk template Anda , anda Masukan saja Code CSS nya

sekarang anda cari kode ]]></b:skin>   dan anda copy code di bawah ini di atas code ]]></b:skin>

.cayunbox{border: 1px solid #000000;padding: 5px;
 background-color: #7BFAAF;-moz-border-radius:5px; margin:5px;}
.cayunbox:hover{background-color: #CE44F0;}

selanjutnya Anda simpan dan lihat Hasilnya :

2. untuk Cara yang kedua ini  related pos anda akan berada tepat di bawah label anda dan bisa lihat gambar di bawah ini

Bila anda tertarik dengan related post ini anda bisa ikuti langkah langkah berikut ini

1.login ke akun blog anda klik rancangan lalu edit html

klik Expand Template Widget

cari kode : </head> Note: gunakan CTRL+F untuk mencari codenya

<script type="text/javascript">
//<![CDATA[
var relatedTitles = new Array();
var relatedTitlesNum = 0;
var relatedUrls = new Array();
function related_results_labels(json) {
for (var i = 0; i < json.feed.entry.length; i++) {
var entry = json.feed.entry[i];
relatedTitles[relatedTitlesNum] = entry.title.$t;
for (var k = 0; k < entry.link.length; k++) {
if (entry.link[k].rel == 'alternate') {
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 < 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 < 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;
document.write('<ul>');
while (i < relatedTitles.length && i < 20) 
document.write('<li><a href="' + relatedUrls[r] +
'">' + relatedTitles[r] + '</a></li>');
if (r < relatedTitles.length - 1) {
r++;
} else {
r = 0;
}
i++;
}
document.write('</ul>');
}
//]]>
</script>

2. Selanjutnya Anda cari code <data:postLabelsLabel/> code lengkapnya seperti ini:

 <b:if cond='data:post.labels'> <data:postLabelsLabel/> <b:loop values='data:post.labels' var='label'> <a expr:href='data:label.url' rel='tag'><data:label.name/></a><b:if cond='data:label.isLast != "true"'>,</b:if> </b:loop> </b:if>

Selanjutnya Anda hapus code tersebut dan ganti dengan code dibawah ini dan simpan

<b:if cond='data:post.labels'>    <data:postLabelsLabel/>    <b:loop values='data:post.labels' var='label'>    <a expr:href='data:label.url'  rel='tag'><data:label.name/></a><b:if cond='data:label.isLast  != "true"'>,</b:if>    <b:if  cond='data:blog.pageType == "item"'>    <script  expr:src='"/feeds/posts/default/-/" + data:label.name +  "?alt=json-in-script&amp;callback=related_results_labels&amp;max-results=10"'  type='text/javascript'/>    </b:if>    </b:loop>    </b:if>        <p>    <h2>Baca  ini juga :</h2>    </p>        <script  type='text/javascript'>    removeRelatedDuplicates();    printRelatedLabels();    </script>

NOTE: sebenaarnya Anda hanya perlu menambahkan code yang berwarna merah saja tapi biar gampang ganti saja code ke 2 dengan kode ketiga ini.
selamat mencobanya bila artikel ini membantu saya harap untuk memberi saya +1 atau like facebook atau join site dan silahkan Anda Berkomentar

TRIMS : SENANTIASA BELAJAR