Social Icons

Sunday, 19 August 2012

How to add a stylish fb popup like box to blogger


Hello Friend Today I am Going To tell You how to add a fb popup like box to blogger 
  1. First open www.blogger.com 
  2. Then sign in your blogger account
  3. Then go to your blog dashboard 
  4. the click layout tab
  5. then click Html/javascript
  6. then copy and paste the code below

<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js'></script>
<script src="http://exeideasinternational.googlecode.com/files/jquery.colorbox-min.js"></script>
<script type="text/javascript">
jQuery(document).ready(function(){
if (document.cookie.indexOf('visited=false') == -1)
{
var fifteenDays = 1000*60*60*24*1;
var expires = new Date((new Date()).valueOf() + fifteenDays);
document.cookie = "visited=true;expires=" + expires.toUTCString();
$.colorbox({width:"400px", inline:true, href:"#exestylepopups"});
}
});
</script>
<style type="text/css">
/*
ColorBox v1.3.16
(Copyright (c) 2011 Jack Moore - jack@colorpowered.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/AVvXsEiaWg37GHk7XeCJFE1eirQyHubxp8x6H9hYhG_AEFORfr4qzEYah-iSo9P9NASa4VtJBTCnMAN9jNE-VRgrK0IpO5NATvk2rCuYqGLH5keaCoiDmRyCRKTRsWpstfaNCv-3hjTvoxld7EU/s1600/controls.png) no-repeat 0 0;}
#cboxTopCenter{height:14px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhRzi82cBUaXwf8weRyOxJK-1k2rc6qxWt5ztDZD-HfFBwKGIygj9kvupkXsVU1LXmncy8LJ3cvNdJ3VH2PVgkyUCqjHBDA_JVG5r0Mb4pCBlGmBcMFbMc1-aER-rbP0u2Gx29PXHSu_UQ/s400/border.png) repeat-x top left;}
#cboxTopRight{width:14px; height:14px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiaWg37GHk7XeCJFE1eirQyHubxp8x6H9hYhG_AEFORfr4qzEYah-iSo9P9NASa4VtJBTCnMAN9jNE-VRgrK0IpO5NATvk2rCuYqGLH5keaCoiDmRyCRKTRsWpstfaNCv-3hjTvoxld7EU/s1600/controls.png) no-repeat -36px 0;}
#cboxBottomLeft{width:14px; height:43px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiaWg37GHk7XeCJFE1eirQyHubxp8x6H9hYhG_AEFORfr4qzEYah-iSo9P9NASa4VtJBTCnMAN9jNE-VRgrK0IpO5NATvk2rCuYqGLH5keaCoiDmRyCRKTRsWpstfaNCv-3hjTvoxld7EU/s1600/controls.png) no-repeat 0 -32px;}
#cboxBottomCenter{height:43px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhRzi82cBUaXwf8weRyOxJK-1k2rc6qxWt5ztDZD-HfFBwKGIygj9kvupkXsVU1LXmncy8LJ3cvNdJ3VH2PVgkyUCqjHBDA_JVG5r0Mb4pCBlGmBcMFbMc1-aER-rbP0u2Gx29PXHSu_UQ/s400/border.png) repeat-x bottom left;}
#cboxBottomRight{width:14px; height:43px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiaWg37GHk7XeCJFE1eirQyHubxp8x6H9hYhG_AEFORfr4qzEYah-iSo9P9NASa4VtJBTCnMAN9jNE-VRgrK0IpO5NATvk2rCuYqGLH5keaCoiDmRyCRKTRsWpstfaNCv-3hjTvoxld7EU/s1600/controls.png) no-repeat -36px -32px;}
#cboxMiddleLeft{width:14px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiaWg37GHk7XeCJFE1eirQyHubxp8x6H9hYhG_AEFORfr4qzEYah-iSo9P9NASa4VtJBTCnMAN9jNE-VRgrK0IpO5NATvk2rCuYqGLH5keaCoiDmRyCRKTRsWpstfaNCv-3hjTvoxld7EU/s1600/controls.png) repeat-y -175px 0;}
#cboxMiddleRight{width:14px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiaWg37GHk7XeCJFE1eirQyHubxp8x6H9hYhG_AEFORfr4qzEYah-iSo9P9NASa4VtJBTCnMAN9jNE-VRgrK0IpO5NATvk2rCuYqGLH5keaCoiDmRyCRKTRsWpstfaNCv-3hjTvoxld7EU/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/AVvXsEhXKQIo23FxVUOoj1HMopArlhiG24FUBqj-_gsLuYYiVYxZ6jrN_-0IWQ0Kke59S46c4XgYvq1tme47IqAONP8BHbvtZhHl9A1WggIiMO9GOhRJUU7tsxTFSu7-xRwDuOMWN2sf8AT7CGg/s400/loadingbackground.png) no-repeat center center;}
#cboxLoadingGraphic{https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhtgXI3Vm8PQeuEjAqmkuUA6TnTgqtKlHDXwUGT9o7QTuxwvBklke3yJzzpsQTPA8e7GRZ07g8-dujHnQErU20Re2SgdAchtemLvT09FUU5hoMFlCRl67gdesiuXSE-grq8bePdSA_RI0o/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/AVvXsEiaWg37GHk7XeCJFE1eirQyHubxp8x6H9hYhG_AEFORfr4qzEYah-iSo9P9NASa4VtJBTCnMAN9jNE-VRgrK0IpO5NATvk2rCuYqGLH5keaCoiDmRyCRKTRsWpstfaNCv-3hjTvoxld7EU/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;}
/*-----------------------------------------------------------------------------------*/
/* Facebook Likebox popup For Blogger
/*-----------------------------------------------------------------------------------*/
#mdfb {font: 12px/1.2 Arial,Helvetica,san-serif; color:#666;}
#mdfb a, #mdfb a:hover, #mdfb a:visited {text-decoration:none;}
.mdbox-title {background:#000;color: #fff;font-size: 20px !important;font-weight: bold;margin: 10px 0;border:20px 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;}
</style>
<div style='display:none'>
<div id='exestylepopups' style='padding:10px; background:#fff;'>
<center><h3 class="mdbox-title">Receive all updates via Facebook. Just Click the Like Button Below...</h3></center>
<center>
<iframe src="//www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com/pages/SyedTaufiqAli/407097922671671&amp;width=300&amp;colorscheme=light&amp;show_faces=true&amp;border_color=%23ffffff&amp;stream=false&amp;header=false&amp;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.syedtaufiqali.blogspot.com/2012/08/how-to-add-stylish-fb-popup-like-box-to.html ">Get This</a></p>
</div>
</div>

     Note 

Change my facebook page url to yours facebook page url which i colour in red

Every Thing Done


8 comments:

  1. I visited various web sites except the audio quality
    for audio songs current at this web page is in fact fabulous.
    free dating
    Also visit my weblog ... dating website

    ReplyDelete
  2. I've been exploring for a little bit for any high-quality articles or blog posts on this kind of house . Exploring in Yahoo I eventually stumbled upon this site. Studying this info So i am satisfied to express that I'νe
    an іncredibly excellent unсannу feeling
    I founԁ оut juѕt what I neеded.
    I ѕuch a lot indisputably ωill maκе suгe to ԁo not forget
    this site and provides it а look regularly.

    Аlso viѕit my ρagе :: Arthur's Shape Memory Guessing Game - toytreats.com -

    ReplyDelete
  3. They utilize tagua to make bracelets, necklaces, and earrings.
    When deciding on the bride's tiara, this is an important aspect. Fireproof safes should also carry a good burglary rating, because these are a highly desirable item to steal.

    Also visit my web blog - jewelry - -

    ReplyDelete
  4. Magnificent site. A lot of helpful info here. I'm sending it to some buddies ans additionally sharing in delicious. And of course, thank you for your effort!

    Feel free to visit my webpage ... Iyer Matrimony ()

    ReplyDelete
  5. I'm really imρressеd with your wгіting skills and аlso ωith the layout оn уour weblοg.
    Is this a paid theme or diԁ уou cuѕtοmizе it yourself?
    Anуway κeep up the excellent quаlity ωгitіng,
    it іѕ гare tο sее a nice blog like this one toԁay.


    Look аt mу web pagе; mеgapolis cheats ()

    ReplyDelete
  6. Ηοwdy! I realize this is sort of оff-topic but I
    nеedеԁ tο аsk. Dοeѕ οpеrating a well-eѕtаblished website ѕuch as уours take a lοt of work?
    Ӏ аm complеtelу nеw to opeгating а blog but I do ωгite
    in my јournal оn a daily basis. I'd like to start а
    blog sο I cаn еаsily share my persоnаl expеrience anԁ viеws online.
    Ρlеase let mе knοw if yοu haνe any kіnd οf
    suggestіons ог tiрѕ
    for nеω aspiгіng blοggers. Τhаnκyоu!


    My website megapolis cheats 2013

    ReplyDelete
  7. With havin so much сontеnt do you evеr
    run intο аny prоblemѕ of рlаgorism
    or сopуright іnfrіngement? My websitе haѕ
    a lot of unique content I've either ωrittеn mуsеlf
    οr outsοurcеd but it seеms a lot οf it iѕ ρopping іt up all over the web wіthout my agгeеment.
    Do you knοω any teсhniquеs to helρ
    reduсe content from bеіng stolеn?
    ӏ'd genuinеly aρpreciate it.

    Fеel free to visіt my page; megapоliѕ chеаt codеs (fma.cau.ac.kr)

    ReplyDelete