1. Buka Dasbor >> Template >> Edit HTML >> Lanjutkan >> Beri centang pada Expand Template Widget
2. Cari kode ]]></b:skin> setelah ketemu masukan kode berikut ini di atasnya
.rbbox
{
font-family:Federant;
background:#fff;
border:1px solid #ccc;
height:198px;
overflow:auto;
margin:10px 0 15px;
padding:10px
}
.rbbox ul li:hover
{
cursor:pointer;
list-style-image:url(http://4umi.com/image/icon/check.png);
color:#3B5998
}
.rbbox ul li
{
list-style-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgn1-H5MXr19nwb2jS-USn5Ro2qrADXwWyI1wXU2eV-xESUHMx__ZMqy-7oUgmbdCysxUWdI39s0uk4c7103l5QmxKkqDYhg13labf87v26p66pAWlT42XU7xD3XsYORX4Foo9k_FS5Bw4/s12/uncheck.gif);
padding:.5em 0 .5em .3em
}
{
font-family:Federant;
background:#fff;
border:1px solid #ccc;
height:198px;
overflow:auto;
margin:10px 0 15px;
padding:10px
}
.rbbox ul li:hover
{
cursor:pointer;
list-style-image:url(http://4umi.com/image/icon/check.png);
color:#3B5998
}
.rbbox ul li
{
list-style-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgn1-H5MXr19nwb2jS-USn5Ro2qrADXwWyI1wXU2eV-xESUHMx__ZMqy-7oUgmbdCysxUWdI39s0uk4c7103l5QmxKkqDYhg13labf87v26p66pAWlT42XU7xD3XsYORX4Foo9k_FS5Bw4/s12/uncheck.gif);
padding:.5em 0 .5em .3em
}
3. Berikutnya cari kode <data:post.body/> bagi yang sudah memasang read more akan ada dua kode ambil kode yang kedua lalu copy kode berikut ini di bawah kode <data:post.body/>
<b:if cond='data:blog.pageType == "item"'>
<div class='rbbox'>
<div>
<div id='albri'/>
<script type='text/javascript'>
var homeUrl3 = "<data:blog.homepageUrl/>";
var maxNumberOfPostsPerLabel =999;
var maxNumberOfLabels = 999;
maxNumberOfPostsPerLabel = 999;
maxNumberOfLabels = 999;
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>
<div class='rbbox'>
<div>
<div id='albri'/>
<script type='text/javascript'>
var homeUrl3 = "<data:blog.homepageUrl/>";
var maxNumberOfPostsPerLabel =999;
var maxNumberOfLabels = 999;
maxNumberOfPostsPerLabel = 999;
maxNumberOfLabels = 999;
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>
4. Simpan Template
Demikian Membuat Artikel Terkait/Related Post dengan Efek Ceklis kali ini, semoga bisa bermanfaat. jika ada dari sobat yang tidak berhasil silahkan tanya langsung.
10 comments
pertamanya hehe,makasih infonya,ane pakai wordpress ni,jadi hanya baca gak bisa praktek :D
Mungkin yang koment di bawah ane leih memerlukan nya.
pertamaxxx gan,..
datang menyimak,..
:)
Widget artikel terkait diblogku belum ada nih, soalnya setiap kali coba pasang, gagal terus.
Maksud dari tanda cek listnya itu berarti artikel yg sudah kita buka ya mas :D
Wah lebih keren tampilan nya ya sob... ;)
iya nih, jadi bisa fokus ya si pembacanya?
wajib nih saya pasang di blog baru saya sobat...
ke TKP untuk mencoba sobat...
jadi maki keren nih artikel terkait nya
Terima kasih kak
Keren keren nih sob
Post a Comment