Sunday, 17 June 2012

How To Add Elegant Rss Email Subscription Widget Box To Blogger

Rss Supply play's part in increaseing the website/blogs visitors.Most of the weblog person's use it as a device which produces visitors for them.Creating a Rss Supply Registration box is intelligent shift.If your website/blog Articles is of top excellent then Rss Supply Registration Box will not let you down.Usually visitor's and visitor's sign up to your website via e-mail to get your blog's newest up-dates straightly into there mailbox.Setting Up A Rss Supply Email Registration Device is not very challenging it is very easy,you don't need any kind of exercising.You make your own Rss Supply in easy actions but before that you should have a Rss Supply for your website,if you don't have Rss Supply For your Blog Go Here to Understand How You Can Get rid of Your Blog Supply In Feedburner.Now let us begin working

Go to Blog writer.com >>Your Blog >> Design >> Obtain BackUp of template>>then Increase Device Templates>>Search for </head> and just above it insert the following value                                                                                                 

    <style type='text/css'>
    .sub-box{
    width: 600px;
    background: #fff;
    padding: 2px 5px 7px 7px;
    border: 2px strong #000;
    border-radius: 15px;
    }
    .sub-box:hover{
    border-style:dashed; 2px solid: #389af2;
    }
    .followlinks h1{
    font-family:Cabin Condensed;
    font-weight: bold;
    color: #000;
    padding: 0px 0px 2px 40px;;
    font-size:17px;
    }
    .followlinks ul{
    font-family:Cabin Condensed;
    font-weight: bold;
    }
    .followlinks ul li{
    float:left;
    width:90px;
    padding-left:40px;
    margin:0 0 0 5px !important;
    line-height:35px !important;
    }
    .followlinks ul li a{
    font-size:20px !important;
    text-decoration:none;
    font-weight:normal;
    }
    .followlinks ul li.otrss{
    background:url(http://3.bp.blogspot.com/-xOwt1EX4VX4/TteO7sxzSxI/AAAAAAAABFk/RNFj1bsukpQ/s1600/rss-ot.png) no-repeat look for remaining middle transparent;
    }
    .followlinks ul li.otgoogleplus{
    background:url(http://3.bp.blogspot.com/-GW70c2ukQsI/TteO6ikOudI/AAAAAAAABFc/Cjqxp-ZVbX4/s1600/googleplus-ot.png) no-repeat look for remaining middle transparent;
    }
    .followlinks ul li.ottwitter{
    background:url(http://1.bp.blogspot.com/-LTDd7jrc55s/TteO8nMa6uI/AAAAAAAABFs/r6aMf7ApC6Q/s1600/twitter-ot.png) no-repeat look for remaining middle transparent;
    }
    .followlinks ul li.otfacebook{
    background:url(http://4.bp.blogspot.com/-RtDc-xIqgtg/TteO56LVTgI/AAAAAAAABFU/iWhsfa01wEo/s1600/facebook-ot.png) no-repeat look for remaining middle transparent;
    }
    type.emailform{
    margin:5px 0 0;
    display:block;
    clear:both;
    }
    .emailtext{
    background:url(http://4.bp.blogspot.com/-DMrSxx8BJqo/TteQx1ijO2I/AAAAAAAABF0/Qd1ROb_8oeA/s1600/ot-mail.png) no-repeat look for 4px middle transparent;
    padding:7px 15px 7px 35px;
    color:#444;
    font-weight:bold;
    text-decoration:none;
    border:1px strong #D3D3D3;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    border-radius: 4px;
    -moz-box-shadow: 1px 1px 2px #CCC inset;
    -webkit-box-shadow: 1px 1px 2px #CCC inset;
    box-shadow: 1px 1px 2px #CCC inset;
    width: 550px;
    }
    .emailtext:focus{
    outline: none;
    }
    .sub-button{
    color:#444;
    font-weight:bold;
    text-decoration:none;
    padding:6px 10px;
    border:1px strong #D3D3D3;
    cursor: pointer;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    -goog-ms-border-radius: 5px;
    border-radius: 5px;
    background: #fbfbfb;
    background: -moz-linear-gradient(top, #fbfbfb 0%, #f4f4f4 100%);
    background: -webkit-gradient(linear, remaining top, remaining base, color-stop(0%,#fbfbfb), color-stop(100%,#f4f4f4));
    background: -webkit-linear-gradient(top, #fbfbfb 0%,#f4f4f4 100%);
    background: -o-linear-gradient(top, #fbfbfb 0%,#f4f4f4 100%);
    background: -ms-linear-gradient(top, #fbfbfb 0%,#f4f4f4 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr=&#39;#FBFBFB&#39;, endColorstr=&#39;#F4F4F4&#39;,GradientType=0 );
    background: linear-gradient(top, #fbfbfb 0%,#f4f4f4 100%);
    }
    .sub-button:hover{
    background: -moz-linear-gradient(top, #e7e7e7 0%, #f4f4f4 100%);
    background: -webkit-gradient(linear, remaining top, remaining base, color-stop(0%,#e7e7e7), color-stop(100%,#f4f4f4));
    background: -webkit-linear-gradient(top, #e7e7e7 0%,#f4f4f4 100%);
    background: -o-linear-gradient(top, #e7e7e7 0%,#f4f4f4 100%);
    background: -ms-linear-gradient(top, #e7e7e7 0%,#f4f4f4 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr=&#39;#e7e7e7&#39;, endColorstr=&#39;#F4F4F4&#39;,GradientType=0 );
    background: linear-gradient(top, #e7e7e7 0%,#f4f4f4 100%);
    }</style>
    <script type='text/javascript'>
      WebFontConfig = {
        google: { families: [ &#39;Cabin+Condensed::latin&#39; ] }
      };
      (function() {
        var wf = papers.createElement(&#39;script&#39;);
        wf.src = (&#39;https:&#39; == papers.location.protocol ? &#39;https&#39; : &#39;http&#39;) +
          &#39;://ajax.googleapis.com/ajax/libs/webfont/1/webfont.js&#39;;
        wf.type = &#39;text/javascript&#39;;
        wf.async = &#39;true&#39;;
        var s = papers.getElementsByTagName(&#39;script&#39;)[0];
        s.parentNode.insertBefore(wf, s);
      })(); </script>


Now Just Preserve your Design By Pushing Preserve Now and continue to next phase now position the following value where you want to show Rss Supply Email Registration Box in your website.If you want to position it in sidebar go to>> Blog writer.com >> YourBlog >> Structure >> Add A Device >> Html/Javascript >> and duplicate the following value there                                                                                                 

    <div class='sub-box'>
    <div class='followlinks'>
    <h1>Get No cost Email Updates or Like us on your preferred Public media site</h1>
    <ul>
    <li class='otrss'><a href='http://feeds.feedburner.com/Everfreetech' target='_blank'>RSS</a></li>
    <li class='otgoogleplus'><a href='http://plus.google.com/114636838169087641091' target='_blank'>Google+</a></li>
    <li class='ottwitter'><a href='http://twitter.com/Fosterzone' target='_blank'>Twitter</a></li>
    <li class='otfacebook'><a href='https://www.facebook.com/Mybloggerlab' target='_blank'>Facebook</a></li>
    </ul>
    </div>
    <br/>
    <div style='text-align: left; display: inline-block;'>
    <form action='http://feedburner.google.com/fb/a/mailverify' class='emailform' method='post' onsubmit='window.open(&apos;http://feedburner.google.com/fb/a/mailverify?uri=Everfreetech&apos;, &apos;popupwindow&apos;, &apos;scrollbars=yes,width=550,height=520&apos;);return true' target='popupwindow'>

    <input name='uri' type='hidden' value='Everfreetech'/>
    <input name='loc' type='hidden' value='en_US'/>
    <input class='emailtext' name='email' onblur='if (this.value == &quot;&quot;) {this.value = &quot;Enter your e-mail...&quot;;}' onfocus='if (this.value == &quot;Enter your e-mail...&quot;) {this.value = &quot;&quot;}' type='text' value='Enter your e-mail...'/>
    <input alt='' class='sub-button' title='' type='submit' value='SignUp'/>
    </form></div></div>


Customizing Rss Supply Email Registration Box According to your Details:
1.To add your Rss Supply look for http://feeds.feedburner.com/Everfreetech and substitute it with your nourish url


2.To Add Google Plus Look For http://plus.google.com/114636838169087641091 and substitute it with your Google Plus web page Url


3.To Add your Tweets Page Look For Fosterzone And Put it back with your Tweets Username


4.To Add Your Facebook or myspace Page Look For https://www.facebook.com/Mybloggerlab and substitute it with your Facebook or myspace web page url


5.Now it is important including Email Registration,Look For Everfreetech and substitute it with your Rss Supply web page login name i.e (http://feeds.feedburner.com/Everfreetech) only login name don't add complete url


And Then Hit Preserve Option And Now Your Perform is done if you want to review this Device Click on HERE if you have any issue in including the widget you can ask

No comments:

Post a Comment