Tuesday, August 7, 2012

Pin It

Sleek Social Subscribe Box For Blogger Adapted From WordPress


Everyone thinks that Google Search is the only way to get traffic to their Blog or Website, but many popular blogs has diminished traffic from Google and still they are able to pull off tons of traffic to their blog. If you are shocked, then you have not heard of Social Networking giants i.e. Facebook, Twitter, and RSS which does provides quality traffic to websites without building Backlinks or spending money on Search Engine Optimization. It is getting necessary to socialize your blog on different social networking website because it not only provides exposure but builds quality readers. In the same way, you have to promote your Social Pages on your website, so anyone who comes either directly or From Search engine could become your regular readers. Today we will insert a Cool and Stylish Subscribe Now Box in Blogger BlogSpot Blog Adapted From WordPress so we can easily build our Social Audience.

What Is Social Subscribe Now Box:

It is your ticket to get more popular on social media i.e. Facebook, Twitter and RSS. There are many social subscribers now boxes available on the internet, but they either lack in terms of designing or they have too many scripts, which slow down Site Speed. This is the reason we have not used any scripts in this Subscribe now box, and still we are able to design it perfectly.

How To Install Subscribe Now Box in Blogger:

The steps are extremely straightforward and it would hardly take 5 minutes for the complete integration, just do as follows.

  • Go To Blogger.com >> Your Blog >> Layout 
  • Now Press Add a Gadget Button and then a new Window will pop out. 
  • Then look for Add HTML/JavaScript and Paste the following chunk of code there. 

<div id="MCTSocialWidget"
style=" background: url(IMAGE-Here);

border-radius: 3px; border: 4px solid #CCC;

font-family: 'News Cycle', Arial; font-size:

12px; overflow: hidden; width: 300px;">


<div class="MCTsocialbox" id="srss"

style="float: left;

width: 95px;">


<h2 style="background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEggq0r5hbDL4zyb_CyOr7TEgFHnDRlRXSQaTys0NA92wj2_vcwhL9jGtaxeuNr9_w9q8xex9Hbk6rLFGnhD0C9fGRIV836tUWe8y5flI8M-7hvAs1FTdkTRZJqXETI6QQDFrGXl8HpqbYG4/s1600/Social-Buttons.png);

background-position: 0px -108px;

background-repeat: no-repeat no-repeat;

border: 0px;

font-size: 11px;
font-style: inherit;
font-weight: inherit;

height: 17px;

margin: 0px 0px 5px;

outline: 0px; padding: 0px 0px 0px 16px;

vertical-align: baseline;
visibility: visible;">Subscribers</h2>



<a href="http://feeds.feedburner.com/Feed-Username" rel="nofollow"
style="border: 0px;
color: #333333;

font-family: Helvetica, Arial;

font-size: 22px;

font-weight: bold;

margin: 0px;

outline: 0px; padding: 0px;

text-decoration: none;

text-shadow: rgb(221, 221, 221) 0px 1px 1px;

vertical-align: baseline;" target="_blank">9,000+</a><br />



<ul style="border: 0px;

font-family: inherit;

font-style: inherit;

list-style: none;

margin: 3px 0px 0px;

padding: 0px;
vertical-align: baseline;">


<li id="rssfeed" style="border: 0px;

float: left;

font-family: inherit;
font-style: inherit;
margin: 0px;

outline: 0px;

padding: 0px;
vertical-align: baseline;">


<a href="http://feeds.feedburner.com/Feed-Username" rel="nofollow"

style="background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEggq0r5hbDL4zyb_CyOr7TEgFHnDRlRXSQaTys0NA92wj2_vcwhL9jGtaxeuNr9_w9q8xex9Hbk6rLFGnhD0C9fGRIV836tUWe8y5flI8M-7hvAs1FTdkTRZJqXETI6QQDFrGXl8HpqbYG4/s1600/Social-Buttons.png);

background-position: -254px -83px;

background-repeat: no-repeat no-repeat;
border: 0px;

color: #333333;

cursor: pointer;
display: block;

font-family: Helvetica, Arial;
font-size: 22px;
font-weight: bold;

height: 20px;

margin: 0px 2px 0px 0px;
outline: 0px; padding: 0px;

text-decoration: none;

text-indent: -99999px;
text-shadow: rgb(221, 221, 221) 0px 1px 1px;
vertical-align: baseline;

width: 42px;" target="_blank">Feed</a></li>



<li id="rssemail" style="border: 0px;

float: left;

font-family: inherit;

font-style: inherit;
margin: 0px;

outline: 0px;

padding: 0px;

vertical-align: baseline;">


<a href="http://feedburner.google.com/fb/a/mailverify?uri=Feed-Username&amp;loc=en_US" rel="nofollow"

style="background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEggq0r5hbDL4zyb_CyOr7TEgFHnDRlRXSQaTys0NA92wj2_vcwhL9jGtaxeuNr9_w9q8xex9Hbk6rLFGnhD0C9fGRIV836tUWe8y5flI8M-7hvAs1FTdkTRZJqXETI6QQDFrGXl8HpqbYG4/s1600/Social-Buttons.png);

background-position: -298px -83px;

background-repeat: no-repeat no-repeat;

border: 0px;

color: #333333;
cursor: pointer;

display: block;

font-family: Helvetica, Arial; font-size: 22px;

font-weight: bold;
height: 20px;

margin: 0px;

outline: 0px;
padding: 0px;

text-decoration: none;

text-indent: -99999px;

text-shadow: rgb(221, 221, 221) 0px 1px 1px;
vertical-align: baseline;

width: 42px;" target="_blank">Email</a></li></ul></div>



<div class="MCTsocialbox" id="stwitter" style="float: left;
padding: 0px 10px;

width: 95px;">


<h2 style="background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEggq0r5hbDL4zyb_CyOr7TEgFHnDRlRXSQaTys0NA92wj2_vcwhL9jGtaxeuNr9_w9q8xex9Hbk6rLFGnhD0C9fGRIV836tUWe8y5flI8M-7hvAs1FTdkTRZJqXETI6QQDFrGXl8HpqbYG4/s1600/Social-Buttons.png);
background-position: 0px -123px;

background-repeat: no-repeat no-repeat;

border: 0px; font-size: 11px;

font-style: inherit;
font-weight: inherit;
height: 17px;

margin: 0px 0px 5px;

outline: 0px;

padding: 0px 0px 0px 15px;
vertical-align: baseline;
visibility: visible;">Followers</h2>


<a href="http://twitter.com/Twitter-Username" rel="nofollow"

style="border: 0px;

color: #333333;
font-family: Helvetica, Arial;

font-size: 22px;

font-weight: bold;
margin: 0px;

outline: 0px;

padding: 0px;

text-decoration: none;
text-shadow: rgb(221, 221, 221) 0px 1px 1px;

vertical-align: baseline;" target="_blank">5,400</a><br />


<div class="sbtn" style="margin-top: 3px;">
<iframe allowtransparency="true" class="twitter-follow-button" frameborder="0" scrolling="no" src="http://platform.twitter.com/widgets/follow_button.1340179658.html#_=1344197884900&amp;id=twitter-widget-20&amp;lang=en&amp;screen_name=Twitter-Username&amp;show_count=false&amp;show_screen_name=false&amp;size=m"

style="border-width: 0px;

font-family: inherit;

font-style: inherit;

height: 20px;

margin: 0px;

outline: 0px;

padding: 0px;

vertical-align: baseline;
width: 60px;" title="Twitter Follow Button"></iframe></div></div>


<div class="MCTsocialbox" id="sfb" style="float: left;

width: 90px;">


<h2 style="background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEggq0r5hbDL4zyb_CyOr7TEgFHnDRlRXSQaTys0NA92wj2_vcwhL9jGtaxeuNr9_w9q8xex9Hbk6rLFGnhD0C9fGRIV836tUWe8y5flI8M-7hvAs1FTdkTRZJqXETI6QQDFrGXl8HpqbYG4/s1600/Social-Buttons.png);

background-position: 0px -138px;

background-repeat:

no-repeat no-repeat;
border: 0px;

font-size: 11px;

font-style: inherit;
font-weight: inherit;
height: 17px;

margin: 0px 0px 5px;

outline: 0px;

padding: 0px 0px 0px 16px;

vertical-align: baseline;
visibility: visible;">Fans</h2>


<a href="http://www.facebook.com/MyCyberTricks" rel="nofollow"

style="border: 0px;
color: #333333;
font-family: Helvetica, Arial;

font-size: 22px;

font-weight: bold;
margin: 0px;

outline: 0px;

padding: 0px;

text-decoration: none;

text-shadow: rgb(221, 221, 221) 0px 1px 1px;

vertical-align: baseline;" target="_blank">1,800</a><br />


<div class="sbtn" style="margin-top: 3px;">
<iframe allowtransparency="true" frameborder="0" scrolling="no" src="http://www.facebook.com/plugins/like.php?href=http%3A%2F%2Fwww.facebook.com%2FMyCyberTricks&amp;layout=button_count&amp;show_faces=false&amp;width=90&amp;action=like&amp;colorscheme=light&amp;height=21"
style="border-style: none;
font-family: inherit;

font-style: inherit;
height: 21px;
margin: 0px 0px 10px;

outline: 0px;
overflow: hidden;

padding: 0px; vertical-align: baseline;
width: 90px;"></iframe></div></div></div></div>

Customization:

Search and replace Feed-Username with your FeedBurner Username
Search and replace Twitter-Username with your Twitter handler.
Also replace MyCyberTricks with your Facebook Page Username.
To Increase or reduce the width search and replace 300px with your desire needs.
Replace 9,000+ with your feed subscribers Count.
Replace 5,400 with your twitter followers.
Replace 1,800 with your Facebook fans.

Search for IMAGE-Here and replace it with any one of the following images which you like the most. (Important: if you don't replace it your background will be white).

HP Luster Theme:

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEikFcUnR2oFgP22XTT7J0H1BpjPEnOFBwhlgv-FreQYyPN_5i_gloJMQoTl6TKQXRgmirX0_ZmTE27__lJ4nz-QQs3uKQhzx6TcAWFlHZo-r901um_Adh_uXZwrTWMT-NqcXf33iNptKyM/s1600/HP-Laptop-Luster.png




Whitish Manza Theme:

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhV9EZZynlnYbal4xyrSeaawi0Zb2BhftU-NHr276iRR8BTRl4c8UskyCtZwvIerTHpPqN9vRAfsKfol_T9swD4uZ9Qr2hZJqZD6Y0_0-avK2XTNI0Gx5mAOMDLzStmecsoQ8PUc-sY8WI/s1600/White-Manza.png




OLD Paper Theme:


https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj4wgxOc0DANHexx0uBMRa6i3FWuk20NbbLt_Jx5PZijLes4E90SHrvpwrU-WmUSTvZOqGaPQ40c_mDFkssbjo48odlII2pWWEOA0uS0uA-6xUrLQnYLFe3tlAnbh59heo6w7KcQkPDYEw/s1600/OLD-PAPER.png



All Done: Now after customizing your Social Box, just save your Widget by pressing Save button present on the bottom of right corner. So here you have it, everything is done and your Social Box ready to roll.

Credits:

Hope you guys have enjoyed the miraculous Social Subscribe Box, if you want to add more backgrounds to our Inventory please don’t hesitate to leave your comment. We should always give credits to the original copyright owner, i.e. MyCyberTricks.com and MBL to keep the environment spotless. If you have any problems feel free to ask till then peace, blessings and happy Socializing.
Advertise Here
Thanks For Making This Possible! Kindly Bookmark and Share it.

Technorati Digg This Stumble Facebook Twitter
Advertise Here

0 comments:

Confused?Feel Free to Ask!

Please Do not Spam!
Spam=Trash

Alexa

 

Author

Hamy is A Passionate blogger from Pakistan who loves.... Read More..

Best Topics

SEO Affiliate Marketing Social Media

Make Money Online Web hosting

Jailbreaks iPhone

Plugins and Widgets Tips n Tricks

Recent Comments

Recent Posts

Powered by:

My Cyber Tricks © 2012. All Rights Reserved | Contact |