Tips Blogger kali ini "Cara membuat Kolom Postingan Terkait (Related Post)". Kolom ini sangat penting untuk memudahkan pengunjung melihat artikel lain dengan kategori yang serupa dengan halaman yang sedang dibacanya. Jadi para pengunjung tidak harus mencari melalui kolom Arsip atau kolom kategori satu persatu hanya untuk mencari daftar bacaan yang sejenis, karena kolom ini secara otomatis akan menampilkan daftar post yang berkaitan.
2. Pada Dashboard klik dan pilih Template, lalu pilih edit HTML.
3. Carilah kode <data:post.body/></b:if> jika tidak ada cari kode <data:post.body/>
4.Copy kode script di bawah berikut, dan letakkan tepat setelah/di bawah kode yang dicari tadi.
note : untuk text berwarna merah untuk judul kolomnya pada script kode di atas bisa anda ganti dengan nama yang lain.
5. Cari kode ]]></b:skin> , jika sudah ketemu silahkan letakkan kode script di bawah berikut sebelum/di atas kode ]]></b:skin>
6. Save Template dan lihat hasilnya dengan mengklik salah satu post anda, dan widget atau kolom related post berada di bawah post
Cara Membuat Kolom Related Post atau Artikel Terkait
1. Login ke akun Bloger anda.2. Pada Dashboard klik dan pilih Template, lalu pilih edit HTML.
3. Carilah kode <data:post.body/></b:if> jika tidak ada cari kode <data:post.body/>
4.Copy kode script di bawah berikut, dan letakkan tepat setelah/di bawah kode yang dicari tadi.
<b:if cond='data:blog.pageType == "item"'>
<br/>
<br/>
<H2>Related Post:</H2>
<div class='rbbox'>
<div style='margin:0; padding:10px;height:200px;overflow:auto;border:1px solid #ccc;'>
<div id='albri'/>
<script type='text/javascript'>
var homeUrl3 = "<data:blog.homepageUrl/>";
var maxNumberOfPostsPerLabel = 4;
var maxNumberOfLabels = 10;
maxNumberOfPostsPerLabel = 9999;
maxNumberOfLabels = 3;
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('albri').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>
<script type="text/javascript">RelPost();</script>
</div>
</b:if>
<br/>
<br/>
<H2>Related Post:</H2>
<div class='rbbox'>
<div style='margin:0; padding:10px;height:200px;overflow:auto;border:1px solid #ccc;'>
<div id='albri'/>
<script type='text/javascript'>
var homeUrl3 = "<data:blog.homepageUrl/>";
var maxNumberOfPostsPerLabel = 4;
var maxNumberOfLabels = 10;
maxNumberOfPostsPerLabel = 9999;
maxNumberOfLabels = 3;
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('albri').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>
<script type="text/javascript">RelPost();</script>
</div>
</b:if>
note : untuk text berwarna merah untuk judul kolomnya pada script kode di atas bisa anda ganti dengan nama yang lain.
5. Cari kode ]]></b:skin> , jika sudah ketemu silahkan letakkan kode script di bawah berikut sebelum/di atas kode ]]></b:skin>
.rbbox{border: 1px solid rgb(192, 192, 192);padding: 5px;
background-color: #f0f0f0;-moz-border-radius:5px; margin:5px;}
.rbbox:hover{background-color: rgb(255, 255, 255);}
background-color: #f0f0f0;-moz-border-radius:5px; margin:5px;}
.rbbox:hover{background-color: rgb(255, 255, 255);}
6. Save Template dan lihat hasilnya dengan mengklik salah satu post anda, dan widget atau kolom related post berada di bawah post
Beri Kami +1 Agar Terus Semangat Menulis Untuk Anda :
Hati-Hati Jika ingin Copy-Paste (15 Blog Sudah TERHAPUS Akibat DMCA Takedown)..!
Pastikan Menyertakan Link Aktif Dofollow Dengan URL :
https://odyckdnero.blogspot.com/2012/07/cara-membuat-kolom-related-post-artikel.html
Related Post
Blogspot
- Menghilangkan icon Obeng dan Tang diedit Blogger
- Membuat Widget Tanggalan Sendiri
- Cara Membuat dan Memasang Widget Twitter di Blogger
- Membuat Background Template Tidak Bergerak
- Tambah Like Button Facebook Hide and Show di Blog
- Tambah Like Button Facebook di Blog
- Memasang Flash Game di Blogger
- Memberi Efek Zoom Pada Image Dengan Jquery
- Membuat Elemen Footer Multi Kolom
Blogging
- Mengembalikan Akun Twitter Yang Ditangguhkan
- Cara Cepat Meningkatkan Ranking Alexa
- Membuat Widget Tanggalan Sendiri
- Mengukur Kecepatan Loading Blog
- Cara Agar Artikel Cepat Terindeks Search Engine
- Daftar Blog Dofollow
- Membuat Text Area III (Hide and Show Atau Spoiler)
- Membuat Efek Blur Pada Gambar
- Memasang Flash Game di Blogger
0komentar:
Post a Comment
*Silahkan tinggalkan komentar, saran atau kritik sesuai topik untuk kemajuan blog ini.
*Komentar anda secepat mungkin direspon, karena saya tidak selalu online.
*KOMENTAR TIDAK SOPAN, BERIKLAN, VULGAR, MELECEHKAN, SARA atau PROVOKATIF akan dianggap SPAM, dan berakhir di Tong Sampah..!!!