Baca juga cara mudah membuat label keren warna-warni
1. Login ke Blogger
2. Pilih Template ► Edit HTML
3. Cari kode ]]></b:skin>
4. Pasang kode dibawah ini diatas kode ]]></b:skin>
#head-soc ul li {list-style :none; padding: 0 0 0 12px; float: right;}
#head-soc ul li a {text-indent: -9999px; font-size: 0; line-height: 0; overflow: hidden ; height: 32px; width: 32px ;border: 0; background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiiN7nGtVbOkSakSzVE9tLE2fxXvJbREePX7jSmaXxNgABi4CchrOWg8xYWfd-ZBJy_vIY4BsJJHKFTzu6VypJcBLhwn2PCUK3rhX0vGKlT1cBryyt9yBQNd2bQlAA07flrcbNkkaB7fFU5/s1600/spice-up-blog-sprite.gif) no-repeat; display: block;}
#head-soc li#g a {background-position: 0px 0px;}
#head-soc li#g a:hover {background-position: 0px -32px;}
#head-soc li#rss a {background-position: -32px 0px;}
#head-soc li#rss a:hover {background-position: -32px -32px;}
#head-soc li#sub a {background-position: -64px 0px;}
#head-soc li#sub a:hover {background-position: -64px -32px;}
#head-soc li#fb a {background-position: -96px 0px;}
#head-soc li#fb a:hover {background-position: -96px -32px;}
#head-soc li#twit a {background-position: -128px 0px;}
#head-soc li#twit a:hover {background-position: -128px -32px;}
#head-soc li#li a {background-position: -160px 0px;}
#head-soc li#li a:hover {background-position: -160px -32px;}
#head-soc li#youtube a {background-position: -192px 0px;}
#head-soc li#youtube a:hover {background-position: -192px -32px;}
Angka yang berwarna biru merupakan ukuran tombol widget, bisa sobat ganti sesuai dengan kebutuhan
5. Simpan
6. Selanjutnya Pilih Tata Letak ► Tambah gadget
7. Pilih HTML/JavaScript
8. Pasang kode dibawah ini pada kolom HTML/JavaScript
<!--Social Sprite Html-->
<div id="head-soc" style="margin: 0 0 20px -10px">
<ul>
<li id="g"><a href="https://plus.google.com/110791741386418225279/posts" target="-blank">Google+</a></li>
<li id="rss"><a href="http://feeds.feedburner.com/copasange" target="-blank">RSS Feed</a> </li>
<li id="sub"><a href="http://feedburner.google.com/fb/a/mailverify?uri=copasange" target="_blank">Subscribe</a></li>
<li id="fb"><a href="http://facebook.com/copasange" target="-blank">Facebook</a></li>
<li id="twit"><a href="http://twitter.com/copasange" target="-blank">Twitter</a></li>
<li id="li"><a href="http://www.linkedin.com/in/copasange" target="-blank">LinkedIn</a></li>
<li id="youtube"><a href="https://www.youtube.com/user/copasange" target="-blank">YouTube</a></li>
</ul>
</div>
Ganti tulisan yang berwarna biru dengan No ID dan nama akun sosmed sobat
9. Simpan dan lihat hasilnya
Demikian cara mudah memasang tombol sosmed keren pada blog, semoga dapat membantu dan bermanfaat. Terimakasih atas kunjungannya.
loading...
► Copas Sange ◄
LANGGANAN ARTIKEL GRATIS
Dapatkan Artikel Terbaru Disini !
Masukkan email anda di bawah ini ! Maka otomatis anda akan mendapatkan kiriman terbaru dari Blog ini secara gratis via email. Terimakasih.
0 Response to "Cara Mudah Memasang Tombol Sosmed Keren Pada Blog"
Post a Comment