How to add Retro Style Social Sharing Widget With Email Subcription For Blogger

How to add Retro Style Social Sharing Widget With Email Subcription For Blogger

Today I'm gonna explain how to add  Retro Style Social Sharing Widget With Email Subcription For Blogger.This is a beautiful Social Sharing Widget.You can add this to your blog easily without any trouble.

Live Demo

Follow these steps
1.)Log in to your blogger and Go to Layout > Add Gadget > HTML/JavaScript

2.)Now paste bellow codes.

<div class="tbisubscribe">

<div style="color: #4CC417; font-weight: bold; font: 22px Oswald, cursive; margin: 0px 0px 10px 15px;">Get Free Updates in your Inbox</div>

<div style="margin: 10px 0 0 6px;">

<form action="http://feedburner.google.com/fb/a/mailverify?uri=TechnicalTutorialstipsAndTricksAndPremiumAccounts&amp;loc=en_US" class="emailform" method="post" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=http://feedburner.google.com/fb/a/mailverify?uri=blogspot/BMlWA&amp;loc=en_US, 'popupwindow', 'scrollbars=yes,width=550,height=520');return true" style="margin: 0pt;" target="popupwindow">

<input name="uri" type="hidden" value="TechnicalTutorialstipsAndTricksAndPremiumAccounts" />

<input name="loc" type="hidden" value="en_US" />

<input class="tbimailbox" name="email" onblur="if (this.value == &quot;&quot;) {this.value = &quot;Enter your email...&quot;;}" onfocus="if (this.value == &quot;Enter your email...&quot;) {this.value = &quot;&quot;}" type="text" value="Enter your email..." />

<input alt="" class="tbisubmit" title="" type="submit" value="Subscribe" />

</form>

<style>

/* www.tipsandtricktutorials.blogspot.com */

.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 class="bubblewrap">

<li><a href="http://plus.google.com/u/0/104705415499395107820"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiM6jGWQPjqp8TEvWE9YMw0Ln-n9Sd5TcL4y6fzqVH11DjnuCVR2gol_ES_0Rlq3S35R84pSLwLbsOpNroJCTmDza1p-h1p0G6a3FI2FNOSGIOlZKyPWQyD9DM4oOrzJIBlny4Mpqy1Ni0/s1600/bloggertrix-google-icon.png" title="Follow to Google"></a></li>

<li><a href="http://www.facebook.com/NUMANMLK"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg2Hh90s2KDYtfL90HDfZ13-MB7x0mmzR8qy-N6LSdo6LjlahLluiM4omoemhsifTcVlM0nfHcQvtp55Dkeb4S6DVJmlahzt9i0RkDd4GJ347Q4HoKe8xz0SDsSqX5P7k_2MsIlvQYQtJQ/s1600/bloggertrix-facebook-icon.png" title="Add to Facebook"></a></li>

<li><a href="http://pinterest.com/numanmalik999/"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhRTg8nl1dZWH8Zmb8j1hB7B90An4z8GC21X2tx0cjnzR_QYeRjznHB6BLs1FxAjASHThixLHcbqsNrvIvTRuYan-BV04mG9FpmKErQ-nVoxq0F7BMU2ExOyvU0MW4ZUKsSYEfeoavXleA/s1600/bloggertrix-pinterest-icon.png" title="Add to Pinterest"></a></li>

<li><a href="http://www.twitter/numanmalik999"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgY0x4hdLBQSPMU89cL6jmlMVn5i2F-Ag92eINc9T1K_ss0oIMV2BWgH__BTmYj2YnXu6B7CXT32OHTBBuZFdzXRl8swa2qncaL974mhTPmv2CIxO4mHSEv9HzQTU7GW8_5-pYfXCFjtPk/s1600/bloggertrix-twitter-icon.png" title="Add to Twitter"></a></li>

</ul>

 3.)  After paste above codes,
      Change(replace)  this account ID's to your account ID's

Change 104705415499395107820 to your Google plus Id.
Change NUMANMALIK to your web site's fan page or your Facebook profile user name.
Change numanmalik999 to your Pinterest Username.
Change numanmalik999 to your Twitter Username.
Change TechnicalTutorialstipsAndTricksAndPremiumAccounts to your Feedburner user Name.
4.) Now save your "HTML/JavaScript"

You're Done....:)
Enjoy...