Tidak dapat di pungkiri lagi bahwa Situs jejaring sosial dan lainya berperan penting untuk mempromosikan blog kita . Artikel tetang tombol share sudah berkali-kali saya posting dengan berbagai bentuk , dan tujuannya adalah selain untuk mempercantik tampilan blog tetapi juga berperan penting untuk mempromosikan blog kita .Pada kesempatan kali ini saya akan share tutorial tentang Cara Membuat Floating Share Button Di Blog keunggulan dari tutorial kali ini adalah tombol sharenya mengikuti cursor blog kita jadi ketika kita memutar gerigi mouse maka tombol share itu akan mengikuti gerakan layar komputer.
Tentu saja ini akan memudahkan pengunjung untuk membagikan artikel kita kebeberapa situs jejaring sosial yang banyak tersebar di dunia maya, dan otomatis akan banyak orang yang akan membaca artikel blog anda dan bisa mendongkrak jumlah pengunjung blog anda. Nah bagi yang ingin langsung menerapkan trik ini maka simaklah tutorial ini dengan baik.
Cara Membuat Floating Share Button Di Blog:
1.Login ke blogger dengan akun yang anda miliki.
2.Pilih Rancangan » Edit HTML.
3.Klik tombol Expand Template Widget. Dan disarankan untuk memback up dulu template sobat dengan mengklik tombol download template lengkap.
4.Letakkan tombol CSS di bawah ini diatas kode ]]></b:skin> .
# Kode yang berwana biru adalah warna garis pinggir tombol floating
share nya.
5.Jika sudah letakkan kode dibawah ini di atas kode <div class='post-header-line-1'/> .
Demikian dulu tutorial tentang Cara Membuat Floating Share Button Di Blog . Semoga bisa bermanfaat bagi kita semua
3.Klik tombol Expand Template Widget. Dan disarankan untuk memback up dulu template sobat dengan mengklik tombol download template lengkap.
4.Letakkan tombol CSS di bawah ini diatas kode ]]></b:skin> .
#sharebuttonfery {Keterangan : # Kode yang berwarna orange adalah warna background nya .
background-color:#FFFFFF;
border-color:#C1CDCD;
border-style:solid;
border-width:1px;
left:5px;
bottom:150px;
margin-top:10px;
position:fixed;
width:64px;
}
#sharebuttonfery .float {margin:7px}
.FBConnectButton_Text
{
font-size: 8px;
padding:2px 4px 3px !important;
}
# Kode yang berwana biru adalah warna garis pinggir tombol floating
share nya.
5.Jika sudah letakkan kode dibawah ini di atas kode <div class='post-header-line-1'/> .
<b:if cond='data:blog.pageType == "item"'>6.Save template sobat dan lihatlah hasilnya .
<div id='sharebuttonfery'>
<div class='float'><script src='http://tweetmeme.com/i/scripts/button.js' type='text/javascript'/></div>
<div class='float'><a href='http://www.facebook.com/sharer.php' name='fb_share' type='box_count'>Share</a><script src='http://static.ak.fbcdn.net/connect.php/js/FB.Share' type='text/javascript'/><div class='clear'/></div>
<div class='float'><a class='google-buzz-button' data-button-style='normal-count' href='http://www.google.com/buzz/post' title='Post on Google Buzz'/>
<script src='http://www.google.com/buzz/api/button.js' type='text/javascript'/></div>
<div class='float'><script src='http://www.stumbleupon.com/hostedbadge.php?s=5'/></div>
</div>
</b:if>
Demikian dulu tutorial tentang Cara Membuat Floating Share Button Di Blog . Semoga bisa bermanfaat bagi kita semua
0 komentar:
Posting Komentar