Cara Membuat Scroll Arsip Blog

Dengan memberikan scroll pada Arsip Blog maka akan membatasi widget Arsip Blog tidak semakin panjang.
Ok,Kita langsung aja ke proses membuat Scroll pada widget Arsip Blog :

  1. Log In ke akun blogger anda
  2. Masuk ke menu template
  3. Klik edit HTML lalu Centang Expand Template Widget
  4. Setelah itu cari kode ]]></b:skin> pada template anda
  5. Copy paste/copas kode di bawah ini lalu taruh di atas kode ]]></b:skin>
    #BlogArchive1 .widget-content{
    height:200px;
    width:auto;
    overflow:auto;
    }
  6. Simpan template dan lihat hasilnya
NB : Untuk tulisan yang berwarna height:200px; itu adalah tinggi scrollnya ,anda bisa sesuaikan tingginya dengan merubah 200px menjadi 150px atau sesuaikan dengan kebutuhan anda.

Membuat Share Button Melayang Di Pinggir Blog


Salah satu sarana untuk mempublikasikan postingan blog kita ke berbagai sosial media yaitu dengan membuat share button atau dalam bahasa Indonesianya yaitu tombol berbagi. Nah untuk itu kini saya share cara Membuat Share Button Melayang Di Pinggir Blog yang sederhana namun besar manfaatnya. Share button ini akan tetap tampil di depan halaman meskipun halaman di roll ke atas atau ke bawah.

Cara Membuat Share Button Melayang Di Pinggir Blog cukup mudah, silahkan Anda masuk ke blog Anda. Dashboard >> Layout >> Add a gadget >> pilih HTML/JavaScript, kemudian copy kode di bawah ini ke dalam gadget tersebut. Jangan dikasih title untuk gadget ini, biarkan kosong.

<div class="addthis_bar addthis_bar_vertical addthis_bar_large" style="background:#FFFFFF; border: 0px solid #000000; top:120px;left:80px;"><div class="addthis_toolbox addthis_default_style"><span><a class="addthis_button_facebook_like" fb:like:layout="box_count"></a></span><span><a class="addthis_button_tweet" tw:count="vertical"></a></span><span><a class="addthis_button_google_plusone" g:plusone:size="tall"></a></span><span><a class="addthis_counter"></a></span><span><div style='border: 0px; padding: 0px; background-color: none; text-align: center; font-size:9px;'> <a href='http://vivablog.blogspot.com/2012/12/membuat-share-button-melayang-di.html' target='_blank'>Klik Saya</a></div></span></div></div> <script type="text/javascript" src="http://s7.addthis.com/js/300/addthis_widget.js"></script>
Mudah kan...? Demikianlah cara Membuat Share Button Melayang Di Pinggir Blog mudah-mudahan bermanfaat.

Cara Membuat Komentar Facebook Berjajar Dengan Komentar Blog


1.Login ke Blogger
2.Pilih Opsi lainya>>Template>>(lebih baiknya backup dulu templatenya biar nanti kalo ada apa-aa ga nyesel)Edit HTML>>Lanjutkan(Centang"Expant Template Widget")
3.Cari kode ]]></b:skin>  kemudian jika sudah ketemu kopas kode dibawah ini tepat diatas kode ]]></b:skin>
.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: #b7b0b0;}
    .comments-tab-icon { height: 14px; width: auto; margin-right: 3px;}
    .comments-tab:hover { background-color: #eeeeee;-moz-transform:rotate(7deg);
-o-transform:rotate(7deg);
-webkit-transform:rotate(7deg);
-ms-transform:rotate(15deg);moz-box-shadow: 10px 5px 5px #222;
    -webkit-box-shadow: 10px 5px 4px #222;
    box-shadow: 10px 5px 5px #222; -moz-border-radius-topleft: 10px;
-moz-border-radius-topright: 10px;
-moz-border-radius-bottomleft: 10px; -moz-border-radius-bottomright: 10px;
}
4.Setelah itu cari kode </head> kemudian kopas kode dibawah ini tepat diatas kode </head>
<script src='http://connect.facebook.net/en_US/all.js#xfbml=1'/>
<script src='http://code.jquery.com/jquery-latest.js'/>
<meta content='ID Facebook' 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>
Jangan lupa untuk mengganti ID Facebook dengan ID facebook sobat.Kalo ga tw lihat contoh  screen shoot ID facebook dibawah ini .

5.Langkah selanjutnya adalah mencari kode <div class='comments' id='comments'> Biasanya ada dua kode semacam itu.Letakkan saja kode dibawah ini tepat dibawah kedua kode tersebut.
<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'>
Angka 2 menunjukkan komentar facebook yang ditampilkan sedangkan angka 400 adalah lebar dari komentar facebook.
5.Langkah yang terakhir adalah"save template".

Powered by Blogger