Bubblicons Social Media Sharing Widget
Social media icons are one of the most popular widgets to add in your site and here’s another one I discovered courtesy of Bloggertrix that you may like as well. It’s use is very similar to other social media icons you see, but the difference is that it has a very nice look so I thought I’ll just have to share it anyway as you may want to change the features on your site.
Bubblicons is created with CSS and HTML, a very easy to add widget that makes your site look appealing to the visitors.
The steps to add this widget to your site are very easy to follow:
1. Blogger Dashboard > Design > Page Element
2. Click on Add Gadget > HTML/Javascript
3. Copy and paste the code provided below.

<style>
/* 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);
}</style>

<br />
<center>
<br />
<ul>
<li><a href="http://www.digg.com/Username"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjMsDlC7q-JnuV1sG0We6AIDTqlpeDov_-ieYkg1kF43sG7IB1Yh_Ye9z75oS3wPkWH3KF4wl5Q6KW7Pjxl9bLxtNJtB3BWpCiZD4X1L4XJ7OIQqHYP_GPjxaIXNGufL6DDNuCP8uvCgVA/s1600/bloggertrix-digg.png" title="Add to Digg" /></a></li>
<li><a href="http://www.facebook.com/bloggertrix"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhV4-ccHBR_m_rPlgivi16hxWVXPB94-qJPiCd6hkk_ilErzWszINelYd34tK7z0wL8YLxpC2JFgZC-LVmsx-rioh_AAzxi-8OHjZFuuzRN8ELOrCfmcHKlKYLnv1Xtx7a-mgq_-Tb3sI8/s1600/bloggertrix-facebook.png" title="Add to Facebook" /></a></li>
<li><a href="http://www.stumbleupon.com/bloggertrix"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhpPw_gC81tUwhvBmtasCjKq6JAMIG8k71n-pl22HKiNiRzHIGt8L8NuDw9LENTJx-wQ0uKgB5IU2lGtMOt_EwVd8dOlcqg_7tDfmIawjwK28rg7K3PFhRB60Z0CQkqYUeAMtov_VaWj3c/s1600/bloggertrix-stumbleupon.png" title="Add to Digg" /></a></li>
<li><a href="http://www.twitter/bloggertrix"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiTz8GZiuxujwoD2xgfalChZQOavF7b1rAGE7PGccveLmhBANvvbR6wNYGkOkenPwerOKBtmf1H7JUoA3J37hinfHi785UPDVwSb86Uop9tqDRb3Gt8Yk_l7N3Xmk20Tuqbr_DSdd4O6-A/s1600/bloggertrix-twitter_alt.png" title="Add to Twitter" /></a></li>
<li><a href="http://feeds2.feedburner.com/bloggertrix"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhHDF42HOCbqO6pkoSshKW87KTR8AKlu8DMJ9w0bwVe08uzcpvFdDB79pPvDp70LvXo5QT_4lqz3Q0Xd4t0__KK-i6WC-2UKWZzrfHJdOzij5St-oy5LTA8KnQLw7wbrXrukFFYeQwB5dQ/s1600/bloggertrix-RSS.png" title="Add RSS Feed" /></a></li>
</ul>
Note:
Change Facebook, Twitter, Digg, Feedburner, Stumbleupon usernames with your own username (highlighted areas).
4. Save.
Simple isn’t it? Hope you like this featured widget.

0 comments:

Post a Comment

 
Top