Get Started

List of top Professional Looking Stylish social subscription widgets for Blogger

Sanjay Choubey

·

·

, ,

Awesome Looking Blogger social Networks Gadgets :

Social sites are one of the best source of traffic for your website. It enhances your site’s online reputation. There are many new viewers come to your sites by searching there queries, A good Blogger must shows a social network gadget in his Blog so that Readers can be connected with the website’s updates by liking social pages and profiles.
Install All in one Social Widget for Blogger
 
I am sharing some awesome look Blogger social network widget. You can install any of the widget for your blog. follow these steps for installing the Blogger gadget on your blog.
  • Go to Blogger Dashboard.
  • Select your blog and click on layout
  • Select add an html/javascript 
  • Select any of the social network widget from below and paste it
  • Click on save and drag it where you want to show it in your blog.

 

Blogger social sites gadget
<style type=”text/css”>
    #UT-ssw-wrap
    {
        height:250px;
        width:250px;
        background:url(https://3.bp.blogspot.com/-Mun6TvBk3ws/UbSb8AtHSkI/AAAAAAAAApM/9tMv13YQmgQ/s1600/background.png) repeat;
        color:#009;
        font-family:Georgia, “Times New Roman”, Times, serif;
        padding:3px;
        border:1px solid #dcdcdc;
        box-shadow: 1px 1px 2px #000;
    }
   
    #UT-ssw-icons-wrap
    {
        text-align:center;
        height:50px;
        padding: 5px 0px;
    }
   
    .UT-ssw-icons
    {
        height:40px;
        width:40px;
        float:left;
        margin-left:15px;
        margin-bottom:10px;
    }
   
    .UT-ssw-icons:hover
    {
        opacity: .7;
        filter:alpha(opacity=70);
        height:40px;
        width:40px;
        cursor:pointer;   
    }
   
    .UT-ssw-lbl
    {
        color:#0F4794;
        font-weight:bold;
        text-align:center;
        padding: 2px 0px 10px 0px;       
    }
   
     .UT-email-field
     {
         -moz-border-radius:4px;
         -webkit-border-radius:4px;
         background:#fff url(https://1.bp.blogspot.com/-aN-9NuB-9t0/UbSeXzRF5II/AAAAAAAAApc/bn-lNSJ6VaY/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;
     }
   
     #UT-ssw-submit
     {
         height:30px;
        width:100px;;
        background:#0F4794;
        color:#FFF;
        font-weight:bold;
        text-align:center;
        margin-left: 70px;
        border-radius: 10px;
     }   
</style>
<div id=”UT-ssw-wrap”>
    <div class=”UT-ssw-lbl”>Be in touch!!</div>
    <div id=”UT-ssw-icons-wrap”>
        <a href=”https://www.facebook.com/a1bloggerseo”target=”_blank” rel=”nofollow” title=”Like us”>
            <img src=”http://4.bp.blogspot.com/-M-Oo98iERWY/UaRAbxTMUvI/AAAAAAAAAl0/aRVei7LDdeQ/s1600/Facebook.png” class=”UT-ssw-icons” alt=”FB”/>
        </a>
      <a href=”https://www.twitter.com/ersnjy”target=”_blank” rel=”nofollow” title=”Follow Us”>
        <img src=”http://3.bp.blogspot.com/-N0J8rtp0-rI/UaRAcmQ3TAI/AAAAAAAAAmU/pHfp_FBKAJU/s1600/Twitter.png” class=”UT-ssw-icons” alt=”TW” />
        </a>
        <a href=”https://plus.google.com/u/0/102186620539628606324″target=”_blank” rel=”nofollow” title=”Follow us”>
        <img src=”http://4.bp.blogspot.com/-1WxFAITv3gk/UaRAb_ID9sI/AAAAAAAAAl8/kS_YK-2Rjfk/s1600/Google+.png” class=”UT-ssw-icons” alt=”G+”/>
        </a>
        <a href=”http://feeds.feedburner.com/a1bloggerseo”target=”_blank”>
        <img src=”http://1.bp.blogspot.com/-ypamIXUZMq8/UaRAcYh7rwI/AAAAAAAAAmM/h7C6rUhIqrQ/s1600/RSS.png” class=”UT-ssw-icons” alt=”RSS”/>
        </a>                              
    </div>
    <div class=”UT-ssw-lbl”>Get my Upcoming posts 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= a1bloggerseo ‘, ‘popupwindow’, ‘scrollbars=yes,width=550,height=520’);return true”>
        <inpUT  type=”text” class=”UT-email-field” name=”email” aUTocomplete=”off” placeholder=”Enter your email address”/><br />
        <inpUT type=”hidden” value=” a1bloggerseo ” name=”uri”/>
        <inpUT type=”hidden” name=”loc” value=”en_US”/>
        <inpUT type=”submit” value=”Subscribe” id=”UT-ssw-submit”/>  
    </form>
</div>
<style type=”text/css”>
        #UT-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;       
        }
      
        #UT-ssw-icons-wrap
        {
            text-align:center;
            height:50px;
            padding: 5px 0px;
        }
      
        .UT-ssw-icons
        {
            height:40px;
            width:40px;
            float:left;
            margin-left:15px;
            margin-bottom:10px;
        }
      
        .UT-ssw-icons:hover
        {
            opacity: .7;
            filter:alpha(opacity=70);
            height:40px;
            width:40px;
            cursor:pointer;  
        }
      
        .UT-ssw-lbl
        {
            color:#734E76;
            font-weight:500;
            text-align:center;
            padding: 2px 0px 10px 0px;      
        }
      
         .UT-email-field
         {
             -moz-border-radius:4px;
             -webkit-border-radius:4px;
             background:#fff url(https://1.bp.blogspot.com/-aN-9NuB-9t0/UbSeXzRF5II/AAAAAAAAApc/bn-lNSJ6VaY/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;
         }
      
         #UT-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=”UT-ssw-wrap”>
        <div class=”UT-ssw-lbl”>Subscribe to Us!!</div>
        <div id=”UT-ssw-icons-wrap”>
            <a href=”https://www.facebook.com/a1bloggerseo” target=”_blank”rel=”nofollow” title=”Like us”>
                <img src=”http://1.bp.blogspot.com/-rom0fP44ejo/Ucl-v1Bu20I/AAAAAAAAAsA/2Ywu0ZE_j9o/s1600/facebook-v3.png” class=”UT-ssw-icons” alt=”FB”/>
            </a>
          <a href=”https://www.twitter.com/ersnjy“target=”_blank” rel=”nofollow” title=”Follow Us”>
            <img src=”http://4.bp.blogspot.com/-p6SV9eQtPEI/Ucl-wXggpLI/AAAAAAAAAsE/oEtli0Ob1Vw/s1600/twitter-v3.png” class=”UT-ssw-icons” alt=”TW” />
            </a>
            <a href=”https://plus.google.com/u/0/102186620539628606324” target=”_blank” rel=”nofollow” title=”Follow us”>
            <img src=”http://1.bp.blogspot.com/-Uy19r1CpVog/Ucl-vYYftQI/AAAAAAAAArw/gDDxoH2mlg8/s1600/google+-v3.png” class=”UT-ssw-icons” alt=”G+”/>
            </a>
            <a href=”http://feeds.feedburner.com/a1bloggerseo” target=”_blank”title=”Subscribe Us”>
            <img src=”http://1.bp.blogspot.com/-9mP99wndEk0/Ucl-v09LxKI/AAAAAAAAAr0/aaxYZQUsPrY/s1600/rss-v3.png” class=”UT-ssw-icons” alt=”RSS”/>
            </a>
        </div>
        <div class=”UT-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=a1bloggerseo‘, ‘popupwindow’, ‘scrollbars=yes,width=550,height=520’);return true”>
            <inpUT  type=”text” class=”UT-email-field” name=”email” aUTocomplete=”off” placeholder=”Enter youremail address”/><br />
            <inpUT type=”hidden” value=”a1bloggerseo” name=”uri”/>
            <inpUT type=”hidden” name=”loc” value=”en_US”/>
            <inpUT type=”submit” value=”Subscribe” id=”UT-ssw-submit”/>
        </form>
    </div>
 
 
 
 
<style>
.UT-Social-Icons
{
    height:45px;
    width:45px;
}
.UT-Social-Icons:hover
{
    opacity: .7;
    filter:alpha(opacity=70);
    height:45px;
    width:45px;
    cursor:pointer;
}
#UT-wrap
{
    height:250px;
    width:250px;
    background:#EBEBEB;
    border:1px solid transparent;
    box-shadow:0px 0px 1px 2px #009;
}
#UT-header
{
    height:30px;
    background-color:#0F4794;
    color:#FFF;
    text-align:center;
    padding-top:5px;
    font-weight:bold;
}
#UT-wrap a
{
    text-decoration:none;
}
#UT-SI-wrap
{
    margin-top:15px;
    text-align:center;
}
.UT-margin
{
    margin-left:10px;
}
.UT-label
{
    color:#0F4794;
    font-weight:800;
    text-align:center;
    margin-top:10px;
}
.UT-left
{
    float:left;
    margin-left:5px;
}
.UT-inpUTs
{
    height:2.5em;
    border-radius:2px 2px 2px 2px;
}
#UT-subs
{
    margin-left:30px;
    background-color:#0F4794;
    color:#FFF;
}
</style>
<div id=”UT-wrap”>
    <div id=”UT-header”>
        Follow us on Social Media !
    </div>
    <div id=”UT-SI-wrap”>
        <a href=”https://www.facebook.com/a1bloggerseo” target=”_blank”rel=”nofollow” title=”Like us”>
            <img src=”http://3.bp.blogspot.com/-UVBdtc4H7dE/UZoKV6IcPxI/AAAAAAAAAjM/4eEjKW0doqU/s1600/facebook-bs.png” class=”UT-Social-Icons”/>
        </a>
        <a href=”https://www.twitter.com/ersnjy” target=”_blank”rel=”nofollow” title=”Follow Us”>
        <img src=”http://4.bp.blogspot.com/-T0bbdULbrT4/UZoKXFGb3cI/AAAAAAAAAjc/rAMHKhJATxg/s1600/twitter-bs.png” class=”UT-Social-Icons UT-margin”/>
        </a>
        <a href=”https://plus.google.com/u/0/102186620539628606324” target=”_blank”rel=”nofollow” rel=”Follow us”>
        <img src=”http://1.bp.blogspot.com/-_qBJVgAxEbo/UZoKVuUCwaI/AAAAAAAAAjE/lNCevc0tuIA/s1600/Googleplus-bs.png” class=”UT-Social-Icons UT-margin”/>
        </a>
        <a href=”http://feeds.feedburner.com/a1bloggerseo“>
        <img src=”http://3.bp.blogspot.com/-TZMaBiooQxU/UZoKV2_vHdI/AAAAAAAAAjI/teSxXGB4VtU/s1600/RSS-bs.png” class=”UT-Social-Icons UT-margin”/>
        </a>                        
    </div>
    <div class=”UT-label”>
        Subscribe to our RSS Feeds
    </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=a1bloggerseo‘, ‘popupwindow’, ‘scrollbars=yes,width=550,height=520’);return true”>    
     <div>
        <div class=”UT-left” style=”margin-top:30px;”>
                <div>
                <inpUT type=”text” name=”email” placeholder=”Get Updates Via Email” class=”UT-inpUTs” style=”width:150px;”> 
                <inpUT type=”hidden” value=”a1bloggerseo” name=”uri”/>
                <inpUT type=”hidden” name=”loc” value=”en_US”/> 
                </div>
        </div>
        <div class=”UT-left”>
            <img src=”http://4.bp.blogspot.com/-Ci6P54Gtvvg/UZoKW26sbeI/AAAAAAAAAjg/eRhopwvs8xo/s1600/sub-rss.png” height=”80″ width=”80″ style=”margin-top:8px;”/>
        </div>
        <div clear:both;></div>
    </div>
    <div style=”margin-top:-10px;”> 
        <inpUT type=”submit” value=”Subscribe” class=”UT-inpUTs” id=”UT-subs”/>   
    </div>    
    </form>
</div>

 




How to customize :

  • Replace https://www.facebook.com/a1bloggerseo with your own facebook address.
  • Change https://www.twitter.com/ersnjy with your own twitter id.
  • Reaplace the g+ url  https://plus.google.com/u/0/102186620539628606324 with your own id.
  • a1bloggerseo is my feed id you have to change it with yours. there are three occurrence for the feedburner id. change those with your own feedburner id.
If you having any issue, Fell free to ask to me in the comment section.
 

Sanjay Choubey

Sanjay Kr. Choubey is a digital marketer from N. Delhi having 7+ years of exp. Discover, What I can do for You!

Leave a Reply

Your email address will not be published. Required fields are marked *

10 responses to “List of top Professional Looking Stylish social subscription widgets for Blogger”
  1. Sri ram Avatar
    Sri ram

    Hi Sanjay,
    The widgets are nice and I think it won’t affect loading time of the page.
    Thanks for sharing those.

  2. sanjay choubey Avatar
    sanjay choubey

    Sri Ram Thank you for being here. Yeah you are right it will not affect Blog loading because of short and simple coding.

  3. Shameem Thaha Avatar
    Shameem Thaha

    Thanks dude which i have been looking for my blogger blog it can help us in speed

  4. sanjay choubey Avatar
    sanjay choubey

    Thanks Shameem bro for being here.
    Feeling good to know these widgets are
    helpful for you. Be in touch for more
    useful updates

  5. Nwosu Desmond Mavtrevor Avatar
    Nwosu Desmond Mavtrevor

    As much as i dont use blogger, i believe these widgets can also work on WordPress?

  6. sanjay choubey Avatar
    sanjay choubey

    yes dear these widgets will work on wordpress you can see the link
    https://sanjaychoubey.com/2013/06/how-to-add-thirt-party-widget-in.html

  7. Akshat Bhanchawat Avatar
    Akshat Bhanchawat

    Thanks for sharing all this and expect that they are fast loading..

  8. sanjay choubey Avatar
    sanjay choubey

    Thank you Akshat to like my work .
    Will keep publish some more useful tips
    Keep appreciating my work.

  9. Ryan Biddulph Avatar
    Ryan Biddulph

    Really good looking widgets Sanjay, thanks for sharing.

  10. sanjay choubey Avatar
    sanjay choubey

    Thanks Ryan for liking my work. stay connected with me for more useful tips and tricks.

15 Years Experienced SEO freelancer
Call me at – 8802309980 or WhatsApp Now