How to Add Google Plus Pop Up Follow Box to Blogger Blog

With a lot of hard work bloggers and webmaster are trying to increase their social profiles fan following. Google+ one of the best way to increase blog's popularity. A small Google+ gadget which can really help you to increase G+ followers. Recently, one of our readers asked us, how he can add Google Plus Pop Up Follow Box to his Blogger blog. Today in this short article we will show you an amazing Google+ JQuery pop up light box widget to blogger blog.

• Read: How To Add Google+ Followers Gadget To Blogger Blog

How to Add Google+ Pop Up Follow Box

1. Go to Blogger Dashboard ›› Design ›› Page Elements.
2. Click Add A Gadget ›› In New Window, Select HTML/Javascript .
3. Copy The Code Given Below and Paste It Inside The Box.
4. Save The Gadget and Its Done

<style type="text/css">

/***********************************************

    www.BlogsDaddy.com    

***********************************************/

* html #exestylepopupdiv {position:absolute;}

#exestylepopupdiv {display:block; top:0px; left:0px; width:100%; height:100%; position:fixed; background-image:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjlYvXzR5wnVj925YZ9EqEcFFEnudm-pjYOetlSTwhj9eWjFQM5slZQgi1p2CN97mPTGZY2p9StiH_oE973UDeLwKefKxQ3odfNrK0VCt1zd207VQ_nujZ6vc71CttLfcXAibv37dff-YT1/s1600/exeideasopacity0.5.png');margin:0; overflow-y:auto;}

#exestylepopup {z-index:9999;background-color: #fff; overflow:none;}

.exestylepopup {width:400px; height:440px; position:fixed; top:45%; left:50%; margin-top:-220px; margin-left:-200px; border: 10px solid #999; padding: 20px;}

.exe-title {background:#000;color: #fff;font-size: 20px !important;font-weight:bold;margin:5px 0;border:20px solid #ddd;padding:10px;line-height:25px; font-family:arial !important;}

</style>

<!--[if lte IE 6]>

<style type="text/css">

/*<![CDATA[*/

html {overflow-x:auto; overflow-y:hidden;}

/*]]>*/

</style>

<![endif]-->

<div id="exestylepopupdiv">

<div id="exestylepopup" class="exestylepopup">

<center><h3 class="exe-title">Receive All Updates Via Google+. Just Click The Follow Button Below</h3></center>

<center>

<div class="g-plus" data-action="followers" data-height="300" data-href="https://plus.google.com/117100549673033253859" data-source="blogger:blog:followers" data-width="310">

</div>

<script type="text/javascript">

(function() {

window.___gcfg = {'lang': 'en'};

var po = document.createElement('script');

po.type = 'text/javascript';

po.async = true;

po.src = 'https://apis.google.com/js/plusone.js';

var s = document.getElementsByTagName('script')[0];

s.parentNode.insertBefore(po, s);

})();

</script>

</center>

<br />

<center style=" float:right; margin-right:35px; font-size:9px;" >Powered By <a style=" font-size:9px; color:#3B78CD; text-decoration:none;" href="http://www.blogsdaddy.com">Blogs Daddy</a></center>

<center style=" float:left; margin-left:35px; font-size:9px;cursor:pointer;" ><a style=" font-size:9px; color:#3B78CD; text-decoration:none;" onmouseup="document.getElementById('exestylepopupdiv').style.display='none'">Skip To Continue</a></center>

</div>

</div>

<!-- www.BlogsDaddy.com -->

• Read - JQuery Pop-Up Facebook Like Box

Customization:

1. Replace the red color code with your own Google+ profile URL.
2. Replace the pink color title with your own if you want.

Congratulations! its all done. Visit your blog and enjoy. We hope you like this simple pop up Google plus gadget. 

• Read Also - Blue Square Social Icons Widget For Blogger Blog

Very soon we will come other awesome tutorials and article. Please follow us on G+ for getting our latest updates. Happy Blogging & Stay Blessed :)

Author - Gagan Masoun is the owner of Blogs Daddy Blog. Gagan lives in India, has been blogging since 2010 and writing Blogs Daddy Blog since 2011.You can follow him on twitter @BlogsDaddy. You can also follow him on Google+.