Website navigation bar prevents insertion of Adsense automatic ads
Google Adsense automatic advertising is worry-free, but sometimes it places ads in inappropriate locations, seriously affecting user access. For example, this site of mine will inexplicably insert ads above or below the navigation bar (inside the blue box). This smart algorithm is also intoxicating.
The solution I took before was to directly exclude the corresponding block in the background setting. This may reduce advertising and affect making money. Anything that goes against making money must be done at a minimum.
Later, I opened the browser debugging tool in the "Ad Settings Preview" and found that Google inserted the advertising code parallel to the nav in
First look at the code in the header.html part
Google's algorithm seems to give priority to inserting advertising blocks into the header, with one advertising space above and below the nav, which is a prime location after all.
The automatic advertising algorithm is not omnipotent. In the theme I use, header and nav are strongly related, and some styles of nav are inherited from header. If no changes are made, the result will be advertisements inserted into the blue bars of the navigation bar, which is extremely ugly and intolerable.
My arms can’t twist my thighs. Here’s my solution:
1. Put the header style into nav
In this way, the header style is empty, and Google can do whatever it wants. The nav is independent. As long as you are not stupid enough to put ads in
<nav></nav>, the navigation bar is still there, the functions are displayed, and the style is normal, it will not affect the user's use. .
By the way, I also changed the page to facilitate widescreen display of "sidebar ads", which I learned from others (after all, maintaining a website also costs money, and the domain name, hosting, and time spent are far from being paid back).
2. Let nav be always displayed
1.nav 2 color: $haze 3 display: flex 4 justify-content: space-between 5 background-color: $bg 6 padding: 0 1.5rem 7 position: relative 8 width: 100% 9 z-index: 999999 10 left: 0
The core attributes are:
position: relative and
z-index: 999999. The result is that nav always has a place. If the navigation is blocked or confused, it will seriously affect the user's access to the website. The information entrance must be tightly controlled.
3. View results
Finally, the ad module is displayed in the ad preview, and it is confirmed that it will not be squeezed into the nav. It is either above or below, and it does not affect navigation.
As shown below:
Everyone's website theme is different. If you encounter a similar situation, readers can look at the source code and see which blocks Google Adsense automatically inserts, and deal with it according to the situation.
- All content on this site is original, please do not reprint without authorization (because the typesetting is often disordered after reprinting, the content is uncontrollable, and cannot be continuously updated, etc.);
- For non-profit purposes, to deduce any content of this blog, please give the relevant webpage address of this site in the form of 'source of original text' or 'reference link' (for the convenience of readers).
- My Toolbox
- Batch conversion of Simplified Chinese articles to Traditional Chinese
- Hugo adds the last modified time at the end of the article
- Hugo static site access Adsense ads