Like To Enter Advanced Social Traffic POP V1 has been Released Don't forget to check it.
If your blog has tons of dailyvisitors, but still you are unable to convert your traffic into money then this is a life time opportunity to increase your Facebook, Twitter, Google + and Feeds subscribers in large numbers. Today, while I was browsing the world’s largest Plugins and Widgets resource i.e. Codecanyon I came across lots of Social Traffic Pop widgets for WordPress, but I was amused that there was no resource for users using Blogger platform. So I thought to create a Social Traffic Pop widget, which is not totally identical to WordPress Social Traffic Pop Plugin.
In This Social Traffic Pop
Widget, we can easily insert Facebook Like box, Twitter Follow, Google Plus and
we can even include Feedburner subscription widget, so instead of waiting let
us start working with Social Media Traffic Pop Widget for Blogger. Before we get started, I know you would be astonished to view the live demo so first give it a try
Features of Social Media Traffic Pop Widget:
- This widget is built with Ultra-fast technology.
- This widget gives your freedom to include any widget that you want to see in the Social Pop.
- Has stunning LightBox style.
- This widget is integrated with Facebook Like Box, Twitter and Feedburner widgets.
- Social Media Traffic Pop is tested on many browsers i.e. Chrome, FireFox, internet explorer, and etc.
How To Add Social Media Traffic Pop Widget To Blogger?
The steps are extremely straightforward
and would hardly take 2 minutes to complete the integration, so to get started
just do as mentioned bellow.
- Go to Blogger.com
- Now Select Layout from the tool menu.
- Then press Add a Gadget
- Now look for “ADD HTML/JAVASCRIPT” in the list.
- And now paste the following code inside it.
<style>
/* Social Traffic Pop Widget For Blogger BY MBL MyBloggerLab.com
*/
#colorbox, #cboxOverlay, #cboxWrapper{position:absolute; top:0; left:0; z-index:9999; overflow:hidden;}
#cboxOverlay{position:fixed; width:100%; height:100%;}
#cboxMiddleLeft, #cboxBottomLeft{clear:left;}
#cboxContent{position:relative;}
#cboxLoadedContent{overflow:auto;}
#cboxTitle{margin:0;}
#cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%;}
#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;}
.cboxPhoto{float:left; margin:auto; border:0; display:block;}
.cboxIframe{width:100%; height:100%; display:block; border:0;}
/*
User Style:
Change the following styles to modify the appearance of ColorBox. They are
ordered & tabbed in a way that represents the nesting of the generated HTML.
*/
#cboxOverlay{background:#000;opacity:0.5 !important;}
#colorbox{
box-shadow:0 0 15px rgba(0,0,0,0.4);
-moz-box-shadow:0 0 15px rgba(0,0,0,0.4);
-webkit-box-shadow:0 0 15px rgba(0,0,0,0.4);
}
#cboxTopLeft{width:14px; height:14px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjqMM3xSM6kSmD8ZPARRGB_i75szlveApHv_pVRSzJKm8KA_Nuog9zxfcqr09JLlo2jGBAzMe-WiTyMCf3WicvkMwQE-WTnERVo6RQBRi4gwQdm2GK6QsMEoZ7ue2Pfl0PNw9P4He5jORc/s1600/controls.png) no-repeat 0 0;}
#cboxTopCenter{height:14px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgyhrewm4c4aVNdXkkKJAY-kOJQlB_F0C1sxkAbDfF8d_maMhsPEhI0g5Zt3iRqOoOMwe1IrZZiq1ZJhr26BbE5TTJp5m6c20tRe4jI6dcivwIVZ926HPWYAmnAE6_CK9C39tzcZOV7m8w/s400/border.png) repeat-x top left;}
#cboxTopRight{width:14px; height:14px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjqMM3xSM6kSmD8ZPARRGB_i75szlveApHv_pVRSzJKm8KA_Nuog9zxfcqr09JLlo2jGBAzMe-WiTyMCf3WicvkMwQE-WTnERVo6RQBRi4gwQdm2GK6QsMEoZ7ue2Pfl0PNw9P4He5jORc/s1600/controls.png) no-repeat -36px 0;}
#cboxBottomLeft{width:14px; height:43px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjqMM3xSM6kSmD8ZPARRGB_i75szlveApHv_pVRSzJKm8KA_Nuog9zxfcqr09JLlo2jGBAzMe-WiTyMCf3WicvkMwQE-WTnERVo6RQBRi4gwQdm2GK6QsMEoZ7ue2Pfl0PNw9P4He5jORc/s1600/controls.png) no-repeat 0 -32px;}
#cboxBottomCenter{height:43px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgyhrewm4c4aVNdXkkKJAY-kOJQlB_F0C1sxkAbDfF8d_maMhsPEhI0g5Zt3iRqOoOMwe1IrZZiq1ZJhr26BbE5TTJp5m6c20tRe4jI6dcivwIVZ926HPWYAmnAE6_CK9C39tzcZOV7m8w/s400/border.png) repeat-x bottom left;}
#cboxBottomRight{width:14px; height:43px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjqMM3xSM6kSmD8ZPARRGB_i75szlveApHv_pVRSzJKm8KA_Nuog9zxfcqr09JLlo2jGBAzMe-WiTyMCf3WicvkMwQE-WTnERVo6RQBRi4gwQdm2GK6QsMEoZ7ue2Pfl0PNw9P4He5jORc/s1600/controls.png) no-repeat -36px -32px;}
#cboxMiddleLeft{width:14px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjqMM3xSM6kSmD8ZPARRGB_i75szlveApHv_pVRSzJKm8KA_Nuog9zxfcqr09JLlo2jGBAzMe-WiTyMCf3WicvkMwQE-WTnERVo6RQBRi4gwQdm2GK6QsMEoZ7ue2Pfl0PNw9P4He5jORc/s1600/controls.png) repeat-y -175px 0;}
#cboxMiddleRight{width:14px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjqMM3xSM6kSmD8ZPARRGB_i75szlveApHv_pVRSzJKm8KA_Nuog9zxfcqr09JLlo2jGBAzMe-WiTyMCf3WicvkMwQE-WTnERVo6RQBRi4gwQdm2GK6QsMEoZ7ue2Pfl0PNw9P4He5jORc/s1600/controls.png) repeat-y -211px 0;}
#cboxContent{background:#fff; overflow:visible;}
#cboxLoadedContent{margin-bottom:5px;}
#cboxLoadingOverlay{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh5ciUEwVttNj7oRwQkN1Lb2Rw8uSHFNQQ-yt5XZz5t5W34zUV0QIX_6XTo-SWuf_bHBcCKE-_-Hr4KQz1lH7t1zmPpyApV2-u-y02WqTwRwJrI-7ZRcZeWucuw2IT-ERcuiPO1XfDkdAY/s400/loadingbackground.png) no-repeat center center;}
#cboxLoadingGraphic{https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgEeuzOZp74e1Yatl8ujpjNiXQUJHrOrYtXjT4G3T8jKwQ3ZhGCW67rNsn_GTQmaDdNB9QgK2x-IZSPFH-7BqQaKG0a0zAoxIG2TfD1yiRTYlXrJg1aUSLQgwwDdNq1C_OQzTU1JFRw0GQ/s400/loading.gif) no-repeat center center;}
#cboxTitle{position:absolute; bottom:-25px; left:0; text-align:center; width:100%; font-weight:bold; color:#7C7C7C;}
#cboxCurrent{position:absolute; bottom:-25px; left:58px; font-weight:bold; color:#7C7C7C;}
#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{position:absolute; bottom:-29px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjqMM3xSM6kSmD8ZPARRGB_i75szlveApHv_pVRSzJKm8KA_Nuog9zxfcqr09JLlo2jGBAzMe-WiTyMCf3WicvkMwQE-WTnERVo6RQBRi4gwQdm2GK6QsMEoZ7ue2Pfl0PNw9P4He5jORc/s1600/controls.png) no-repeat 0px 0px; width:23px; height:23px; text-indent:-9999px;}
#cboxPrevious{left:0px; background-position: -51px -25px;}
#cboxPrevious.hover{background-position:-51px 0px;}
#cboxNext{left:27px; background-position:-75px -25px;}
#cboxNext.hover{background-position:-75px 0px;}
#cboxClose{right:0; background-position:-100px -25px;}
#cboxClose.hover{background-position:-100px 0px;}
.cboxSlideshow_on #cboxSlideshow{background-position:-125px 0px; right:27px;}
.cboxSlideshow_on #cboxSlideshow.hover{background-position:-150px 0px;}
.cboxSlideshow_off #cboxSlideshow{background-position:-150px -25px; right:27px;}
.cboxSlideshow_off #cboxSlideshow.hover{background-position:-125px 0px;}#cboxTopCenter{height:14px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgyhrewm4c4aVNdXkkKJAY-kOJQlB_F0C1sxkAbDfF8d_maMhsPEhI0g5Zt3iRqOoOMwe1IrZZiq1ZJhr26BbE5TTJp5m6c20tRe4jI6dcivwIVZ926HPWYAmnAE6_CK9C39tzcZOV7m8w/s400/border.png) repeat-x top left;} #cboxTopRight{width:14px; height:14px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjqMM3xSM6kSmD8ZPARRGB_i75szlveApHv_pVRSzJKm8KA_Nuog9zxfcqr09JLlo2jGBAzMe-WiTyMCf3WicvkMwQE-WTnERVo6RQBRi4gwQdm2GK6QsMEoZ7ue2Pfl0PNw9P4He5jORc/s1600/controls.png) no-repeat -36px 0;} #cboxBottomLeft{width:14px; height:43px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjqMM3xSM6kSmD8ZPARRGB_i75szlveApHv_pVRSzJKm8KA_Nuog9zxfcqr09JLlo2jGBAzMe-WiTyMCf3WicvkMwQE-WTnERVo6RQBRi4gwQdm2GK6QsMEoZ7ue2Pfl0PNw9P4He5jORc/s1600/controls.png) no-repeat 0 -32px;} #cboxBottomCenter{height:43px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgyhrewm4c4aVNdXkkKJAY-kOJQlB_F0C1sxkAbDfF8d_maMhsPEhI0g5Zt3iRqOoOMwe1IrZZiq1ZJhr26BbE5TTJp5m6c20tRe4jI6dcivwIVZ926HPWYAmnAE6_CK9C39tzcZOV7m8w/s400/border.png) repeat-x bottom left;} #cboxBottomRight{width:14px; height:43px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjqMM3xSM6kSmD8ZPARRGB_i75szlveApHv_pVRSzJKm8KA_Nuog9zxfcqr09JLlo2jGBAzMe-WiTyMCf3WicvkMwQE-WTnERVo6RQBRi4gwQdm2GK6QsMEoZ7ue2Pfl0PNw9P4He5jORc/s1600/controls.png) no-repeat -36px -32px;} #cboxMiddleLeft{width:14px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjqMM3xSM6kSmD8ZPARRGB_i75szlveApHv_pVRSzJKm8KA_Nuog9zxfcqr09JLlo2jGBAzMe-WiTyMCf3WicvkMwQE-WTnERVo6RQBRi4gwQdm2GK6QsMEoZ7ue2Pfl0PNw9P4He5jORc/s1600/controls.png) repeat-y -175px 0;} #cboxMiddleRight{width:14px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjqMM3xSM6kSmD8ZPARRGB_i75szlveApHv_pVRSzJKm8KA_Nuog9zxfcqr09JLlo2jGBAzMe-WiTyMCf3WicvkMwQE-WTnERVo6RQBRi4gwQdm2GK6QsMEoZ7ue2Pfl0PNw9P4He5jORc/s1600/controls.png) repeat-y -211px 0;} #cboxContent{background:#fff; overflow:visible;} #cboxLoadedContent{margin-bottom:5px;} #cboxLoadingOverlay{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh5ciUEwVttNj7oRwQkN1Lb2Rw8uSHFNQQ-yt5XZz5t5W34zUV0QIX_6XTo-SWuf_bHBcCKE-_-Hr4KQz1lH7t1zmPpyApV2-u-y02WqTwRwJrI-7ZRcZeWucuw2IT-ERcuiPO1XfDkdAY/s400/loadingbackground.png) no-repeat center center;} #cboxLoadingGraphic{https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgEeuzOZp74e1Yatl8ujpjNiXQUJHrOrYtXjT4G3T8jKwQ3ZhGCW67rNsn_GTQmaDdNB9QgK2x-IZSPFH-7BqQaKG0a0zAoxIG2TfD1yiRTYlXrJg1aUSLQgwwDdNq1C_OQzTU1JFRw0GQ/s400/loading.gif) no-repeat center center;} #cboxTitle{position:absolute; bottom:-25px; left:0; text-align:center; width:100%; font-weight:bold; color:#7C7C7C;} #cboxCurrent{position:absolute; bottom:-25px; left:58px; font-weight:bold; color:#7C7C7C;} #cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{position:absolute; bottom:-29px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjqMM3xSM6kSmD8ZPARRGB_i75szlveApHv_pVRSzJKm8KA_Nuog9zxfcqr09JLlo2jGBAzMe-WiTyMCf3WicvkMwQE-WTnERVo6RQBRi4gwQdm2GK6QsMEoZ7ue2Pfl0PNw9P4He5jORc/s1600/controls.png) no-repeat 0px 0px; width:23px; height:23px; text-indent:-9999px;} #cboxPrevious{left:0px; background-position: -51px -25px;} #cboxPrevious.hover{background-position:-51px 0px;} #cboxNext{left:27px; background-position:-75px -25px;} #cboxNext.hover{background-position:-75px 0px;} #cboxClose{right:0; background-position:-100px -25px;} #cboxClose.hover{background-position:-100px 0px;} .cboxSlideshow_on #cboxSlideshow{background-position:-125px 0px; right:27px;} .cboxSlideshow_on #cboxSlideshow.hover{background-position:-150px 0px;} .cboxSlideshow_off #cboxSlideshow{background-position:-150px -25px; right:27px;} .cboxSlideshow_off #cboxSlideshow.hover{background-position:-125px 0px;} /*-----------------------------------------------------------------------------------*/
/* Social Traffic Pop Widget For Blogger BY MBL
/*-----------------------------------------------------------------------------------*/
#subscribe {
font: 12px/1.2 Arial,Helvetica,san-serif; color:#666;
}
#subscribe a,
#subscribe a:hover,
#subscribe a:visited {
text-decoration:none;
}
.box-title {
color: #F66303;
font-size: 18px !important;
font-weight: bold;
margin: 10px 0;
border:1px solid #ddd;
-moz-border-radius:6px;
-webkit-border-radius:6px;
border-radius:6px;
box-shadow: 5px 5px 5px #CCCCCC;
padding:10px;
line-height:25px; font-family:arial !important;
}
.box-tagline {
color: #999;
margin: 0;
text-align: center;
}
#subs-container {
padding: 35px 0 30px 0;
position: relative;
}
a:link, a:visited {
border:none;
}
.demo {
display:none;
}
/* ---------MBL Subscribe NOW Form---------- */
.box-title1 {
border:1px solid #ddd;
-moz-border-radius:6px;
-webkit-border-radius:6px;
border-radius:6px;
box-shadow: 5px 5px 5px #CCCCCC;
padding:10px;
margin: 10px 0;
}
.enteryouremail{
background: #fff !important;
border: 1px solid #d2d2d2;
padding: 0px 8px 0px 8px;
color: #a19999; font-size: 12px;
height: 25px; width: 165px;
border-radius: 5px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
margin:0px;
}
.submitbutton{
background:#F66303;
border: 1px solid #F66303;
text-shadow: 1px 1px 1px #333;
box-shadow: 3px 3px 3px #666;
font:bold 12px Arial, sans-serif;
color: #fff;
height: 25px;
padding: 0 12px 0 12px;
margin: 0 0 0 5px;
border-radius: 5px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
cursor:pointer;}
</style>
<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js'></script>
<script src="http://mybloggertricks.googlecode.com/files/jquery.colorbox-min.js"></script>
<script type="text/javascript">
jQuery(document).ready(function(){
if (document.cookie.indexOf('visited=true') == -1) {
var fifteenDays = 1000*60*60*24*30;
var expires = new Date((new Date()).valueOf() + fifteenDays);
document.cookie = "visited=true;expires=" + expires.toUTCString();
$.colorbox({width:"400px", inline:true, href:"#subscribe"});
}
});
</script>
<div style='display:none'>
<div id='subscribe' style='padding:10px; background:#fff;'>
<h3 class="box-title">Receive all updates via Facebook. Just Click the Like Button Below<center><p style="line-height:3px;" >?</p></center></h3>
<center>
<iframe src="//www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2FMyBloggerLab&width=300&colorscheme=light&show_faces=true&border_color=%23ffffff&stream=false&header=false&height=258" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:300px; height:258px;" allowtransparency="true"></iframe>
</center>
<div class="box-title1 ">
<center>
<h3 style="color:#F66303;">You can also receive Free Email Updates:</h3>
<form action="http://feedburner.google.com/fb/a/mailverify" method="post" target="popupwindow" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=mybloggerlab', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true"><input gtbfieldid="10" class="enteryouremail" name="email" value="Enter your email here..." onblur="if (this.value == '') {this.value = 'Enter your email here...';}" onfocus="if (this.value == 'Enter your email here...') {this.value = '';}" type="text" /><input value="mybloggerlab" name="uri" type="hidden" /><input value="Submit" class="submitbutton" type="submit" /></form>
</center>
</div>
<!--Please Do not Remove the Credits -->
<p style=" float:right; margin-right:35px; font-size:9px;" >Powered By <a style=" font-size:9px; color:#3B78CD; text-decoration:none;" href="http://www.mybloggerlab.com">My Blogger Lab</a></p>
</div>
</div>
Customization:
- The above text in Blue color can be change to anything that you like, or you keep it same as default.
- Replace mybloggerlab with your RSS Feed Email username, if you have not burned you feed see this.
- Replace MyBloggerLab with your Facebook page username.
- *30 changing this value will refresh the cookies more quickly. By default you users will be able to see this pop out once in 30 days, but if you want to make it more frequent then reduce its value. Remember: This may annoy your readers so be careful before making any changes.
6. Now press the save button and now check your blog it will give you picture perfect results.
That’s it
guys, hope you have enjoyed the widget. If you have any suggestion or you want
to optimize this Social Media Pop with more stunning features, then don’t
forgot to leave your comment till then peace, blessings, and happy learning.
Credits:www.mybloggertricks.com
Credits:www.mybloggertricks.com
About the Editorial Team
The Editorial Team of MyBloggerLab consists of a group of Professional Blogger geeks Led by Syed Faizan Ali (Founder of MyBloggerLab).
13 comments
Thanks for this amazing code.
Regards,
Ahmed Safwan
ToStartBlogging.Com
Great idea! I was just thinking that it would be a great idea for something like this
Lisa
http://www.healthyfrugalliving.com
Bro how to find my post title code in html template please help bro..
I don't see any pop ups on the demo page
This Might be happening because the POP UP has sent Messages to your Browser Cookies As it Appears Once in 30 Days. Try to Clear your Cookies or Change Your Browser. Hope That Answer your Question. Peace and Blessings
Brother You cannot Find your Blog Post Titles in any of your Blogger Template because Template usually have the HTML and CSS Structure. If you want to allocate your Titles IDs then Go to Your Blog >> Press CTRL+U it will open a Page Source >> Now Search Your Title >> and now you allocate the same ID in your Templates. Hope that Answer your Question. Peace and blessings
HOPE IS NOT AGAINST GOOGLE ADSENCE TOS
Until or unless you don't use Adsense unit in the Pop out then you are at the Safe Side. Peace and Blessings
Great! Thanks for sharing this code to us. It is one way to add more likes people to appreciate one's work. :D
hi admin i do not understand this line " Replace mybloggerlab with your RSS Feed Email username, if you have not burned you feed see this. " please explain this.
Dude i Mean to Say That Replace "Mybloggerlab" with your RSS FEED i.e. (http://feedburner.google.com/fb/a/mailverify?uri=mybloggerlab)This will send automatic emails to those who have subscribed to your blog.
Hope that Helps. Peace
Thanks for this buddy
http://www.theabsolue.asia
Post a Comment
We’re eager to see your comment. However, Please Keep in mind that all comments are moderated manually by our human reviewers according to our comment policy, and all the links are nofollow. Using Keywords in the name field area is forbidden. Let’s enjoy a personal and evocative conversation.