Hello IcloudZer friends how are you today? Now the admin will discuss how to make sticky ads on blogger with a responsive and cool appearance for sure
Info: Okay if you are curious about our discussion this time, let's just start discussing it
Sticky Ads
If you apply this sticky ad on your blog, the display of the ad will have a floating style and the ad will be displayed when the blog page is reloaded
For information: This sticky ad is a new style of google ads usually
Responsive
This sticky ad has a responsive appearance, which is responsive on mobile devices and responsive also on desktop devices, and has a Close button to close the ad
Info: why is this sticky ad code really responsive, because the display creation of the sticky ad is made using the CSS code also
Many Clicks
If you implement this sticky ad on your blog, it is likely that you will get a larger number of clicks, because this sticky ad is displayed right in the middle of the blog and almost fills the entire appearance of the blog, thus making visitors will see the display of your ad to be clicked on
Example Display
If you are curious about how the example will look if you apply this sticky ad on your blog, then it will look like the sticky ad that admin is using now
How to make
Okay now admin will start discussing how to make a cool and responsive sticky ad on blogger
HTML Code by widget
First step you can do is copy the following HTML code then put below code <body>
<b:section class='rahadspop' id='rahadspop' showaddelement='false'>
<!--[ Hapus "or data:blog.isMobileRequest" jika ingin di tampilkan di desktop dan mobile ]-->
<b:widget cond='data:view.isLayoutMode or data:blog.isMobileRequest' id='HTML535' locked='true' title='Adpop placement(mobile only)' type='HTML' version='2' visible='true'>
<b:widget-settings>
<b:widget-setting name='content'><ins class='adsbygoogle' data-ad-client='ca-pub-4477547086111443' data-ad-format='auto' data-ad-slot='6420600167' data-full-width-responsive='true' style='display:block'></ins>
<script>(adsbygoogle = window.adsbygoogle || []).push({});
</script></b:widget-setting>
</b:widget-settings>
<b:includable id='main'>
<!--[ Popad by ICloudice ]-->
<div class='rahAdpop' id='rahAdpop'>
<div class='rahAdpop_cnt'>
<b:if cond='data:content != ""'>
<data:content/>
</b:if>
<label onclick='document.getElementById("rahAdpop").style.display="none"'>
<span class=''>Up</span>
</label>
</div>
</div>
</b:includable>
</b:widget>
</b:section>Info: The HTML code above serves to display the sticky ad, and using data-ad-format='auto' on adsense
HTML Code non widget
If an error occurs when installing HTML code that supports layout mode, please use the HTML code below and place it under the code <body>
<div class='rahadspop'>
<div class='rahAdpop' id='rahAdpop'>
<div class='rahAdpop_cnt'>
<ins class='adsbygoogle' data-ad-client='ca-pub-4477547086111443' data-ad-format='auto' data-ad-slot='6420600167' data-full-width-responsive='true' style='display:block'>
</ins>
<script>(adsbygoogle = window.adsbygoogle || []).push({});
</script>
<label onclick='document.getElementById("rahAdpop").style.display="none"'>
<span class=''>Up</span>
</label>
</div>
</div>
</div>Info: The HTML code above serves to display the sticky ad, and using data-ad-format='auto' on adsense
Javascript code
The next step you can do is to put and save the javascript code below right above the code </head>
<script>/*<![CDATA[*/
const rahAdC = "#de3535"; /* Ubah warna by icloudice */
/*]]>*/</script>
<script src='https://cdn.jsdelivr.net/gh/rahcode-ui/icloudice@dewa/users/js/rahadpop53.min.js'></script>Info: The javascript code above is used to stabilize the sticky ads
Explanation
All source code for creating Pop ads or sticky ads on blogger admin is provided free of charge, and don't change or edit the code, if the code is edited then the display of the sticky ads will not work, that's how ICloudzer friends hope this is useful
