Tuesday, February 12, 2013

Retro Style Rss Subscription Widget For Blogger

Today  i  gonna  explain  how   to  add Retro Style rssfeed  subscribe box for blogger. This is unique widget.Your  visitors can  subscribe   Rss news feed form this widget.  It will  help to  get  pageview  for   your  blog. You can check it from below demo link.If you want tolook at other rss feed subscription widget,click this link.


Retro+Style+Rss+Subscription+Widget+For+Blogger

Demo

1. Log in to blogger account and Click drop down.
blog-post-option
2. Now select "Layout" Like Below.

3. Click Add Gadget and select 'HTML/Javascript

4. Paste below one of below code.

<style>

#socialbox{border:2px solid black;
width:270px;padding: 5px 5px 5px 5px;  }

img.beintouch:hover {
    background: none repeat scroll 0 0 #ffbc99;
    border-radius: 16px 16px 16px 16px;
    box-shadow: 0 0 10px #ffbc12;
}
.emailtext {
    background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhdXD6q4aNnsBvfZpE3RBWDgS31ol4fllEpFpFfMBNazYiYS663GiyCmxI6DA9CzDbUio4xuUISa8BnTDSEobE04zOJnOjIhV9U0GdfWfvH0x-CQQlViAu0y4gI7Rp_x-URGS2fYH2erX8/s1600/mailbox.png") no-repeat scroll 4px center transparent;
    border: 1px solid #7E4E27;
    border-radius: 4px 4px 4px 4px;
    box-shadow: 1px 1px 4px #7E4E27 inset;
    color: #444444;
    font-weight: bold;
    margin-left: 2px;
    padding: 7px 15px 7px 35px;
    text-decoration: none;
    width: 120px;
}
.ebutton {
    background: #D55959;
    border: 1px solid #D3D3D3;
    border-radius: 4px 4px 4px 4px;
    color: #FFFFFF;
    cursor: pointer;
    font-weight: bold;
    margin-left: -18px;
    margin-top: 5px;
    padding: 6px 15px;
    text-decoration: none;
    text-shadow: 1px 1px 0 #000000;
}
</style>
<br />
<div id="socialbox">
<table align="" cellpadding="1px" cellspacing="0px" style="width: 290pxpx;"><tbody>
<tr><td>
<a href="http://facebook.com/Bloggertrix" rel="nofollow" target="_blank"> <img class="beintouch" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg1UY8_yshGyYnoSnO8orLyi-dVBAyJ8G0gGDhxmCNktBg9HoYiy9Q2lIgLa56QxEFwB0dpcKeKnB6VT0pfRe6siumoDqT3eDT35B0KYuHBbbZVlUbzeTGPhMiMe2TjLT1bbOAqpaSJMwQ/s1600/bloggertrix-facebook-icon.png" /></a></td><td>
<a href="http://twitter.com/Bloggertrix" rel="nofollow" target="_blank"><img class="beintouch" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg88mjZ1x5E5s-Vc4YRrNNuAoiVG7zfsMAZm_M6lS3ylrTCICFzM6YB53tAN-CzpDdaas5dkHmnFtCKoaOY6HTPYcyqa9sHW99LWxJBdwZGsa5s0YhN_WAuZvBjqFiYXlmz8-4my1_ZopQ/s1600/bloggertrix-twitter-icon.png" /></a></td><td>
<a href="http://pinterest.com/Bloggertrix" rel="nofollow" target="_blank"><img class="beintouch" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjFauna76l1Ix5s-oPe54rFj352YlqJyIZ_1umEQ7V7njg7GISQLodTwAhZBZHL4RUTrhcCuihKH_Hz5wiZ9r4QPjxDQfB4skON2KYzjwhtnsisHDkodrNksH-wMCLWgPjs1MY9dA4aHGk/s1600/bloggertrix-pinterest-icon.png" /></a></td><td>
<a href="https://plus.google.com/107955298793879607964" rel="nofollow" target="_blank"><img class="beintouch" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiVDLBlXBt7P43q9WJYpVsKAaTMKYsJtllXy02Ng5j44QX_I_ea2aVZy9nZ0eW0AkPSTw2Y8AjEYzM3p5h9TYwKCViU8nuabBmgPRAfaZ38q3bGSA5kz6AcK4BoOVOXPUQfSFeU7SjI_eg/s1600/bloggertrix-google-icon.png" /></a></td><td>
<a href="http://feeds.feedburner.com/Bloggertrix" rel="nofollow" target="_blank"><img class="beintouch" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhUuMA7PEO-rgW3uFpSM0c03pwHYKMfpS_84tEWSIywMqtDWZboLuzx0RIsDSLcdJ0vgAtOXKBkq0uMKK4VkMW4DuMSA8SecPActIHC_RvgXpSiaQAslkiNoYrqFXS9tw1Jaid-2vlWCKk/s1600/bloggertrix-rss-feed-icon.png" /></a><a href="http://bloggertrix.com/"></a></td></tr>
</tbody></table>
<div>
<center>
<b>Get Newest Articles By EMAILS </b></center></div>
<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="bloggertrix" />
<input name="loc" type="hidden" value="en_US" />
<input class="emailtext" 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="ebutton" title="" type="submit" value="Subscribe" />
</form>
</div>
For social media icons, you can change URLs as your link.
Replace Bloggertrix with your Feedburner ID

7. Now save your HTML/Javascript'.

    You are done...

0 comments:

Post a Comment