Telo Blog | Free Software | Tutorial | Tips and Trick

Widget-1 title

Widget-2 title

Widget-3 title

Metal Pointer

Cara Membuat Template SEO Friendly Part 3

kali ini saya akan membahas cara memasang Related Post. Related Post sendiri sebenarnya ada dua macam yaitu: Related Post dengan thumbnail dan tanpa thumbnail. Nah kali ini saya akan membahas Related Post tanpa thumbnail, seperti yang ada di blog saya ini. Mengapa saya lebih memilih yang tanpa thumbnail? Alasannya cukup sederhana, supaya blog saya cepat loading, karena menurut saya salah satu syarat template SEO Friendly yaitu proses loadingnya cepat. Cara memasangnya pun mudah tinggal ikuti langkah-langkah di bawah ini.
1. Login ke akun Blogger sobat.
2. Masuk tab Rancangan lalu pilih Edit HTML.
3. Backup terlebih dahulu template sobat dengan klik Download Template Lengkap, lalu centang Expand Template Widget.
4. Cari kode </b:skin> lalu tambahkan kode di bawah ini sebelum kode tersebut.

.rbbox{border: 1px solid silver;padding: 5px;
background-color: #f0f0f0;-moz-border-radius:5px; margin:5px;}
.rbbox:hover{background-color: #fff;}
#relpostFs {border: 1px solid silver; margin: 0; padding: 3px 5px; overflow: auto; max-height: 200px; -moz-border-radius:5px;}
5. Kemudian cari kode ini <data:post.body/> lalu tambahkan kode berikut di bawahnya.
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<h2>Related Post</h2>
<div class='rbbox'>
<div id='relpostFs'>
<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>
 Tapi jika sobat sudah menggunakan fitur readmore otomatis, letakkan kode di atas setelah <data:post.body/> yang kedua.
6. Simpan template sobat.

Jika sobat belum berhasil atau menemukan masalah tentang tutorial di atas silahkan diuatarakan di komentar.

Categories: ,