Add Stylish Social Icons With Hover Effect To Blogger

       Social Icons widget is a very effective to take attention of your visitors. It help you to get more traffic from various social networking sites. By adding your social account links to your blog, your visitor can easily connect you and your blog updates. I will give stylish icon pack with Hover effect. The Social Icon Pack Include.

This widget Include

• Google Plus Icon.
• Twitter Icon.
• Facebook Icon.
• RSS Icon.
• Email Icon.

How to add it to blogger

1. First go to blogger Dashboard >> Template >> Edit HTML.
2. Now Search for the code below [Use Ctrl+F].
   
   

   ]]></b:skin>

3. And  paste the below code just above ]]></b:skin>.
   
   

   /* Social Widget by my best tricks*/
   
   #subscribe2 {
   background:#f3f3f3;
   border: 1px solid #ECEDE8;
   font-size: 90%;
   margin: 0 0 15px 0;
   padding: 7px 5px 3px 5px;
   width: 288px;
   }
   .subscribe-icons2 {
   margin: 0 auto;
   width: 286px;     background: #f7f7f7;
   }
   .subscribe-icons2 li {     -moz-border-radius:6px;
   display: inline;
   float: left;
   font-size: 11px;
   margin: 0 2px 10px 2px;
   width: 52px;
   text-align: center;
   }
   .subscribe-icons2 a {
   color: #444 !important;
   display: block;
   padding: 56px 0 2px;
   -moz-transition: all .2s ease-out;
   -webkit-transition: all .2s ease-out;
   }
   .subscribe-icons2 a:hover {     -moz-border-radius:6px;
   -moz-box-shadow: 0 2px 4px hsla(0,0%,0%,.35);
   -webkit-box-shadow: 0 2px 4px hsla(0,0%,0%,.35);
   color: #369 !important;
   text-decoration: none;
   }
   .subscribe-icons2 .subscribe-youtube a {
   background: url(http://karrersimpson.com/obituaries/tomchuk-helen-1575/icon64_googleplus.png) center top no-repeat;
   }
   .subscribe-icons2 .subscribe-twitter a {
   background: url(http://karrersimpson.com/obituaries/tomchuk-helen-1575/icon64_twittert.png) center top no-repeat;
   }
   .subscribe-icons2 .subscribe-facebook a {
   background: url(http://karrersimpson.com/obituaries/tomchuk-helen-1575/icon64_facebook.png) center top no-repeat;
   }
   .subscribe-icons2 .subscribe-rss a {
   background: url(http://karrersimpson.com/obituaries/tomchuk-helen-1575/icon64_rss.png) center top no-repeat;
   }
   .subscribe-icons2 .subscribe-email a {
   background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjhtuIZNhwfr5Jbz0OZv5JH82159cVpmeo19yTYN8MsDNETPQR_hLhJ_-8kXzap3OPtnORdjaJfXp5n_44FBjZ4BP2kYkVMxCnp2h8r-OzC8RlRlK7R-Bbs31hXkZs2fNmCIRcg-bPk2mw/s320/gmail-email+21.png) center top no-repeat;
   }

4. Now add this code in your sidebar. Go to Layout >> Add a Gadget >> HTML/JavaScript.

<div class='subscribe2'>

        <ul>
            <li><a target="_blank" rel="nofollow" href="https://plus.google.com/Your_Google+_ID">Google+</a></li>
            <li><a target="_blank" rel="nofollow" href="http://twitter.com/mybesttricks">Twitter</a></li>
            <li><a target="_blank" rel="nofollow" href="http://www.facebook.com/mybesttricks">Facebook</a></li>
            <li><a target="_blank" rel="nofollow" href="http://feeds.feedburner.com/mybesttricks">RSS</a></li>
            <li><a target="_blank" rel="nofollow" href="http://feedburner.google.com/fb/a/mailverify?uri=mybesttricks&amp;loc=en_US"> Email</a></li>

        </ul> <!--end .subscribe-icons-->

        <div/>

    </div>

• Change Your_Google+_ID with your own.
• Change mybesttricks with your own Facebook, Twitter and FeedBurner Username.

You have any problem, please comment.