Saturday, July 29, 2017

How to Add Responsive Popup Splash Ads to Blogger

The Bloggertricks

After been approved on Google adsense. the next thing is to exploit on various ways to boost our adsense earning, and also generate more revenue. Below is a step by step tutorial on how to get instant 50/100 clicks or more per day on Google Adsense, which depends on your site traffic rate.

Guide on how to Add Responsive Popup Splash Ads to Blogger:

Step 1: Log in to your Dashboard

Check Also: How to Make Adsense Ads Appear In the Middle of Blogger Post

Step 2: Go to Layout --> Edit HTML

Step 3: Click any where inside the code area and to open a search box type CTRL+F from keyboard.

Check Also: How to Add Adsense Ads Below First Post in Blogger

Step 4: Type or paste following code into the search box and hit enter.

 </body>

Step 5: Now Copy following code and paste it before the above line:

Code:
[<script>
$undefineddocument).readyundefinedfunctionundefined$) {
$undefined'.cb_splash_ads .close').clickundefinedfunctionundefinedevent) {
event.preventDefaultundefined);
$undefined'.cb_splash_ads').slideUpundefined'slow');
});
});

$undefinedwindow).loadundefinedfunctionundefined){
setTimeoutundefinedfunctionundefined){
$undefined'.cb_splash_ads').slideUpundefined'slow');
},3000);
});
</script>]

Step 6: Again search following code:
 <body>

Step 7: Now Copy following code and paste it below the above line:

Code:
[<!--Splash Popup Ads Start-->
<style>
/*********************************
** Name: Blogger Popup Splash Ads
** Created By: www.thebloggertricks.com
*********************************/
.cb_splash_ads {
background-color: rgbaundefined0,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 undefinedmax-width:768px){
.cb_splash_ads .pop {margin-top:25%;}
}
@media only screen and undefinedmax-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://4.bp.blogspot.com/-gqmCHgeS4yI/WJAeuIucjdI/AAAAAAAAEmU/xdFdp6UkMGkP5YQKfPIA6FVkr8rhjh0KQCLcB/s1600/close.gif'/></a>
Paste your 300x250 Adsense ad code
</div>
</div>
<!--Splash Popup Ads End-->]
Customization:
Step 8: Replace Paste your 300x250 Adsense ad code with your Google Adsense 300x250 banner ad code.

Check Also: How to Put Google Adsense Below Post Title in Blogger

Step 9: Click on Save template and you are done

=>You can also change the Automatic closing time limit, By Changing 3000 value from the above javascript code

=>If do love your visitors to manually close the Popup ads by clicking on the close icon. Kindly remove the following code from the above javascript code.

$(window).load(function(){ setTimeout(function(){ $('.cb_splash_ads').slideUp('slow'); },3000); });

That is all on How to Add Responsive Popup Splash Ads to Blogger , Hope you enjoyed Reading it. Wish you all the Best. Do not forget to like our facebook Page.
How to Add Responsive Popup Splash Ads to Blogger
4/ 5
Oleh

Subscribe via email

Get our latest updates straight to your inbox.