Cara Memasang Tombol Sharing Is Caring / Sexy di Blogger

Cara Memasang Tombol Sharing Is Caring / Sexy di Blogger - Jangan langsung berpikiran yang tidak - tidak begitu mendengar nama share tools / share button yang satu ini. Yup, namanya memang unik. Sharing Is Caring atau Sharing Is Sexy, merupakan salah satu share tools yang banyak dipakai oleh para blogger di dunia. Fungsinya tak jauh beda dengan share tools yang pernah dibahas sebelumnya. Kelebihannya, widget Sharing is Caring / Sexy ini memiliki fitur share yang lebih banyak. Namun, keunggulan tersebut dibarengi dengan resiko bertambah lamanya waktu loading blog saat menggunakan share tools ini. Jika Anda hanya menginginkan tombol share sederhana, yang tidak terlalu mempengaruhi waktu loading blog Anda, sebaiknya gunakan tombol share keren yang pernah dibahas sebelumnya (promosi, hehehe…). Oh, iya. Untuk Anda yang mau lihat – lihat dulu preview widget atau tombol sharing is caring / sexy ini, silahkan klik disini (untuk widget atau tombol sharing is caring), atau disana (untuk widget atau tombol sharing is sexy)

Oke, langsung saja. Untuk Anda yang ingin memasang widget atau tombol sharing is caring / sharing is sexy di blog, silahkan ikuti langkah - langkah berikut :

1.     Seperti biasa, buka Blogger, dan masuk ke menu Template.

2.     Buat backup dari template blog Anda, dan klik tombol Edit HTML.

3.     Cari kode </head> (gunakan tombol sakti, CTRL+F), dan pastekan kode berikut diatas / sebelum kode </head>.

<style type='text/css'>

div.beauty-bookmarks {height:54px;background:url(&#39; https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhaxvnh15q48-G2TLm2fyS9KCj7U6c_va75qXEYNI_sZtaIa7GVoyw_eM5av9OQY2QdOff_d2vwJehyphenhyphenYbnsbObUQy3TxG8yHyTw1wjHHGCk5vaapHIoRr_5Spd7vnrtCMlAQJv3KWrbDX7J/s1600/xxpc123xx-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/AVvXsEhaxvnh15q48-G2TLm2fyS9KCj7U6c_va75qXEYNI_sZtaIa7GVoyw_eM5av9OQY2QdOff_d2vwJehyphenhyphenYbnsbObUQy3TxG8yHyTw1wjHHGCk5vaapHIoRr_5Spd7vnrtCMlAQJv3KWrbDX7J/s1600/xxpc123xx-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/AVvXsEhtu9N5HO0HYieg_0Z6XWjQm0SWMxhkrMYA_-kWxVd4EYcf7XAW-Hg1XOlY1Uy-wi3cgwV1PZUOnPkCLNQfyWexuM1qh2rwI7Sx7SWqj7Nun5Gtsl-iNSSCjqyCgTqewS1L1dfALzalGRkH/s1600/xxpc123xx-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>

Catatan :

Jika Anda tidak melakukan pengubahan pada kode diatas, maka saat dipasang, widget yang muncul akan bertuliskan 'Sharing is Caring'. Jika Anda ingin mengganti tulisan tersebut menjadi 'Sharing Is Sexy', ganti tulisan left top dengan left bottom, dan ganti tulisan right top dengan right bottom.

4.     Cari kode <data:post.body/> (seperti biasa, gunakan tombol sakti, CTRL+F). Biasanya kode ini ada banyak (terutama untuk yang menggunakan ReadMore Otomatis), jadi coba satu persatu. Pastekan kode berikut tepat setelah / dibawah kode <data:post.body/>.

<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/Blog-Pc123' 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>

Catatan :

Ganti url yang berwarna merah dengan url RSS Feed blog Anda.

5.     Terakhir, klik Simpan, dan lihat blog Anda.

Buka blog Anda untuk melihat widget atau tombol sharing is caring / sexy ini. Selamat mencoba! Tolong share artikel ini jika bermanfaat (terutama Google +), dan tolong tinggalkan komentar! Terima kasih, dan salam blogger!

Suka Artikel Ini? Yang Share Dapat Pahala Lho... Trims!

Bagikan di FB Tweet ke Twitter! Bagikan di G+

Thanks for reading! Ingin menyebarluaskan artikel ini? Tolong sertakan juga link sumbernya (Cara Memasang Tombol Sharing Is Caring / Sexy di Blogger). Klik juga tombol Google +1 dibawah. Terima Kasih! Klik juga :

Anda sibuk? Tetap baca artikel terupdate dan terbaru dari Tips SEO + Blog – PC 123 melalui e-mail Anda. Caranya? Masukkan alamat e-mail Anda pada kotak berikut ini, dan klik Daftar, dan saya akan mengirimkan artikel terbaru ke e-mail Anda. Saya menjamin privasi Anda. Untuk info lebih jelas mengenai kotak ini, silahkan klik Disini.