Make Money Easy

Beautiful Pop Up Script for Your Website Blog

July 15, 2017






  1. Login to your blogger account
  2. Go to Theme
  3. Click on Edit HTML
  4. Click anywhere inside the code area
  5. Press Ctrl+F
  6. Search following code
    7. </body>
  7. Paste following javascript code before </body> tags
    8. <script>
    $(document).ready(function($) {
        $('.cb_splash_ads .close').click(function(event) {
            event.preventDefault();
            $('.cb_splash_ads').slideUp('slow');
        });
    });

    $(window).load(function(){
        setTimeout(function(){
            $('.cb_splash_ads').slideUp('slow');
        },3000);
    });
</script>
  8. Again search following code
    9. <body>
  9. Now paste following code after <body> tags
    10. <!--Splash Popup Ads Start-->
<style>
/*********************************
** Name: Blogger Popup Splash Ads
** Created By: www.codiblog.com
*********************************/
.cb_splash_ads {
    background-color: rgba(0,0,0,0.8);
    height: 100%;
    left: 0;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 99999;
}
.cb_splash_ads .pop {
    background-color: #fff;
    margin: 10% auto 0;
    padding: 5px;
    position: relative;
    max-width: 300px;
}
.cb_splash_ads .pop img {
    width: 100%;
 vertical-align: middle;
}
.cb_splash_ads .close {
    opacity: 1;
    position: absolute;
    right: -9px;
    top: -9px;
}
.cb_splash_ads .close img {
    height: 32px;
    width: 32px;
}
@media only screen and (max-width:768px){
    .cb_splash_ads .pop {margin-top:25%;}
  }
@media only screen and (max-width:320px){
    .cb_splash_ads .pop {margin: 25% 3% 0;}
  }
</style>

<div class='cb_splash_ads'>
  <div class='pop'>
 <a class='close' href='#'><img alt='' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgK-cIsM0DilW_99Eo_09UDjWcF18-awRPSX9KZ1La4QsjRmDoIs0wK6hjzugR9T_wcY34Lizx34a_bVDQEHGqbTMs5eVfZG_Gb5OSz576rXgFwCEBhWMHbP2t0NQw6sAOeb5Gwi1P2BCY/s1600/close.gif'/></a>
 Here paste your 300x250 banner ad code
  </div>
</div>
<!--Splash Popup Ads End-->
    Replace Here paste your 300x250 banner ad code with your adsense or other platform300x250 banner ad code.
  10. Click on Save template and you are done

Read also: Adsense: How to Add Sticky and Full Screen Ads in Blogger

Customize

- If you want to change automatic closing time limit, you can do it by changing 3000 value from above javascript code.
- If you want your visitors manually close popup ads by clicking on close icon, remove following code from above javascript code.
    $(window).load(function(){
        setTimeout(function(){
            $('.cb_splash_ads').slideUp('slow');
        },3000);
    });
That's it. I think that you enjoyed my tutorial. Happy Commenting!

Make 5k a day click here

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor Aenean massa.

You Might Also Like

0 comments

SUBSCRIBE

Enter your email address:

Get Updates From GabaWorld

Like us on Facebook