Baiklah Kali ini saya ingin berbagi Tutorial Blogging yaitu Cara Membuat Related Post/ Artikel Terkait di bawah postingan. Tutorial ini sebenarnya juga untung catatan agar saya tidak lupa bagaimana cara membuatnya, namun sekalian saya share agar temen temen yang sedang mencari Tutorial Membuat Artikel Terkait di bawah postingan dapat terbantu dengan artikel ini, sebenarnya artikel terkait/ Related post dibawah postingan atau di sidebar itu sama saja, tergantung pada selera masing masing.
2. Dari halaman dasbor/dashboard, pilih dan klik Design atau Rancangan.
3. Klik Edit HTML dan tandai Expand Widget Template (sebaiknya download dulu template Anda sebagai backup untuk berjaga jaga jika terjadi kesalahan)
4. Cari kode ini <data:post.body/>
5. Jika sudah ketemu sekarang, Letakkan script code berikut ini di bawah kode <data:post.body/> yang sudah ketemu tadi.
<b:if cond='data:blog.pageType == "item"'>
<div class='similiar'>
<div class='similiar'>
<div class='widget-content'>
<h3>Related Post</h3>
<div id='data2007'/><br/><br/>
<script type='text/javascript'>
<h3>Related Post</h3>
<div id='data2007'/><br/><br/>
<script type='text/javascript'>
var homeUrl3 = "<data:blog.homepageUrl/>";
var maxNumberOfPostsPerLabel = 4;
var maxNumberOfLabels = 10;
var maxNumberOfPostsPerLabel = 4;
var maxNumberOfLabels = 10;
maxNumberOfPostsPerLabel = 100;
maxNumberOfLabels = 3;
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;
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 (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 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);
}
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;
var numLabel = 0;
<b:loop values='data:posts' var='post'>
<b:loop values='data:post.labels' var='label'>
textLabel = "<data:label.name/>";
<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>
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>
</b:if>
6. Save Template, lihat hasilnya
BACA JUGA YANG INI :
Blogger Tutorial
- Cara Membuat Tabel,kotak,kolom di Blog
- Cara membuat kotak iklan (Banner Box)
- Membuat Recent Post by Label Thumbnail Saja
- Cara Membuat Menu Navigasi Horisontal Bercabang / Drop Down
- CopyGator | Menemukan Penggemar Situs Anda
- Cara membuat status loading blog
- cara membagi elemen gadget menjadi dua kolom
- Membuat Rocking Rolling Rounded Menu dengan JQuery dan CSS3
- Merubah Judul Postingan Yang SEO Friendly
- Cara membuat efek shadow pada judul posting
- Membuat Readmore Dengan Gambar & Teks
- Kunci Merubah Ukuran Blogger Anda(kelas pemula)
- Cara Merubah Lebar Halaman Posting di Blogger (kelas pemula)
- Cara Merubah Ukuran Sidebar Pada Blogger (kelas pemula)
- Cara Merubah Ukuran Header Pada Blogger (kelas pemula)
- Cara Mendaftarkan Blog/Website ke Bing Webmaster Tools - Tutorial
- Cara Paling Ampuh Atasi Komentar Spam Yang Merajalela
- Cara Mendaftar Dan Setting FeedBurner
- Menampilkan daftar isi pada label tertentu
- Cara Menghilangkan Tulisan Showing All Posts With Label di Blog
- Widget Random Post Dengan Thumbnail Via 2leep
- Cara Mudah Membuat Menu Tab View
- Cara Mengedit Template HTML Blog Yang Baik Dan Benar
- Cara Membuat Menu Horizontal Drop Down Versi 2