Showing posts with label Blogger Widgets. Show all posts
Showing posts with label Blogger Widgets. Show all posts

Monday, 21 October 2013

Add Stylish Subscribe via Email Widget to Blogger Blog

In previous post we had discuss about Simple Feed Burner Subscription but in this post i will told you about Stylish Subscribe via Email Widget for blog/site. In previous post i had told you all about Subscription widget that how it works and how is useful it is. Now we learn a method for adding it to your blog just follow my given instructions below;




How to Add Stylish Subscribe via Email Widget to Blogger Blog


1. Go to Blogger Dashboard> Layout> Add a Gadget



2. Now Click on "HTML/JavaScript" Gadget



3. After this Copy the below set of Code and Paste it into empty box


<style>.hl-email{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh5S3l_fet4KbV0BCEbyrMI877vAqe-vEQvimqWGtSIkPnwcejkNHYbkwA4sbALCl8lymDhKtn-eI4Xb-wauop4SVaxRX_nsZrS8xiun027lARjYavOhXkEFARfHAE6UJ8WJdw_3bECPPk/s1600/mail.png) no-repeat 0px 12px ;width:300px;padding:10px 0 0 55px;float:left;font-size:1.4em;font-weight:bold;margin:0 0 10px 0;color:#686B6C;}.hl-emailsubmit{background:#9B9895;cursor:pointer;color:#fff;border:none;padding:3px;text-shadow:0 -1px 1px rgba(0,0,0,0.25);-moz-border-radius:6px;-webkit-border-radius:6px;border-radius:6px;font:12px sans-serif;}.hl-emailsubmit:hover{background:#E98313;}.textarea{padding:2px;margin:6px 2px 6px 2px;background:#f9f9f9;border:1px solid #ccc;resize:none;box-shadow:inset 1px 1px 1px rgba(0,0,0,0.1);-moz-box-shadow:inset 1px 1px 1px rgba(0,0,0,0.1);-webkit-box-shadow:inset 1px 1px 1px rgba(0,0,0,0.1); font-size:13px;width:130px;color:#666;}</style><div class="hl-email">Subscribe via Email <form action="http://feedburner.google.com/fb/a/mailverify" id="feedform" method="post" target="popupwindow" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=filezooby', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true"><input gtbfieldid="3" class="textarea" name="email" onblur="if (this.value == &quot;&quot;) {this.value = &quot;Enter email address here&quot;;}" onfocus="if (this.value == &quot;Enter email address here&quot;) {this.value = &quot;&quot;;}" value="Enter email address here" type="text" /><input type="hidden" value="filezooby" name="uri"/><input type="hidden" name="loc" value="en_US"/><input class="hl-emailsubmit" value="Submit" type="submit" /></form></div>

Note: Now you have to make following changes
  • Replace the URL Address in Blue to change the email icon
  • Increase/Decrease the 130 width value for a wider text area
  • Replace http://feedburner.google.com/fb/a/mailverify?uri=filezooby with your feed Burner Email feeding link
  • replace filezooby with your feed titile.

Finally Save it.

Add a Simple Feed Burner Email Subscribe Widget to Blogger Blog

Subscription widget helps to increase daily readers of your site or blog. In blogspot this Subscription widget is already added but when we manually add this widget from its real site then it bit different from blogger Subscription widget and in other platform we have to add this Subscription Widget manually to our site or blog. So today i will learn you a way to add this widget to your blog, Its very simple;




Add a Simple Feed Burner Email Subscribe Widget to Blogger Blog


1. Go to this link feedburner.com and Sign in with your Gmail ID
2. Now Click on your Blog like my blog name "Your Blog Helper"
3. After this Click on Publicize> Email Subscriptions
4. Then Copy the given Code and paste it into your blog

Finally you are done.