Salam
blogger, Sebelumnya saya pernah mempublikasikan cara membuat widget artikel
terkait di bawah posting Blog, Sebenarnya yang membedakan dengan tutorial saya
kali ini “Cara Membuat Artikel Terkait ( Releated Article ) di Bawah Postingan #PART-2” hanya pada bentuk tampilannya saja.
Bagaimana Cara Membuat
Widget Artikel Terkait bawah Posting Blog Sobat
1.
Masuk ke Dashboard Blogger >> Template >> Edit HTML dan kemudian gunakan
(CTRL + F) untuk mencari tag </ head> di template Anda.
2.
Tambahkan kode di bawah ini hanya sebelum / Di atas penutupan tag </head>
<!--Bloggingpasuruan-Related-Posts-Mulai-->
<style>
#related-posts
{
float : left;
width :
540px;
margin-top:20px;
margin-left
: 5px;
margin-bottom:20px;
font : 11px
Verdana;
margin-bottom:10px;
}
#related-posts
.widget {
list-style-type
: none;
margin :
5px 0 5px 0;
padding :
0;
}
#related-posts
.widget h2, #related-posts h2 {
color :
#940f04;
font-size :
20px;
font-weight
: normal;
margin :
5px 7px 0;
padding : 0
0 5px;
}
#related-posts
a {
color :
#054474;
font-size :
11px;
text-decoration
: none;
}
#related-posts
a:hover {
color :
#054474;
text-decoration
: none;
}
#related-posts
ul {
border :
medium none;
margin :
10px;
padding :
0;
}
#related-posts
ul li {
display :
block;
background
:
url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiZP1GxG-xUs5DUo_ZcX0GhLWSd_WsacXVuGunuJlVh-c_7i3StJy9NfOWyHV8wycn-JU0uf6F7BSQ-kkzZzlsQ2DlZROAca3WwZSIPwFbNxNszEV7T5f8O70XzAu5vpIm09pbNA4pvtkE/s200/greentickbullet.png")
no-repeat 0 0;
margin : 0;
padding-top
: 0;
padding-right
: 0;
padding-bottom
: 1px;
padding-left
: 16px;
margin-bottom
: 5px;
line-height
: 2em;
border-bottom:1px
dotted #cccccc;
}
</style>
<script
src='https://bloggingpasuruan-blogspot-com- artikelterkait.googlecode.com/svn/ARTIKEL_TERKAIT.js'
type='text/javascript'/>
<!--Bloggingpasuruan-Related-Posts-Akhir-->
3. Sekarang mencari baris kode ini:
<data:
post.body />
4. Dan setelah baris tersebut, sisipkan
kode ini:
<!--BLOGGINGPASURUAN-RELATED-POSTS-MULAI-->
<b:if cond='data:blog.pageType ==
"item"'>
<div id='related-posts'>
<font face='Arial' size='3'><b>Related
Posts: </b></font><font color='#FFFFFF'><b:loop
values='data:post.labels' var='label'><data:label.name/><b:if
cond='data:label.isLast != "true"'>,</b:if><b:if
cond='data:blog.pageType == "item"'>
<script expr:src='"/feeds/posts/default/-/"
+ data:label.name + "?alt=json-in-script&callback=related_results_labels&max-results=5"'
type='text/javascript'/></b:if></b:loop> </font>
<script type='text/javascript'> removeRelatedDuplicates();
printRelatedLabels();
</script></div></b:if>
<!--BLOGGINGPASURUAN-RELATED-POSTS-AKHIR-->
5. Catatan: Jika Anda memiliki menggunakan Auto
Read More Hack pada blog Anda dan Anda memiliki lebih dari satu <data: post.body
/> dalam template blog Anda, mencari salah satu kode di bawah ini
dan kemudian melewati kode pada langkah 4 di atas setelah itu.
<p
class = 'post-footer-line post-footer-line-1'>
atau
<div
class = 'post-footer-line post-footer-line-1'>
atau
<div
class = 'footer'>
6.
Simpan template Anda.
Related
Post Widget Konfigurasi
Untuk
mengubah total jumlah posting yang ditampilkan di bawah posting blog Anda, Edit
max-results
= 5 dengan jumlah dari posting terkait yang Sobat inginkan.
Simpan dan Selesai
Saya akan sangat berterima kasih jika sobat Blogger berkenan meninggalkan komentar, saran atau tambahan informasi serta pertanyaan seputar artikel Membuat Widget ARTIKEL TERKAIT dibawah Postingan BLOG. Semoga bermanfaat dan terima kasih..