Social Media And Rss Subscribe Widget For Blogger

In  this  tutorial   im   gonna  explain  how  to   add  Social
Media And Rss Subscribe Widget.  By  using  this  widget
you  can link your social  media  profile  Facebook, Twitter
and  Rss and  subscribe  field. It  will help to  get  the new
updates by  emails. You  can check  it  from  below   demo
link .If  you  want to  look at  other  rss  feed  subscription
widget,click this link.
If you have any questions regarding to this.Let me know.
I will help you.


                                                                        Demo

1. Log in to blogger account and Click drop down.

2. Now select "Layout" Like Below.

3. Click Add Gadget and select 'HTML/Javascript

4. Paste below one of below code.

<style>
.subscribebtrix {
border: 2px solid #000000;
padding: 8px;
width: 310px;
-webkit-transition: all 0.5s ease-in-out;
-moz-transition: all 0.5s ease-in-out;
-ms-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;
transition: all 0.5s ease-in-out;
}
.subscribebtrix:hover {
-moz-box-shadow: inset 1px 1px 10px 1px rgba(249, 215, 126, 1);
-webkit-box-shadow: inset 1px 1px 10px 1px rgba(249, 215, 126, 1);
box-shadow: inset 1px 1px 10px 1px rgba(249, 215, 126, 1);
}
.tbimailbox {
border: 1px solid #D3D3D3;
-webkit-border-radius: 4px;
border-radius: 4px;
-moz-box-shadow: 1px 1px 1px 1px rgba(255, 172, 84, 0.4) inset;
-webkit-box-shadow: 1px 1px 1px 1px rgba(0, 0, 0, 0.4) inset;
box-shadow: 1px 1px 1px 1px rgba(0, 0, 0, 0.4) inset;
color: #666;
font: 14px "trebuchet ms", sans-serif;
padding: 7px 15px;
width: 160px;
-webkit-transition: all 0.5s ease-in-out;
-moz-transition: all 0.5s ease-in-out;
-ms-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;
transition: all 0.5s ease-in-out;
}
.tbimailbox:hover {
-webkit-box-shadow: none;
box-shadow: none;
-webkit-transition: all 0.5s ease-in-out;
-moz-transition: all 0.5s ease-in-out;
-ms-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;
transition: all 0.5s ease-in-out;
}
.btrixsubmit {
font: bold 12px Tahoma, Geneva, sans-serif;
font-style: normal;
color: #ffffff;
background: #ff5714;
border: 0px solid #ffffff;
text-shadow: 0px -1px 1px #222222;
box-shadow: 2px 2px 5px #000000;
-moz-box-shadow: 2px 2px 5px #000000;
-webkit-box-shadow: 2px 2px 5px #000000;
border-radius: 10px 10px 10px 10px;
-moz-border-radius: 10px 10px 10px 10px;
-webkit-border-radius: 10px 10px 10px 10px;
padding: 8px 15px;
cursor: pointer;
margin: 0 auto;
}
.btrixsubmit:active {
cursor: pointer;
position: relative;
top: 2px;
}
.btrixsubmit::-moz-focus-inner {
border: 0;
padding: 0;
margin: 0;
}
</style>

<br />
<div class="subscribebtrix">
<div style="color: #666666; font-weight: bold; font: 22px Oswald, cursive; margin: 0px 0px 10px 15px;">
Free Updates to your Inbox</div>
<div style="margin: 10px 0 0 6px;">
<form action="http://feedburner.google.com/fb/a/mailverify" class="emailform" method="post" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=bloggertrix', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true" style="margin: 0pt;" target="popupwindow">
<input name="uri" type="hidden" value="cool3bloggertrix" />
<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="btrixsubmit" title="" type="submit" value="Subscribe" />
</form>
</div>
<div style="border: none; color: #666666; font: 22px Oswald, cursive; margin: 25px 0 0 5px;">
Follow us:</div>
<div style="margin: -32px 0 0 120px;">
<a href="http://www.facebook.com/cool33bloggertrix" target="_blank" title="Join us on Facebook"><img alt="facebook" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgefqeFNjoAyeZZX3rcERkxMMG6c4LK15yplu00YnWBkjCiNijYnw2FKiB8v29m09uVaM7n7f5FwAuBFZTCBp7KJW3Qub6gLbBIFblpW8STPiJ5vJtAcOiadrejLAq1C-yQDLu9wn_eR1s/s1600/facebook_btrix.png" /></a>
<a href="http://www.twitter.com/cool33bloggertrix" rel="nofollow" target="_blank" title="Follow us on Twitter"><img alt="twitter" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhAKjTU80uSa5Nk5U4vYZx4-FvPWwAFejEOvMQa2-3T_SHBQQXZgCZUX5OMHbMCuiCb6csKJPMQteNonm96odAGjWPWub6fy7eA2DOhBPmC63-_aOVcZ_lQsK7tQJBJrYuSWWNXVV6Ini8/s1600/twitter_btrix.png" /></a>
<a href="https://plus.google.com/UserId" rel="nofollow" target="_blank" title="Follow us on Google+"><img alt="gplus" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgyGxIMakmAs1uALMBsntncX6nUlDYevAN9Exb6q6UA58yOKSSRVikDpfMWVu2LYgH7vSOKzJzR0yA8JuvRYZb-uuFo_FPAhJSel-gFijFxxsfQW6dsmcBzy6L-uZqceZgsCwPPCJltKHw/s1600/googleplus_btrix.png" /></a>
<a href="http://www.pinterest.com/cool33bloggertrix" rel="nofollow" target="_blank" title="Follow us on Pinterest"><img alt="pinterest" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiXHn5ZD5tCcluf2i48LrboWfDbL6o6dVU8iD5-55e7BTdTN1i8RUj9xtljd4zz8kTSS3u8mbDDeO10PGH3WOmhoP2ZJo0-wq1WMnioW5I7SZDtfUFVkfXz9yWVv84WC71FTL4GWYsZodU/s1600/pinterest_btrix.png" /></a>
<a href="http://feeds2.feedburner.com/cool33bloggertrix" rel="nofollow" target="_blank" title="Subscribe to RSS"><img alt="rss" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj1FJKgmXDpag4fTuUoFo-iDoIZ9sG8_5UCIJFA3TtIzz4OddN6KyYrP05d9OC9L34pW56-LsDLWFt25h_PSwX0GMVm7rgelCxyn0ix0Q-6JFNQkfC3LQ0ijF4ifPZxJC2Pe7ma5kfhnEI/s1600/rss_btrix.png" /></a>
</div>
<div align="center">
<a href="http://feeds.feedburner.com/cool33bloggertrix"><img alt="" height="26" src="http://feeds.feedburner.com/~fc/bloggertrix?bg=FF9900&amp;fg=444444&amp;anim=1" style="border: 0;" width="88" /></a></div>
</div>

Replace cool33bloggertrix with your Feedburner ID
Replace cool33bloggertrix with your Facebook username
Replace cool33bloggertrix with your Twitter Username
Replace cool33bloggertrix with your Pinterest Username
Replace cool33UserId with your Twitter Username

5. Now save your HTML/Javascript'.

    You are done...