Cara Membuat Tombol Sharing Super Keren Di Bawah Postingan Blog Part 2

Assalamualaikum wr wb

setelah saya berhasil membuat artikel tentang Cara Membuat Tombol Share Di Bawah Postingan Blog Part 1 , Di malam ini saya mau berbagi lagi tentang bagaimana Cara Membuat Tombol Sharing Super Keren Di Bawah Postingan Blog Part 2 

Artikel Terkait : 

• Download Windows 8 Pro + License Key Full Version
• Cara Setting BIOS Ke CD/DVD Rom 
• Cara Install Ulang Windows 7 Lengkap + Gambar
• Cara Membuat Tombol Menu Super Keren Part 1

ok kalau begitu kita lihat screenshot y terlebih dahulu kurang lebih seperti ini..

Ingat Harus Mengikuti Langkah Demi Langkah Sesuai Dengan Tutorial Ini ,Karena telah saya coba terlebih dahulu dan WORK !!!

Ok langsung kita praktekan  

1. Kalian masuk kedasbor blogger kalian masing-masing, terus pilih template, edit html
2. Kalian cari kode </head> pake Ctrl+F biar cepet. Lalu letakkan kode dibawah ini diatas kode </head>

<!--full-akses.blogspot.com-starts-->

<style type='text/css'>

div.beauty-bookmarks {height:54px;background:url(&#39;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhfkcoK7cPCyPspDsiiZ36YGHaojBxcEzpD4RKnNillpS8qO6e8Ay7yW77HmvSFubopXVY_veqg_VlpW0AEo1P25yHlBxtOQLTc5vobVnlF1kAdUri0hZXBt5s7kBZQIGRk1JNWGc3VUZkm/s1600/buka-rahasia-sharing-background.png&#39;) no-repeat left top;position:relative;width:540px;}

div.beauty-bookmarks span.beauty-rightside {width:17px;height:54px;background:url(&#39;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhfkcoK7cPCyPspDsiiZ36YGHaojBxcEzpD4RKnNillpS8qO6e8Ay7yW77HmvSFubopXVY_veqg_VlpW0AEo1P25yHlBxtOQLTc5vobVnlF1kAdUri0hZXBt5s7kBZQIGRk1JNWGc3VUZkm/s1600/buka-rahasia-sharing-background.png&#39;) no-repeat right top;position:absolute;right:-17px;}

div.beauty-bookmarks ul.socials {margin:0 !important;padding:0 !important;position:absolute;bottom:0;left:10px;}

div.beauty-bookmarks ul.socials li {display:inline-block !important;float:left !important;list-style-type:none !important;margin:0 !important;height:29px !important;width:48px !important;cursor:pointer !important;padding:0 !important;}

div.beauty-bookmarks ul.socials a {display:block !important;width:48px !important;height:29px !important;font-size:0 !important;color:transparent !important;}

.beauty-furl, .beauty-furl:hover, .beauty-digg, .beauty-digg:hover, .beauty-reddit, .beauty-reddit:hover, .beauty-stumble, .beauty-stumble:hover, .beauty-delicious, .beauty-delicious:hover, .beauty-yahoo, .beauty-yahoo:hover, .beauty-blinklist, .beauty-blinklist:hover, .beauty-technorati, .beauty-technorati:hover, .beauty-facebook, .beauty-facebook:hover, .beauty-twitter, .beauty-twitter:hover, .beauty-myspace, .beauty-myspace:hover, .beauty-mixx, .beauty-mixx:hover, .beauty-script-style, .beauty-script-style:hover, .beauty-designfloat, .beauty-designfloat:hover, .beauty-syndicate, .beauty-syndicate:hover, .beauty-email, .beauty-email:hover {

background:url(&#39;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhRtvq_daDEtcvXjPUPY-fzG4O2tZd8q8gp1-4VUH30wMF6_6gSyl_phesks4AMvpppnOLvgpmts8sh4bCdlS-mgXfzq5p1wut2rfHJM4ALRkjL8GfCwntR_jTJbOGZLiWh27mhFrpYfDiQ/s1600/bukarahasia-sexysprite.png&#39;) no-repeat !important;}

.beauty-furl {background-position:-300px top !important;}

.beauty-furl:hover {background-position:-300px bottom !important;}

.beauty-digg {background-position:-500px top !important;}

.beauty-digg:hover {background-position:-500px bottom !important;}

.beauty-reddit {background-position:-100px top !important;}

.beauty-reddit:hover {background-position:-100px bottom !important;}

.beauty-stumble {background-position:-50px top !important;}

.beauty-stumble:hover {background-position:-50px bottom !important;}

.beauty-delicious {background-position:left top !important;}

.beauty-delicious:hover {background-position:left bottom !important;}

.beauty-yahoo {background-position:-650px top !important;}

.beauty-yahoo:hover {background-position:-650px bottom !important;}

.beauty-blinklist {background-position:-600px top !important;}

.beauty-blinklist:hover {background-position:-600px bottom !important;}

.beauty-technorati {background-position:-700px top !important;}

.beauty-technorati:hover {background-position:-700px bottom !important;}

.beauty-myspace {background-position:-200px top !important;}

.beauty-myspace:hover {background-position:-200px bottom !important;}

.beauty-twitter {background-position:-350px top !important;}

.beauty-twitter:hover {background-position:-350px bottom !important;}

.beauty-facebook {background-position:-450px top !important;}

.beauty-facebook:hover {background-position:-450px bottom !important;}

.beauty-mixx {background-position:-250px top !important;}

.beauty-mixx:hover {background-position:-250px bottom !important;}

.beauty-script-style {background-position:-400px top !important;}

.beauty-script-style:hover {background-position:-400px bottom !important;}

.beauty-designfloat {background-position:-550px top !important;}

.beauty-designfloat:hover {background-position:-550px bottom !important;}

.beauty-syndicate {background-position:-150px top !important;}

.beauty-syndicate:hover {background-position:-150px bottom !important;}

.beauty-email {background-position:-753px top !important;}

.beauty-email:hover {background-position:-753px bottom !important;}

</style>

<!--bebas-akses.blogspot.com-ends-->

3. Selanjutnya, kalian cari kode <data:post.body/>. Jika kalian sudah memsang auto readmore, maka akan ada 2 atau lebih kode ini. Yang kalian cari adalah kode yang no 2 dari sekian kode <data:post.body/>. Jika sudah ketemu, masukkan script dibawah ini tepat dibawah kode<data:post.body/> yang kedua tadi.

<!--full-akses.blogspot.com-starts-->

<b:if cond='data:blog.pageType == &quot;item&quot;'>

<center><div class='beauty-bookmarks'>

<ul class='socials'>

<li class='beauty-delicious'><a expr:href='&quot;http://del.icio.us/post?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank'/></li>

<li class='beauty-digg'><a expr:href='&quot; http://digg.com/submit?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank'/></li>

<li class='beauty-technorati'><a expr:href='&quot; http://technorati.com/faves?add=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank'/></li>

<li class='beauty-reddit'><a expr:href='&quot; http://www.reddit.com/submit?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank'/></li>

<li class='beauty-stumble'><a expr:href='&quot; http://www.stumbleupon.com/submit?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank'/></li>

<li class='beauty-designfloat'><a expr:href='&quot;http://www.designfloat.com/submit.php?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank'/></li>

<li class='beauty-facebook'><a expr:href='&quot; http://www.facebook.com/sharer.php?u=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank'/></li>

<li class='beauty-twitter'><a expr:href='&quot;http://twitter.com/home/?status=Chk Out-&quot; + data:post.title + &quot; &quot; + data:post.url' target='_blank'/></li>

<li class='beauty-furl'><a expr:href='&quot; http://www.furl.net/storeIt.jsp?u=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank'/></li>

<li class='beauty-syndicate'><a href='http://feeds.feedburner.com/' title='Subscribe to RSS'/></li>

<li class='beauty-email'><a expr:href='&quot; mailto:?subject=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank'/></li>

</ul>

<span class='beauty-rightside'/></div></center>

</b:if>

<!--bebas-akses.blogspot.com-ends-->

*Nb : Untuk Url yang saya beri warna biru adalah Url feedburner kalian. Jika kalian belum mendaftar di feedburner,
4. Kalian simpan template kalian. Dan lihat tiap dibawah postingan kalian. Ada widget Sharing is Caring

Demikian artikel saya tentang Cara Membuat Tombol Sharing Super Keren Di Bawah Postingan Blog Part 2 

Semoga bermanfaat

Artikel Terkait

• Cara Membuat Tombol Share Di Bawah Postingan Blog Part 1 1. Login ke blogger : Masuk Ke Dashboard blog sobat Pilih menu Template 2. Pilih Edit HTML > Jangan lupa Centang Expand Widget T ... Read More
• Membuat Ampuh Recent Comment Versi Baru Avatar Membuat dan memasang recent komen di blog dapat memudahkan anda dan pengunjung untuk mengetahui komentar terkahir yang baru saja masuk ke blog ... Read More
• Cara Mengganti Cursor Blog Super Mudah TerbaruArtikel saya ini membahas tentang tips blogging yaitu Cara Mengganti Cursor Di Blog Dengan Animasi  Mengganti Cursor Di Blog akan memp ... Read More
• Cara Membuat Recent Post Dengan Grid Thumbnail Super Keren Terbaru Assalamualaikum wr wb   Cara Membuat Recent Post Dengan Grid Thumbnail Super Keren - setelah saya tadi posting tentang  "Cara Membu ... Read More
• Cara Membuat Widget Tombol Share Menarik Di Blog Part 1 Cara Membuat Widget Tombol Share Menarik Di Blog - sebenarnya banyak variasi yang dapat kita pasang di blog, dari yang keren, super keren hin ... Read More