You can reserve space for ads by using some codes which I provide you below and by using that code you can reserve white blank space for ads on your website. Inside the code, there is the use of min-width and min-height attributes which can reserve that amount of space on your website but if the browser needs more space and ads needs more space then it will push the layout so, you have to set the size perfect for all browser so it will look and works similarly on both mobile and desktop devices.
{tocify} $title={Table of Contents}
Also, Remember this code is used for only manual ads, not for auto ads. Auto ads only
How to reserve space for ads or manual ads?
<div class='column'><div id='slot-2' style='width: auto; height: 380px;'><br><script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-1234567890123456" crossorigin="anonymous"></script><!-- Homepage Leaderboard --><ins class="adsbygoogle"style="display:inline-block;width:728px;height:90px"data-ad-client="ca-pub-1234567890123456"data-ad-slot="1234567890"></ins><script>(adsbygoogle = window.adsbygoogle || []).push({});</script></br></div></div>
<div class='column'> <div id='slot-2' style='width: auto; height: 380px;'>
Enter your google Adsense ads code here.
</div></div>
The traditional way of ads reservation on the website?
The traditional way of ads reservation on a website is used for reserving space for ads on the website by providing minimum height and minimum width but the main drawback of this code is the ads can able to increase its size itself if it needs but can't able to minimize.
For HTML,
<div id="ad-slot" style="min-width: 300px; min-height: 250px;"></div>
FOR CSS,
@media screen and (max-width: 960px) {
#ad-slot {
min-height: 100px;
}
}
Both Html and CSS ads reserving code or Code1 is taken from here (Minimize layout shift | Google Publisher Tag | Google Developers)
In this code, you just have to change min-width and min-height according to your need but I recommend you to use the above main code.
Types of Reserve Space For Ads
- Space Reserve with Placeholder
- Space Reserve without Placeholder
- No Space Reserve
How to use the ads reserving code on the website?
- To reserve space for ads on the website you have to use the second provided code which is given above and see the example on how to use it by seeing first code.
- Then use your AdSense code before the closing div tag code </div>.
- Set width and height in pixel as your website need or according to your wish.
- Add that code to your website in HTML format.
- Save the code and see that it takes effect or not.
Do ads reserving codes decrease the CLS (Cumulative Layout Shift) issue on the website?
Do ads reserving code slow the website speed?
It depends upon you and your way of thinking if you like decorated space then you can use that and if you don't then you can use space reservation for ads without placeholders and you can read all these from here (Reserve space for ads | Google Publisher Tag | Google Developers).