Iklan

Cara Membuat Artikel Terkait ( Releated Article ) di Bawah Postingan #PART-2

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(&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiZP1GxG-xUs5DUo_ZcX0GhLWSd_WsacXVuGunuJlVh-c_7i3StJy9NfOWyHV8wycn-JU0uf6F7BSQ-kkzZzlsQ2DlZROAca3WwZSIPwFbNxNszEV7T5f8O70XzAu5vpIm09pbNA4pvtkE/s200/greentickbullet.png&quot;) 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 == &quot;item&quot;'>
<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 != &quot;true&quot;'>,</b:if><b:if cond='data:blog.pageType == &quot;item&quot;'>
<script expr:src='&quot;/feeds/posts/default/-/&quot; + data:label.name + &quot;?alt=json-in-script&amp;callback=related_results_labels&amp;max-results=5&quot;' 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..

Next
Prev Post
Previous
Next Post
Buka Komentar