Archive Pages Design$type=blogging

Cara Memasang Artikel Terkait di bawah Postingan

Cara Memasang Artikel Terkait di bawah Postingan  -  Bentuk artikel terkait dengan gambar thumbnail seperti sobat temui pada Blog sede...

Cara Memasang Artikel Terkait di bawah Postingan -  Bentuk artikel terkait dengan gambar thumbnail seperti sobat temui pada Blog sederhana ini. Di samping bentuk ‘style’ yang menarik, juga dilengkap screenshoot gambar yang menambah nilai plus ketertarikan pengunjung. Di sisi lain, jumlah tampilan perlabel relatif sedikit, tidak seperti artikel terkait dengan menggunakan scroll. Namun menurut penulis, artikel terkait ini cukup modis dan perlu diterapkan pada Blog. Untuk pemasangannya, silahkan ikuti langkah-langkah berikut ini:
1. Login diakun Blogger sobat,
2. Pada halaman Dasbor, pergi ke Template dan pilih Edit HTML,
3. Pada kotak editor template, sembarang klik disalah satu ‘box’ tersebut, dan
    tekan Ctrl + F, silahkan cari kode </head>,
4. Letakkan CSS dan JavaScript berikut ini sebelum kode </head>,
 <!--Related Posts with thumbnails Scripts and Styles Start-->
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<style type='text/css'>
#related-posts {
float:center;
text-transform:none;
height:100%;
min-height:100%;
padding-top:5px;
padding-left:5px;
}
#related-posts h2{
font-size: 1.3em;
font-weight: bold;
color: #000000;
font-family: Georgia, &#8220;Times New Roman&#8221;, Times, serif;
margin-bottom: 0.75em;
margin-top: 0em;
padding-top: 0em;
}
#related-posts a{
color:#000000;
}
#related-posts a:hover{
color:#000000;
}
#related-posts a:hover {
background-color:#d4eaf2;
}
</style>
<script src='http://eflianda-blogzzz.googlecode.com/files/relatedthumbs.js' type='text/javascript'/>
</b:if>
<!--Related Posts with thumbnails Scripts and Styles End-->
5. Setelah script di atas, cari kode <div class='post-footer'> atau
   <div class='post-footer-line post-footer-line-1'/>, letakkan script berikut di atas kode
    tersebut.
 <!-- Related Posts with Thumbnails Code Start-->
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div id='related-posts'>
<b:loop values='data:post.labels' var='label'>
<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_thumbs&amp;max-results=6&quot;' type='text/javascript'/></b:if></b:loop>
<script type='text/javascript'>
var currentposturl=&quot;<data:post.url/>&quot;;
var maxresults=5;
var relatedpoststitle=&quot;Artikel Terkait&quot;;
removeRelatedDuplicates_thumbs();
printRelatedLabels_thumbs();
</script>
</div><div style='clear:both'/>
</b:if>
<!-- Related Posts with Thumbnails Code End-->
    Angka berwarna biru adalah jumlah posting tampilan related post,
    sesuaikan dengan lebar Blog sobat.
6. Terakhir, klik Simpan Template.

Semoga bermanfaat happy blogging.

sumber : http://www.walman.org/2013/04/cara-membuat-artikel-terkait-thumbnail.htmlhttp://www.walman.org/2013/04/cara-membuat-artikel-terkait-thumbnail.html
-------

COMMENTS

BLOGGER: 2
Loading...
Name

android Animasi Anti Virus Cerita Seram E-book Film Game Indonesia games Games Seram Grafis Hacking info dan tips Komputer joke kesehatan layanan online Lucu mini games PC Games Percayakah Anda? racing game Robot Software Tahukah Anda? Teknologi Baru tips blog Tips Mobile tips-tips photoshop Unik Yang Lain..
false
ltr
item
IZZCHAL-XP: Cara Memasang Artikel Terkait di bawah Postingan
Cara Memasang Artikel Terkait di bawah Postingan
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjNpDXccSJQodfOfqdN7VpUDb13160YJsiKutTHnShddcHhl3_jnpwjpelXDgWiSEwDQlPs8a7-g7hyphenhyphen9JhBSWlSKl6GiAYMlkjmVpPS90BxKrLNjMiPQXjz1cLRdWcD_q108EEPB5piG__c/s400/Capture.PNG
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjNpDXccSJQodfOfqdN7VpUDb13160YJsiKutTHnShddcHhl3_jnpwjpelXDgWiSEwDQlPs8a7-g7hyphenhyphen9JhBSWlSKl6GiAYMlkjmVpPS90BxKrLNjMiPQXjz1cLRdWcD_q108EEPB5piG__c/s72-c/Capture.PNG
IZZCHAL-XP
https://izzchal-xp.blogspot.com/2013/08/cara-memasang-artikel-terkait-di-bawah.html
https://izzchal-xp.blogspot.com/
https://izzchal-xp.blogspot.com/
https://izzchal-xp.blogspot.com/2013/08/cara-memasang-artikel-terkait-di-bawah.html
true
7784019747994949594
UTF-8
Not found any posts VIEW ALL Readmore Reply Cancel reply Delete By Home PAGES POSTS View All RECOMMENDED FOR YOU LABEL ARCHIVE SEARCH Not found any post match with your request Back Home Sunday Monday Tuesday Wednesday Thursday Friday Saturday Sun Mon Tue Wed Thu Fri Sat January February March April May June July August September October November December Jan Feb Mar Apr May Jun Jul Aug Sep Oct Nov Dec just now 1 minute ago $$1$$ minutes ago 1 hour ago $$1$$ hours ago Yesterday $$1$$ days ago $$1$$ weeks ago more than 5 weeks ago