Untuk Demo seperti gambar diatas
1. Log in ke blogger account and Click drop down.
2. Plih "Template" Seperti dibawah.
3. Sekarang, Click Tombol EDIT HTML"
4. Sedang proses.
5. Cari code ]]></b:skin> dengan cara Ctrl+F.
6. Paste code dibawah ini sebelum code ]]></b:skin> lalu save.
/* Bloggertrix */
.bubblewrap{
list-style-type:none;
margin:0;
padding:0;
}
.bubblewrap li{
display:inline;
width: 60px;
height:60px;
}
.bubblewrap li img{
width: 50px; /* width of each image.*/
height: 50px; /* height of each image.*/
border:0;
margin-right: 4px; /*spacing between each image*/
-webkit-transition:-webkit-transform 0.1s ease-in; /*animate transform property */
-o-transition:-o-transform 0.1s ease-in; /*animate transform property in Opera */
}
.bubblewrap li img:hover{
-moz-transform:scale(1.8); /*scale up image 1.8x*/
-webkit-transform:scale(1.8);
-o-transform:scale(1.8);
}
.bubblewrap{
list-style-type:none;
margin:0;
padding:0;
}
.bubblewrap li{
display:inline;
width: 60px;
height:60px;
}
.bubblewrap li img{
width: 50px; /* width of each image.*/
height: 50px; /* height of each image.*/
border:0;
margin-right: 4px; /*spacing between each image*/
-webkit-transition:-webkit-transform 0.1s ease-in; /*animate transform property */
-o-transition:-o-transform 0.1s ease-in; /*animate transform property in Opera */
}
.bubblewrap li img:hover{
-moz-transform:scale(1.8); /*scale up image 1.8x*/
-webkit-transform:scale(1.8);
-o-transform:scale(1.8);
}
7. Skrang ke blogger.com lagi seperti pertama kali lalu pilih Tata Letak/Layout
8. Kemudian Tambah Gadget and pilih 'HTML/Javascript" seperti gambar dibawah.
9. Lalu Copy dan Paste code dibawah ini, dan save.
<ul class="bubblewrap">
<li><a href="https://plus.google.com/100201146925397390963"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiQVgTGI4sswFzMrRvzJEaK1_x-or8U3k7g6Ba9L1rhgXCfHuhhgNFlIhVm2n7QhuP_4kmByKqy2hLiOV6g-3RSvsHzTyGCEFG0pUox2oXjKIgEHZKUdgYkD1RUA6rWyrs_-oFkQW5y8hY/s1600/bloggertrix-google-icon.png" title="Add to Facebook" /></a></li>
<li><a href="https://www.facebook.com/dambluedotcom"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh4bbMMz2fv7STi9FOH3n6Yj_bPVNIO6eYO7DSQaKqycpg80M1LSjfbKO3ONGCCn2Gsx8StN85qOXq3ndXCe2X9Vq8ZQg_3uGI-829SSW0bRwng16VpsbX12EiLMM2FAweQR2wyUR2BmAs/s1600/bloggertrix-facebook-icon.png" title="Add to Facebook" /></a></li>
<li><a href="http://www.digg.com/Username"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjOE5F3b3lm08-71skTd-aA42vstkEkjIAQ1ZwluQUGpRQ4UFtFQtX6EnwTFHzQMgQ4MgxyWiQRjwnDkeX8DH9m5opHwphyphenhyphenejw3EUEH0r4UJFUBDWF47yojAtjZjXAeaGWfJFE1P-ngIpc/s1600/bloggertrix-digg-icon.png" title="Add to Digg" /></a></li>
<li><a href="https://twitter.com/d4mblue"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEivtUzSK-0cIzzAxU1I0YSPgoWr3sSfqqn80mVa34pCj5Z7XL_dnokJ9SJH9H9ZLcbqIAPZ9dsB8HCYXGZ6NmHd3eOi84QjMLo31vZzbaHfYOv5ArvrQACQUZ-s53viENa3fZsMgLk-9zk/s1600/bloggertrix-twitter-icon.png" title="Add to Twitter" /></a></li>
<li><a href="http://feeds2.feedburner.com/damblue"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgpf7TbVEPWFvyHKEwU5ulv6xH6yhI2bonlj3RHK06jm93Q6i1feKRNJ0zMJyfDSRHYXwxD3DScs9eMv-5pIP4nGVNlJVHiLETZ19hLmpeQF_MpnRDlFb0s-bWZ9cTfkSd73bXvoaxWGms/s1600/bloggertrix-rss-icon.png" title="Add RSS Feed" /></a></li>
</ul>
<li><a href="https://plus.google.com/100201146925397390963"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiQVgTGI4sswFzMrRvzJEaK1_x-or8U3k7g6Ba9L1rhgXCfHuhhgNFlIhVm2n7QhuP_4kmByKqy2hLiOV6g-3RSvsHzTyGCEFG0pUox2oXjKIgEHZKUdgYkD1RUA6rWyrs_-oFkQW5y8hY/s1600/bloggertrix-google-icon.png" title="Add to Facebook" /></a></li>
<li><a href="https://www.facebook.com/dambluedotcom"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh4bbMMz2fv7STi9FOH3n6Yj_bPVNIO6eYO7DSQaKqycpg80M1LSjfbKO3ONGCCn2Gsx8StN85qOXq3ndXCe2X9Vq8ZQg_3uGI-829SSW0bRwng16VpsbX12EiLMM2FAweQR2wyUR2BmAs/s1600/bloggertrix-facebook-icon.png" title="Add to Facebook" /></a></li>
<li><a href="http://www.digg.com/Username"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjOE5F3b3lm08-71skTd-aA42vstkEkjIAQ1ZwluQUGpRQ4UFtFQtX6EnwTFHzQMgQ4MgxyWiQRjwnDkeX8DH9m5opHwphyphenhyphenejw3EUEH0r4UJFUBDWF47yojAtjZjXAeaGWfJFE1P-ngIpc/s1600/bloggertrix-digg-icon.png" title="Add to Digg" /></a></li>
<li><a href="https://twitter.com/d4mblue"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEivtUzSK-0cIzzAxU1I0YSPgoWr3sSfqqn80mVa34pCj5Z7XL_dnokJ9SJH9H9ZLcbqIAPZ9dsB8HCYXGZ6NmHd3eOi84QjMLo31vZzbaHfYOv5ArvrQACQUZ-s53viENa3fZsMgLk-9zk/s1600/bloggertrix-twitter-icon.png" title="Add to Twitter" /></a></li>
<li><a href="http://feeds2.feedburner.com/damblue"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgpf7TbVEPWFvyHKEwU5ulv6xH6yhI2bonlj3RHK06jm93Q6i1feKRNJ0zMJyfDSRHYXwxD3DScs9eMv-5pIP4nGVNlJVHiLETZ19hLmpeQF_MpnRDlFb0s-bWZ9cTfkSd73bXvoaxWGms/s1600/bloggertrix-rss-icon.png" title="Add RSS Feed" /></a></li>
</ul>
10. Now save your template. You are done.
Tidak ada komentar:
Posting Komentar