Membuat Related Post thumbnail blogger

Lanjut lagi belajarnya. :D Kali ini saya akan membahas tentang bagaimana cara untuk membuat related post dengan thumbnail/gambar di bawah psstingan blogger anda. Oh iya sebelumnya saya ucapkan terimakasih karena tlah bersedia mampir di blog cara mendapatkan uang dari internet yang sederhana ini. Semoga saja juragan-juragan pada betah. :D
Tidak usah muter-muter lagi ya, langsung saja kita pelajari bagaimana cara untuk membuat related post atau postingan terkait dengan thumbnail/gambar di bawah psstingan blogger anda.
1. Pertama yang perlu anda lakukan adalah login ke akun blogger anda.
2. Kemudian masuk ke kategori template dan edit html. Demi keamanan saya sarankan untuk memback up template anda terlebih dahulu.
3. Cari kode </head>
Letakkan kode di bawah ini di atas kode </head>

<!--Related Posts with thumbnails Start-->
<!-- remove --><b:if cond='data:blog.pageType == &quot;item&quot;'>
<style type='text/css'>
#related-posts {
float:center;
height:100%;
min-height:100%;
padding-top:10px;
padding-left:15px;
padding-right:15px;
}

#related-posts h2{
font-size: 1.3em;
color: black;
font-family: Arial;
margin-bottom: 0.75em;
}

#related-posts a{
color:black;
}

#related-posts a:hover {
background-color:#eeeeee;
}
</style>
<script type='text/javascript'>
var defaultnoimage="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj9k_Fz4mnzl_erIV4OX7nR0sqC38JI_3-p9aY4Auha2H6-HDXlvy16u3RHfxc6unNXNmEi8bOTak0ovEJkeEjHlUfmRYZ9X8k15cO9xoX8Zo-xRLvWR8cTJIzpOUGEGf04IzkrpcdsYF16/";
var maxresults=5;
var splittercolor="#cccccc";
var relatedpoststitle="You might also like:";
</script>
<script src='http://hbhost.googlecode.com/files/related-posts-with-thumbnails-for-blogger.js' type='text/javascript'/>
<!-- remove --></b:if>
<!--Related Posts with thumbnails End--> 

 4. Kemudian cari <p class='post-footer-line post-footer-line-1'/>

5. Kalau tidak ketemu coba cari post-footer-line

6. Letakkan kode berikut dibawahnya.

<!-- Related Posts with Thumbnails Code Start-->
<!-- remove --><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>
<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:loop>
<script type='text/javascript'>
removeRelatedDuplicates_thumbs();
printRelatedLabels_thumbs(&quot;<data:post.url/>&quot;);
</script>
</div><div style='clear:both'/>
<!-- remove --></b:if>
<!-- Related Posts with Thumbnails Code End-->

7. Simpan dan lihat template abda :)

More about → Membuat Related Post thumbnail blogger

Cara Membuat FB Coment berdampingan dengan Blogger Coment (Cara 2)

Saya ingin memposting bagaimana Cara Membuat FB Coment berdampingan dengan Blogger Coment dengan cara yang berbeda dari cara yang sebelumnya.  


 


Langsung saja kita ikuti langkah-langkahnya.
1. Login ke akun blogspot agan
2. Pilih template(saya sarankan untuk diback up dulu) dan edit html
3. Kemudian cari kode ini <div class='comments' id='comments'>

  (biasanya ada 2 kode <div class='comments' id='comments'>, dan anda harus copy kan pada kode yang kedua letaknya pada bagian bawah).

<div class='comments-tab' id='fb-comments' onclick='javascript:commentToggle(&quot;#fb-comments&quot;);' title='Comments made with Facebook'>
<img class='comments-tab-icon' src='http://static.ak.fbcdn.net/rsrc.php/v1/yH/r/eIpbnVKI9lR.png'/>
<fb:comments-count expr:href='data:post.url'/> Comments
</div>
<div class='comments-tab inactive-select-tab' id='blogger-comments' onclick='javascript:commentToggle(&quot;#blogger-comments&quot;);' title='Comments from Blogger'>
<img class='comments-tab-icon' src='http://www.blogger.com/img/icon_logo32.gif'/> <data:post.numComments/> Comments
</div><div class='clear'/>
</div>
<div class='comments-page' id='fb-comments-page'>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div id='fb-root'/>
<fb:comments expr:href='data:post.url' num_posts='2' width='400'/>
</b:if>
</div>
<div class='comments comments-page' id='blogger-comments-page'>

<script src='http://connect.facebook.net/en_US/all.js#xfbml=1'/>
<script src='http://code.jquery.com/jquery-latest.js'/>
<meta content=' ID FB agan' property='fb:admins'/>
<script type='text/javascript'>
function commentToggle(selectTab) {
$(".comments-tab").addClass("inactive-select-tab");
$(selectTab).removeClass("inactive-select-tab");
$(".comments-page").hide();
$(selectTab + "-page").show();
}
</script>
<style>.comments-page { background-color: #f2f2f2;}
#blogger-comments-page { padding: 0px 5px; display: none;}
.comments-tab { float: left; padding: 5px; margin-right: 3px; cursor: pointer; background-color: #f2f2f2;}
.comments-tab-icon { height: 14px; width: auto; margin-right: 3px;}
.comments-tab:hover { background-color: #eeeeee;}
.inactive-select-tab { background-color: #d1d1d1;}</style>

ganti  ID FB agan dengan id fb milik agan misalkan http://www.facebook.com/id-kamu atau http://www.facebook.com/12345678


Kemudian disave ya... :)

sekian tutorial Cara Membuat FB Coment berdampingan dengan Blogger Coment

 

More about → Cara Membuat FB Coment berdampingan dengan Blogger Coment (Cara 2)