Creating Pop Up Like Box in Blogspot
After posting about Facebook Pop Up like box for
wordpress some of my readers ask if this feature can also be applied on
blogspot so I decided to create another post on creating pop like box for
blogger blogs.
Here’s how to do it.
1. Login to Blogger account
2. Go to template > Edit HTML
3. Click Proceed
4. Copy the code below and paste it
before the </head> tag.
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js'></script> <script src="https://gj37765.googlecode.com/svn/trunk/html/[www.gj37765.blogspot.com]jquery.colorbox-min.js"></script> <link rel="stylesheet" href="https://gj37765.googlecode.com/svn/trunk/html/%5Bwww.gj37765.blogspot.com%5Dfbpopup.css" type="text/css" /> <script type="text/javascript"> jQuery(document).ready(function(){ if (document.cookie.indexOf('visited=flase') == -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:"#mdfb"}); } }); </script>
5. Save
6. Now, Go to Layout
7. Add a Gadget
8. Choose HTML/Javascipt
9. Paste the code below
<div style='display:none'> <div
id='mdfb' style='padding:10px; background:#fff;'> <h3
class="mdbox-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%2reginaldsonlinerealm&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><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.reginaldsonlinerealm.blogspot.com">Reginald's
Online Realm</a></p>
</div> </div>
1 10. Save and you’re
done.
*don’t forget to change reginaldsonlinerealm
by your facebook username
https://www.facebook.com/reginaldsonlinerealm
No comments
Comment