Icons Social Bookmark

Beberapa kali blogwalking ke blog teman-teman tidak  jarang saya menemukan kenyataan bahwa masih banyak blog yang belum memasang tombol share atau icons sosial bookmark pada blog atau postingan. Entah karena belum mengerti manfaat dari widget sosialbookmark ini atau justru karena tidak mengetahui cara memasang widget ini pada template blogger. Padahal banyak keuntungan yang dapat kita peroleh dari cara menembahkan sosial bookmark pada postingan

• Dalam keadaan log in pada account blogger sobat>>> Klik Tata Letak>>> Edit HTML>>> Expand Template Widget>>> Cari kode ]]></b:skin>
• Sekarang letakkan kode berikut diatas ]]></b:skin>

/* Social Bookmark
----------------------------------------------- */
div.sociable { margin: 16px 0 0 0; text-align: center; } span.sociable_tagline { position: relative; }
span.sociable_tagline span { display: none; width: 14em; }
span.sociable_tagline:hover span {
position: absolute;
display: block;
top: -5em;
background: #ffe;
border: 1px solid #ccc;
color: black;
line-height: 1.25em;
}
.sociable span {
display: block;
}
.sociable ul {
display: inline;
margin: 0 !important;
padding: 0 !important;
}
.sociable li {
background: none;
display: inline;
list-style-type: none;
margin: 0;
padding: 1px;
}
.sociable ul li:before { content: ""; }
.sociable img {
float: none;
width: 35px;
height: 35px;
border: 0;
margin: 5px 5px; /*jarak antar icons*/
padding: 0;
}

• Letakkan kode berikut dibawah kode <data:post.body/>

<!-- Star Social Bookmark --><div class='sociable'>
<span class='sociable_tagline'>
</span>
<li><a expr:href='&quot;http://digg.com/submit?phase=2&amp;url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank' title='Digg'><img alt='Digg' class='sociable-hovers' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhaq-U69135Lm5Nyp26SbiRNSgWZcZi8U_835L87pybb7hBVKC_H0xaokEUJOMTxQLgAu0Ba8h1xWLSeJ_1LOrJAAYkrgxvviXPB13lXBjOB6h6yWRy4Zt7F8bloY75rzKzkBAaD604p2k/s320/digg.png' title='Digg'/></a></li>
<li><a expr:href='&quot;http://delicious.com/post?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank' title='Delicious'><img alt='Delicious' class='sociable-hovers' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgR_8S21dtR6MEDNLanIKNGE4HQZ6Ms1rn_eAyXYnJ48GZ8yaDCNW0SLK-GL9BKjMsOdukrluodU7e-kj34RuoRfX3DB45mW_HQu_-3K2UUmio-VKIbjOJZmtQmlSYmxYalxAUNz0YU99U/s320/delicious.png' title='Delicious'/></a></li>
<li><a expr:href='&quot;http://www.facebook.com/share.php?u=&quot; + data:post.url + &quot;&amp;t=&quot; + data:post.title' target='_blank' title='Facebook'><img alt='Facebook' class='sociable-hovers' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgUXQRLAS_JggvV0i1u633E03lAfWH0cjwEGzPwxquafLnaGObINtYGT5CtkPYa7BWFgQqFrlBawwWMnb8-EHVz0q8uyayNf4oPlfPDqt_Hz6j0fYQoNz0qylTHn69T-nSwh4o9dI1kZRI/s320/facebook.png' title='Facebook'/></a></li>
<li><a expr:href='&quot;http://www.mixx.com/submit?page_url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank' title='Mixx'><img alt='Mixx' class='sociable-hovers' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhHm7-wVrj_ZJJQmofmu2z8aaCOl4x4Go56OOCN2khBBRzXKFuckMtM0wsZ2YCihyphenhyphen1JsZTnG_A-FGlzJlhtIGqi4LFm8fYgWRpZE3G3AWZNDGhaH6stNgWLsTaEqZ58uHq6blqd0-so88o/s320/mixx.png' title='Mixx'/></a></li>
<li><a expr:href='&quot;http://google.com/bookmarks/mark?op=edit&amp;bkmk=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank' title='Google'><img alt='Google' class='sociable-hovers' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgSKG0QEZxHBVcEqRuU_x-wdZZII0BNPSz4p5emGjGcHwClsYoX8ceEZ2nbkgvjiUv_VnAVa67G6POJ_EQKTOInjG8F4rWy1KOks8HoqfyU4UJ0dhBo-XmKCVtVv5cagvSl3Ujab2oDOjM/s320/google.png' title='Google'/></a></li>
<li><a expr:href='&quot;http://www.furl.net/storeIt.jsp?t=&quot; + data:post.title + &quot;&amp;u=&quot; + data:post.url' target='_blank' title='Furl'><img alt='Furl' class='sociable-hovers' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjYGLHh2z2Q4kcQ7qipwmMDDBW_JIBhFgwCVA97oOPp_Dc9qndHL77KJ23cqQf4uimv7vWaL0UQWsrNkwmkqktGw5nMGpe2nPTP78tKxfy9mm4zarcRP9cVNqovyKaRw6UY3xuBmeHsVMA/s320/furl.png' title='Furl'/></a></li>
<li><a expr:href='&quot;http://reddit.com/submit?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank' title='Reddit'><img alt='Reddit' class='sociable-hovers' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgPom17ngeCoc01G_qd6oeu8UC01FXdI9NfF3rfZvHUIotXAnOLLSqH6ree7yENkNAkeQkLucZJcJ0eARPvp1RnL9miv7dcRv1XCOlz0ntfhQzNMjJI2oJuFfhr0s09QS0RC1d9DCxH8g4/s320/reddit.png' title='Reddit'/></a></li>
<li><a expr:href='&quot;http://www.stumbleupon.com/submit?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank' title='StumbleUpon'><img alt='StumbleUpon' class='sociable-hovers' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiE0J3yls9ueNhi99XBFxdGecRLSfBq8bB-O-1e2yyGhUiNWMtrCCLUvGq73u8eUa__7MR1rOYVLo_etS6mJHFuZK9o_Td5Unwbl3smuWNlujo8fJ3m3eet5RrdBXOhPqA6eMRAp21xgVM/s320/stumble.png' title='StumbleUpon'/></a></li>
<li><a expr:href='&quot;http://technorati.com/faves?add=&quot; + data:post.url' target='_blank' title='Technorati'><img alt='Technorati' class='sociable-hovers' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiV1lpxcyC7Otg5otx6ybx58tBuQag4FYO6mHqBTXNO9CjYhhZ01DtKPdXPPu2jj8m5GdmIb0xPU9pE_9sSZqJLuFsVmtOWzaEz8U9b1a3zpWiGMI0Fjgq00wMnAfGco15xFKYLMNJRDPI/s320/technorati.png' title='Technorati'/></a></li>
</div> <!-- http://blogcapoenk.blogspot.com/--><!-- End Social Bookmark -->

• Simpan template. Selesai