This widget can help your blog gain more social media optimized audience. The elegant look of this widget can make many people click it and it's very good way to increase social audience.

Step 2: Select Blogger Dashboard.
Step 3: Then, Select Template.
Step 4: Click on "Edit HTML".
<ul id="abt-social-icons">
<li class="rss-icon"><a href="http://feeds.feedburner.com/FEEDID" target="_blank"><img height="147" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi-k-LxoTKnVO4ksjYZI4pP7-t8aRYuwgp4fODq7noLgDTxYMkqKz_Xw0ptWnt54DPklOpbV77HBO5uwLTKc30We8gOzx54BaqyKW3x_muvisE869t1ePRlfirCvm9xmpTX2dwiJns5slE/s1600/rss.png" width="147" /></a></li>
<li class="twitter-icon"><a href="http://www.twitter.com/TWITTERHANDLE" target="_blank"><img height="147" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgI4FzrKn2LEUEy6EIszdebMi09xrPPEVvzfQ1xXWNQxWmTjmn3a3C4nOIvyMe2yjGGbDR-ylo4sIse8ljJLf9-YeXajvLj-U6Mv36U6IL6v8F6AbfqcOvMO425aHruPLgMm2U7nJXFkLA/s1600/twitter.png" width="147" /></a></li>
<li class="facebook-icon"><a href="http://www.facebook.com/PAGEID" target="_blank"><img height="147" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg-LXGOXGcMFgfhid2KL-CbnA5Oo7iX8JWhSkGSmLRIMO1KyyMLZ5PrOM_BjZPElBsGgucPKAeFVqCgP9Pn5h7-oJ5Vs8atTmN73L0lhmZ-SViwamOdrbuW_CdqhPCbekGRlgdBQu4ACms/s1600/facebook.png" width="147" /></a></li>
<li class="google-icon"><a href="https://plus.google.com/YOURID" target="_blank"><img height="147" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjDnDtLhrsWclz1ijOU3ScL20EpyaX4rdUe-N-RJPNj7C8Jbss2AC0ITniFT8Y751jsmbuzYoCp89O5B2Lj5_BvWRFAJR5IXHOU_GBf9wqpAqVps1rkmGXJnaZcRbfxOr_7vDdxTiu917w/s1600/google.png" width="147" /></a></li>
</ul>
</center>
<style>
#abt-social-icons li {
float: left;
width: 147px;
height: 147px;
margin: 0 6px 6px 0;
padding: 0 0 0 0;
border-bottom: none;
list-style: none;
}
#abt-social-icons li a {
line-height: 1px;
display: block;
}
#abt-social-icons li a:hover img {
-webkit-opacity: 0.8;
-moz-opacity: 0.8;
opacity: 0.8;
}
#abt-social-icons li a span {
display: none !important;
}
</style>
After adding the code change the Link in BOLD RED with your own IDs. Now save the widget and ultimately save the template.
Congratulations! You are done now. Now you and your visitors can see this awesome and elegant Metro Style Social Icons in your blogger blog. If you really liked this post, then please share it in social media and with your friends. Happy Blogging !
Do You Like This Post ?