:.
Manteman ane mau share nih cara menempatkan related post atau artikel terkait di tengah-tengah posting artikel. Ini sangat berguna untuk merekomedasikan pengunjung blog/web kita membaca artikel yang lain yang kita sarankan atau kita rekomendasikan.
Jadi semacam rekomendasi artikel yang kita tempatkan di tengah artikel posting ini lebih besar peluangnya dibaca dan memancing pengunjung betah di blog kita dan membaca banyak artikel posting di blog kita.
Manteman yang menyukai edit html juga bisa memodifikasi coding html di bawah yang ane berikan. Seperti jumlah label yang dimunculkan bisa 1, 2, 3, dst... dan dari setiap label berapa jumlah artikel posting yang kita munculkan bisa 1,,2,3,4, dst.....
Sistem ini sudah banyak digunakan para blogger baik dari platform wordpress atau platform blogspot. Semakin banyak halaman kita yang dibaca dalam perharinya akan menambah nilai tersendiri yang positif baik di mata mesin pencari seperti google, bing, atau yahoo.
Sistem ini pun sangat ampuh bagi manteman yang mengikuti Program PPC seperti Adsense, Chitika, dll. Selain itu ini juga berguna bagi manteman yang mempunyai blog bertemakan cerita, komik, download file, berita, hobi, tutorial, bahkan sampai manteman yang berjualan melalui blog.
Sebenarnya ini sistem ini menggunakan kode hmtl related post pada umumnya yang biasa digunakan para blogger, hanya saja ane meracik sedemikian rupa agar di blogger pun bisa menampilkan rekomendasikan di dalam posting bagian tengah.
Seperti yang manteman liat di posting artikel ini. Selain itu juga manteman dapat menempatkan banner untuk promosi produk atau jasa yang manteman tawarkan atau manteman juga bisa menambahkan untuk iklan pay per click (PPC) serpti Adsense, AdStars, dsb.
Memang metoda ini ane anggap manteman sudah terbiasa dengan utak atik html sebelumnya jadi meminimalkan screenshot gambar di artikel ini he he :D.
1. Masuk ke www.blogger.com dengan akun gmail manteman.
2. Klik Template di sidebar kiri bawah.
3. Ketiga silahkan back up template manteman terlebih dahulu supaya aman jika terjadi sesuatu hal yang tidak diinginkan alias membuat template amburadul nantinya.
4. Keempat klik edit hmtl.
5, Kelima cari kdoe berikut ini <data:post.body>. Biasanya untuk beberapa template seperti template responsive ada dua atau tiga kode seperti itu manteman coba saja yang kedua atau yang ketiga dengan menggantikan kode tersebut dengan kode di bawah ini :
<div expr:id='"post1" + data:post.id'/>
<div class='googlepublisherads' style='margin:20px 0'>
<center>
--di sini untuk kode tml seperti adsense atau banner promosi --
</center>
</div>
<div align='left'>
<b:if cond='data:blog.pageType == "item"'> <div class='related_posts'> <div class='widget-content'> <h4>Baca Juga</h4> <div id='data2007'/><br/><br/> <script type='text/javascript'> var homeUrl3 = "<data:blog.homepageUrl/>"; var maxNumberOfPostsPerLabel = 3; var maxNumberOfLabels = 1; maxNumberOfPostsPerLabel = 3; maxNumberOfLabels = 1; function listEntries10(json) { var ul = document.createElement('ul'); var maxPosts = (json.feed.entry.length <= maxNumberOfPostsPerLabel) ? json.feed.entry.length : maxNumberOfPostsPerLabel; for (var i = 0; i < maxPosts; i++) { var entry = json.feed.entry[i]; var alturl; for (var k = 0; k < entry.link.length; k++) { if (entry.link[k].rel == 'alternate') { alturl = entry.link[k].href; break; } } var li = document.createElement('li'); var a = document.createElement('a'); 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 < json.feed.link.length; l++) { if (json.feed.link[l].rel == 'alternate') { var raw = json.feed.link[l].href; var label = raw.substr(homeUrl3.length+13); var k; for (k=0; k<20; k++) label = label.replace("%20", " "); var txt = document.createTextNode(label); var h = document.createElement('b'); h.appendChild(txt); var div1 = document.createElement('div'); div1.appendChild(h); div1.appendChild(ul); document.getElementById('data2007').appendChild(div1); } } } function search10(query, label) { var script = document.createElement('script'); script.setAttribute('src', query + 'feeds/posts/default/-/' + label + '?alt=json-in-script&callback=listEntries10'); script.setAttribute('type', 'text/javascript'); 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 = "<data:label.name/>"; var test = 0; for (var i = 0; i < labelArray.length; i++) if (labelArray[i] == textLabel) test = 1; if (test == 0) { labelArray.push(textLabel); var maxLabels = (labelArray.length <= maxNumberOfLabels) ? labelArray.length : maxNumberOfLabels; if (numLabel < maxLabels) { search10(homeUrl3, textLabel); numLabel++; } } </b:loop> </b:loop> </script> </div> </div> </b:if>
</div>
<div expr:id='"post2" + data:post.id'><data:post.body/></div>
<script type='text/javascript'>
var obj0=document.getElementById("post1<data:post.id/>");
var obj1=document.getElementById("post2<data:post.id/>");
var s=obj1.innerHTML;
var t=s.substr(0,s.length/2);
var r=t.lastIndexOf("<br>");
if(r>0) {obj0.innerHTML=s.substr(0,r);obj1.innerHTML=s.substr(r+4);}
</script>
Keterangan tambahan nih manteman kalau manteman hanya ingin menampilkan artikel dan tanpa banner iklan di atasnya hapus saja tulisan ini dari kode di atas :
Untuk menampilkan related post ke tengah (Alignt Center) rubah saja pada kode berikut <div align='left'> menjadi <div align='center'> dan untukmenjadi rata kanan (Align right) rubah saja menjadi <div align='right'>
Gimana manteman muncul saran dari satu kategori dan muncul tiga saran artikel yang direkomendasikan :) ?
Jadi semacam rekomendasi artikel yang kita tempatkan di tengah artikel posting ini lebih besar peluangnya dibaca dan memancing pengunjung betah di blog kita dan membaca banyak artikel posting di blog kita.
Manteman yang menyukai edit html juga bisa memodifikasi coding html di bawah yang ane berikan. Seperti jumlah label yang dimunculkan bisa 1, 2, 3, dst... dan dari setiap label berapa jumlah artikel posting yang kita munculkan bisa 1,,2,3,4, dst.....
Sistem ini sudah banyak digunakan para blogger baik dari platform wordpress atau platform blogspot. Semakin banyak halaman kita yang dibaca dalam perharinya akan menambah nilai tersendiri yang positif baik di mata mesin pencari seperti google, bing, atau yahoo.
Sistem ini pun sangat ampuh bagi manteman yang mengikuti Program PPC seperti Adsense, Chitika, dll. Selain itu ini juga berguna bagi manteman yang mempunyai blog bertemakan cerita, komik, download file, berita, hobi, tutorial, bahkan sampai manteman yang berjualan melalui blog.
Sebenarnya ini sistem ini menggunakan kode hmtl related post pada umumnya yang biasa digunakan para blogger, hanya saja ane meracik sedemikian rupa agar di blogger pun bisa menampilkan rekomendasikan di dalam posting bagian tengah.
Seperti yang manteman liat di posting artikel ini. Selain itu juga manteman dapat menempatkan banner untuk promosi produk atau jasa yang manteman tawarkan atau manteman juga bisa menambahkan untuk iklan pay per click (PPC) serpti Adsense, AdStars, dsb.
Memang metoda ini ane anggap manteman sudah terbiasa dengan utak atik html sebelumnya jadi meminimalkan screenshot gambar di artikel ini he he :D.
1. Masuk ke www.blogger.com dengan akun gmail manteman.
2. Klik Template di sidebar kiri bawah.
3. Ketiga silahkan back up template manteman terlebih dahulu supaya aman jika terjadi sesuatu hal yang tidak diinginkan alias membuat template amburadul nantinya.
4. Keempat klik edit hmtl.
5, Kelima cari kdoe berikut ini <data:post.body>. Biasanya untuk beberapa template seperti template responsive ada dua atau tiga kode seperti itu manteman coba saja yang kedua atau yang ketiga dengan menggantikan kode tersebut dengan kode di bawah ini :
<div expr:id='"post1" + data:post.id'/>
<div class='googlepublisherads' style='margin:20px 0'>
<center>
--di sini untuk kode tml seperti adsense atau banner promosi --
</center>
</div>
<div align='left'>
<b:if cond='data:blog.pageType == "item"'> <div class='related_posts'> <div class='widget-content'> <h4>Baca Juga</h4> <div id='data2007'/><br/><br/> <script type='text/javascript'> var homeUrl3 = "<data:blog.homepageUrl/>"; var maxNumberOfPostsPerLabel = 3; var maxNumberOfLabels = 1; maxNumberOfPostsPerLabel = 3; maxNumberOfLabels = 1; function listEntries10(json) { var ul = document.createElement('ul'); var maxPosts = (json.feed.entry.length <= maxNumberOfPostsPerLabel) ? json.feed.entry.length : maxNumberOfPostsPerLabel; for (var i = 0; i < maxPosts; i++) { var entry = json.feed.entry[i]; var alturl; for (var k = 0; k < entry.link.length; k++) { if (entry.link[k].rel == 'alternate') { alturl = entry.link[k].href; break; } } var li = document.createElement('li'); var a = document.createElement('a'); 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 < json.feed.link.length; l++) { if (json.feed.link[l].rel == 'alternate') { var raw = json.feed.link[l].href; var label = raw.substr(homeUrl3.length+13); var k; for (k=0; k<20; k++) label = label.replace("%20", " "); var txt = document.createTextNode(label); var h = document.createElement('b'); h.appendChild(txt); var div1 = document.createElement('div'); div1.appendChild(h); div1.appendChild(ul); document.getElementById('data2007').appendChild(div1); } } } function search10(query, label) { var script = document.createElement('script'); script.setAttribute('src', query + 'feeds/posts/default/-/' + label + '?alt=json-in-script&callback=listEntries10'); script.setAttribute('type', 'text/javascript'); 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 = "<data:label.name/>"; var test = 0; for (var i = 0; i < labelArray.length; i++) if (labelArray[i] == textLabel) test = 1; if (test == 0) { labelArray.push(textLabel); var maxLabels = (labelArray.length <= maxNumberOfLabels) ? labelArray.length : maxNumberOfLabels; if (numLabel < maxLabels) { search10(homeUrl3, textLabel); numLabel++; } } </b:loop> </b:loop> </script> </div> </div> </b:if>
</div>
<div expr:id='"post2" + data:post.id'><data:post.body/></div>
<script type='text/javascript'>
var obj0=document.getElementById("post1<data:post.id/>");
var obj1=document.getElementById("post2<data:post.id/>");
var s=obj1.innerHTML;
var t=s.substr(0,s.length/2);
var r=t.lastIndexOf("<br>");
if(r>0) {obj0.innerHTML=s.substr(0,r);obj1.innerHTML=s.substr(r+4);}
</script>
Keterangan tambahan nih manteman kalau manteman hanya ingin menampilkan artikel dan tanpa banner iklan di atasnya hapus saja tulisan ini dari kode di atas :
--di sini untuk kode tml seperti adsense atau banner promosi --
Untuk menampilkan related post ke tengah (Alignt Center) rubah saja pada kode berikut <div align='left'> menjadi <div align='center'> dan untukmenjadi rata kanan (Align right) rubah saja menjadi <div align='right'>
Gimana manteman muncul saran dari satu kategori dan muncul tiga saran artikel yang direkomendasikan :) ?
