Tuesday, August 28, 2012

Add Attractive Social Media Widget For Blogger Easily

This is a simple Social media gadget for your blog. you can link Facebook fan page, Twitter and Rss subscribe. Its easier to add to your blog.you can try it.

Social-Media-Widget-For-Blogger

1. Log in to blogger and Go to  Design >> Page Element.

2. Click Add Gadget and select 'HTML/Javascript'

3.Paste below code.

<style type='text/css'>

#topbox{width:250px;border:4px solid #a1a1a1;background-color:#ffffff;}
#topbox:hover{border:4px solid #4e4c4c;background-color:#ffffff;}

#social1 .social2 h2.subscription { border:0; margin:0; padding:3px 0 0 55px; height:42px; font-size:14px;font-family:&quot;Segoe UI&quot;,Calibri,&quot;Myriad Pro&quot;,Myriad,&quot;Trebuchet MS&quot;,Helvetica,Arial,sans-serif;
font-weight:bold; }

#social1 .social2 h2.subscription:hover {color:#1c5ef3; font-size:15px;}

#social1 .social2 h2.facebook { background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgb6AYaYk_jmMWDwgM3FtS6GA0P-cGmukEVk6uw2Bba_hyFAca9cRPkV5K-S9y75OwD77Il364YC4uHxuJUwNfJq6g8Ech-mEc_-d58seVKQnn2pR9Dymzt0fU-Ly68fNvR8QWerbvg7io/s1600/bloggertrix-facebook-icon.png) no-repeat top left; }

#social1 .social2 h2.twitter { background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg7vGt4HgCDdOCToMVRKnx6GMmTicCKuE7lMJgitYvFJK9Hfpe89PjKHUMYtOGShDlb-jWzT7_eeqRzL425O-CGgbZ86H4VF-v8U-wLHFTY1bkIAegSysV8Q84JgHl2HntJz7w7EsL60jg/s1600/bloggertrix-twitter-icon.png) no-repeat top left; }

#social1 .social2 h2.Rss { background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEixTvuIp08rvn7634MzKDWf2CjF7RHvnGlEL0G9PSjA4nb31YozXclIsnlTw8zpibgqMluho2BNlyCwbmV2h2LCgugif2dxALjgfhzEOtlyMDfPBKhzAN7bde_5zej-68xywE74wDCTjKQ/s1600/bloggertrix-rss-icon.png) no-repeat top left; }

#social1 .social2 .subscription a { color:#252e28; text-decoration:none; }

</style>

<div id="topbox">
<div id="social1">
<div class="social2">

<h2 class="subscription facebook"><a href="Facebook URL" target="_blank">Like On Facebook</a></h2>

<h2 class="subscription twitter"><a href="Twitter URL" target="_blank">Follow On Twitter</a></h2>

<h2 class="subscription Rss"><a href="Your Email Subscription URL" target="_blank"> Subscribe On RSS</a></h2>

</div></div>
</div>

* Repalce  Facebook URL with your URL
* Repalce  Twitter URL with your URL
* Replace Your Email Subscription URL  with your feed name

4. Now save your HTML/Javascript'.
     you are done.

1 comment:

  1. Thanks for sharing and its easy, I have done the same, without using the inbuild "share it" widget.

    ReplyDelete