Multi Social Subscription Box Widget for Blogger

Save your page speed and make your blog more awesome through multi social subscription box widget for blogger.

Nowadays social subscription boxes playing a very important role in social media management and you would see social share icons, mostly on every website because it has become a big trend as well as need also, without social power no one can achieve much success in an online business whether it is on the Word Press platform or on blogger. So today I decided to share beneficial and reliable multi-color social subscription box which was created by Blogger Yard, it has lots of advantages which will surely fulfill with your needs as mentioned below.
  • It will save your page speed by combining all social icons including subscription box in one place.
  • It will implement a social friendly interface for upcoming visitors.
  • It has a multi-color background which makes it more professional and premium.
  • It is clean coded and free from bugs and errors.
  • Easy Implementation and Customization for newbies.

How to Add Multi Social Subscription Box Widget in Blogger

It’s so simple, just read the steps and implement easily.

First open your blogger account.

Go to Layout>> Add a Gadget>> Choose HTML/Java script.

Then, add the below code in HTML/javascript.
<link href="http://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,400,300,600,700" rel="stylesheet" type="text/css" />
<div id="socialsubwidget">
<div class="heading">
<h4><span style="font-weight:300;">Want To Get </span><b>Hot Updates?</b></h4>
<p>
Follow Us On Your Favourite Social Networking Site To Start Getting Notified!
</p>
</div>
<div class="feedburner1-emailsubs">
<form action="http://feedburner.google.com/fb/a/mailverify?uri=protechnify" method="post" target="_new">
<input class="feedburner1-email" name="email" placeholder="Your Email Address" type="text" />
<input class="feedburner1-button" type="submit" value="Sign Up!" />
</form>
</div>
<div class="fb1-likebox">
YOUR-FACEBOOK-PLUGIN
</div>
<div class="twitter1-follow">
YOUR-TWITTER-PLUGIN
</div>
<div class="gplus1-follow">
YOUR-GOOGLEPLUS-PLUGIN
</div>
<div class="pinterest1-follow">
YOUR-PINTEREST-PLUGIN
</div>
<style>
.fb1-likebox {
padding: 10px;
background: #213F92;
height: 26px;
}
.twitter1-follow {
background: #00ACEE;
height: 20px;
padding-top: 10px;
padding-left: 10px;
padding-bottom: 10px;
}
.gplus1-follow {margin-left:0px;}
.pinterest1-follow {
padding: 10px;
background: #CB2027;
height: 25px;
}
.linkedin1-follow {padding:10px; background:#069; height:25px;}
.feedburner1-emailsubs {padding-left: 10px;
padding-top: 15px;
padding-bottom: 0.2px;
background: #0D9BFF;}
.feedburner1-email {
width: 66%;
height: 35px;
padding: 8px;
background-color: white;
color: black;
border-radius: 5px 5px 5px 5px;
font-family: open sans;
outline: none;
border: 1px solid #F7B276;
}
.feedburner1-button {padding: 7px 10px;
vertical-align: top;
margin: auto;
margin-left: -7px;
text-align: left;
width: auto;
-moz-border-radius-topright: 5px !important;
-moz-border-radius-topleft: 0 !important;
-webkit-border-top-right-radius: 5px !important;
-webkit-border-top-left-radius: 0 !important;
-moz-border-radius-bottomright: 5px !important;
-moz-border-radius-bottomleft: 0 !important;
-webkit-border-bottom-right-radius: 5px !important;
-webkit-border-bottom-left-radius: 0 !important;
background: #95a5a6;
background-image: -webkit-gradient(linear,left bottom,left top,color-stop(0, #95a5a6),color-stop(1, #7f8c8d));
background-image: -moz-gradient(linear,left bottom,left top,color-stop(0, #95a5a6),color-stop(1, #7f8c8d));
-moz-box-shadow: 0 0 1px rgba(0, 0, 0, 0.3), 0 1px 0 rgba(255, 255, 255, 0.3) inset;
-webkit-box-shadow: 0 0 1px rgba(0, 0, 0, 0.3), 0 1px 0 rgba(255, 255, 255, 0.3) inset;
box-shadow: 0 0 1px rgba(0, 0, 0, 0.3), 0 1px 0 rgba(255, 255, 255, 0.3) inset;
border-width: 1px;
border-style: solid;
border-color: #bdc3c7;
font: 14px open sans;
color: #fff;
cursor: pointer;
font-weight: 600;
text-shadow: 0 1px 0 rgba(0,0,0,.2);
transition:background-image 400ms;
-webkit-transition:background-image 400ms;
-moz-transition:background-image 400ms;
}
.feedburner-button1:hover {
background-image: -webkit-gradient(linear,left bottom,left top,color-stop(0, #7f8c8d),color-stop(1, #95a5a6));
}
#socialsubwidget {
float: left;
width: 315px;
background: #95a5a6;
border: 0px solid #7f8c8d;
font-family:open sans;
}
#socialsubwidget .heading {
height: 110px;
padding: 5px;
}
#socialsubwidget .heading p {
text-shadow: none;
font-size: 14px;
padding: 0px;
margin: 0px;
line-height: 20px;
color: #fff;
margin-top: 5px;
text-align: center;
}
#socialsubwidget .heading h4 {
text-shadow: none;
font-size: 21px;
margin: 0px;
padding: 0px;
text-align: center;
line-height: 25px;
color: #fff;
padding-top: 15px;
padding-bottom: 10px;
}
</style>
</div>
<div class="clear"></div>

Customization

  • For Feed Burner (Signup) box, replace protechnify with your Feed Burner name or ID.
  • Replace YOUR-FACEBOOK-PLUGIN with your Facebook like button plugin which you will get from the Facebook developer site.
  • Replace YOUR-TWITTER-PLUGIN with your Twitter follows button plugin which you will get from the Twitter developer site.
  • Replace YOUR-GOOGLEPLUS-PLUGIN with your Google plus follow button plugin which you will get from Google plus developer site.
  • Replace YOUR-GOOGLEPLUS-PLUGIN with your Google plus follow button plugin which you will get from Google plus developer site.
  • Ultimately, click on save.
Read This:

Conclusion

I know you are feeling comfortable and happy after installing this all in one multi social subscription box, this subscription box will decrease your page speed and create eye touch mood with your visitors. You can add more colorful social boxes in this box like LinkedIn, Reddit and Instagram just you have to add some CSS classes and div tags for making it more socially.

COMMENTS

Name

Android,2,backlinks,7,Blogger,46,blogger theme,1,Errors,1,How To,31,Make Money Online,2,SEO,13,SMM,10,Templates,9,Tools,7,Tricks,15,Web designing,18,Widgets,24,WordPress,4,
ltr
item
PRO TECHNIFY: Multi Social Subscription Box Widget for Blogger
Multi Social Subscription Box Widget for Blogger
Save your page speed and make your blog more awesome through multi social subscription box widget for blogger.
https://4.bp.blogspot.com/-HBBAumnXt4Q/VjX9msQgLjI/AAAAAAAAI58/q_jGk9NOWYw/s640/Multi-social-subscription-box-for-blogger.jpg
https://4.bp.blogspot.com/-HBBAumnXt4Q/VjX9msQgLjI/AAAAAAAAI58/q_jGk9NOWYw/s72-c/Multi-social-subscription-box-for-blogger.jpg
PRO TECHNIFY
https://www.protechnify.com/2015/11/multi-social-subscription-box-blogger.html
https://www.protechnify.com/
https://www.protechnify.com/
https://www.protechnify.com/2015/11/multi-social-subscription-box-blogger.html
true
8223102945718438291
UTF-8
Loaded All Posts Not found any posts VIEW ALL Readmore Reply Cancel reply Delete By Home PAGES POSTS View All RECOMMENDED FOR YOU LABEL ARCHIVE SEARCH ALL POSTS Not found any post match with your request Back Home Sunday Monday Tuesday Wednesday Thursday Friday Saturday Sun Mon Tue Wed Thu Fri Sat January February March April May June July August September October November December Jan Feb Mar Apr May Jun Jul Aug Sep Oct Nov Dec just now 1 minute ago $$1$$ minutes ago 1 hour ago $$1$$ hours ago Yesterday $$1$$ days ago $$1$$ weeks ago more than 5 weeks ago Followers Follow THIS CONTENT IS PREMIUM Please share to unlock Copy All Code Select All Code All codes were copied to your clipboard Can not copy the codes / texts, please press [CTRL]+[C] (or CMD+C with Mac) to copy