Social Subscription Widget For Blogger

Hello Friends, today i am going to post a new social subscription widget for blogger.Fans and Followers show the popularity of your blog and it is important to provide your readers an easy way to subscribe to your blog.This widget will help you to do that.

How to add social subscription widget :

• Log in to your Blogger Dashboard
• Goto Layout >> Add A Gadget >> And select HTML/JavaScript from the list of widgets.
• Now Paste the following code in the HTML Box.

<style type="text/css">
        #TCT-ssw-wrap
        {
            height:250px;
            width:250px;
            background:#F2F2F2;
            color:#009;
            font-family:Georgia, "Times New Roman", Times, serif;
            padding:3px;
            border:3px solid #734E76;
            border-radius: 5px;      
        }
     
        #TCT-ssw-icons-wrap
        {
            text-align:center;
            height:50px;
            padding: 5px 0px;
        }
     
        .TCT-ssw-icons
        {
            height:40px;
            width:40px;
            float:left;
            margin-left:15px;
            margin-bottom:10px;
        }
     
        .TCT-ssw-icons:hover
        {
            opacity: .7;
            filter:alpha(opacity=70);
            height:40px;
            width:40px;
            cursor:pointer; 
        }
     
        .TCT-ssw-lbl
        {
            color:#734E76;
            font-weight:500;
            text-align:center;
            padding: 2px 0px 10px 0px;     
        }
     
         .TCT-email-field
         {
             -moz-border-radius:4px;
             -webkit-border-radius:4px;
             background:#fff url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj9zkZWMBVhigSyhO1tKJ5lv3Z3cBmMjImL8taFkXAC_R_JSkwHTegHsSU7fcF8NRh1vU2voQFSyn3m2StbKtb1X_eoaD6s2Jx39iwY7JfmLtrwy2qkwJv9CV9RSoHfYPnTxnvAzEIuUb3J/s1600/icons.png) no-repeat 0 -27px;
             border:1px solid #dcdcdc;
             border-radius:4px;
             color:#444;
             margin:0 0 15px;
             padding:10px 40px;
             width: 166px;
         }
     
         #TCT-ssw-submit
         {
            height:40px;
            width:150px;;
            background:#734E76;
            color:#FFF;
            font-weight:bold;
            text-align:center;
            margin-left: 42px;
            border-radius: 10px;
         } 
    </style>
     <div id="TCT-ssw-wrap">
        <div class="TCT-ssw-lbl">Subscribe to Us!!</div>
        <div id="TCT-ssw-icons-wrap">
            <a href="https://www.facebook.com/blogolect" rel="nofollow" title="Like us">
                <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEizvnYCsjFHMK2BX46UZjEfxkuRrMwntBXuSLCte4in-qUv8B-l_AgFCe1F1JRTwhKcouDIQEXDEkqV6a43bWHvwMZipS9nw82ez75kAjge9tMLVmPS2u5gvWMKHLzw-_afEsqPqJZBlYgw/s1600/facebook-v3.png" class="TCT-ssw-icons" alt="FB"/>
            </a>
          <a href="https://www.twitter.com/blogolect" rel="nofollow" title="Follow Us">
            <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjJF3n9I-p9HrZnKltGr1Vh0JeKT-GypkOsLlJqPVGmkClh8AY7fmanwwqTvUIFpOWEM4OTnYDHB0396OlTVIHf2YsphDWxyIyreiymLAdfr2ZsGum6qBmzV13brpSoGYAeaIHp6xbh5v2U/s1600/twitter-v3.png" class="TCT-ssw-icons" alt="TW" />
            </a>
            <a href="https://plus.google.com/106747776208858917783" rel="nofollow" title="Follow us">
            <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgRLCZdTXjcCViWhjOJB_5j3o49ufRbrjcyjZXOuKmWIk1OiDxqlz9OCQ73iCxVlapEBbgkcBYu_qWaU697i0knvfNlAfl9-Jm5JiIVNfL6K6bIq6ppMni0w5YISzj6OqsPt0_Y6uduDqb6/s1600/google+-v3.png" class="TCT-ssw-icons" alt="G+"/>
            </a>
            <a href="http://feeds.feedburner.com/blogolect" title="Subscribe Us">
            <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhUZ1Ro0eifgzDETaADFKN1_K60vYFb0t9fhwdJUENQKyhzi92m4K3KPY5FPXyXt7nO0zcYFw5jHaUP49PbSMeEuL8gHF9qDWURaPpfUItaEBFFpBcyzPtO0-91QTbzSAKyQUWmx2LsNzWz/s1600/rss-v3.png" class="TCT-ssw-icons" alt="RSS"/>
            </a>
        </div>
        <div class="TCT-ssw-lbl">Get Pro Tutorials directly<br /> in to your Inbox</div>
        <form action="http://feedburner.google.com/fb/a/mailverify" method="post" target="popupwindow" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=blogolect', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true">
            <input  type="text" class="TCT-email-field" name="email" autocomplete="off" placeholder="Enter your email address"/><br />
            <input type="hidden" value="Blogolect" name="uri"/>
            <input type="hidden" name="loc" value="en_US"/>
            <input type="submit" value="Subscribe" id="TCT-ssw-submit"/>
        </form>
    </div>

•  Now Replace my Highlighted usernames with yours and click on save.

If you face any problem adding this widget in your blog, you can comment here.

---> Do you enjoy this article? Share it with friends/followers and subscribe to this blog now, for you to stay updated with our latest post.

Share This:

Tags:

Widgets

• Prevoius
• Next