Title: CLS Last modified: January 20, 2021 --- # CLS * Resolved [topfgartenwelt](https://wordpress.org/support/users/topfgartenwelt/) * (@topfgartenwelt) * [5 years, 4 months ago](https://wordpress.org/support/topic/cls/) * At the moment I’m trying the free plugin, but it seems that AdInserter is causing a CLS in the desktop version. Lighthouse is reporting that the following peace of code is the problem: * div.code-block.code-block-2 * How can I avoid it? Without the plugin my CLS is nearly 0. * I have tried to set a height in custom css (350 pixel) –> CLS I have tried a banner –> CLS after insertion * Greetings Kathrin - This topic was modified 5 years, 4 months ago by [topfgartenwelt](https://wordpress.org/support/users/topfgartenwelt/). * The page I need help with: _[[log in](https://login.wordpress.org/?redirect_to=https%3A%2F%2Fwordpress.org%2Fsupport%2Ftopic%2Fcls%2F%3Foutput_format%3Dmd&locale=en_US) to see the link]_ Viewing 15 replies - 1 through 15 (of 35 total) 1 [2](https://wordpress.org/support/topic/cls/page/2/?output_format=md) [3](https://wordpress.org/support/topic/cls/page/3/?output_format=md) [→](https://wordpress.org/support/topic/cls/page/2/?output_format=md) * Plugin Author [Spacetime](https://wordpress.org/support/users/spacetime/) * (@spacetime) * [5 years, 4 months ago](https://wordpress.org/support/topic/cls/#post-13932467) * The plugin only inserts the codes you configure. Whatever visible you insert it will shift the layout. * Basically, to prevent layout shift you need to define block height: [https://adinserter.pro/faq/how-to-minimize-layout-shift](https://adinserter.pro/faq/how-to-minimize-layout-shift) * Thread Starter [topfgartenwelt](https://wordpress.org/support/users/topfgartenwelt/) * (@topfgartenwelt) * [5 years, 4 months ago](https://wordpress.org/support/topic/cls/#post-13932633) * I have tried to define block height but unfortunately the single thing that a block height is defined causes a big layout shift. I’m using client side insertion because I want to insert my AdSense Ads later on. Is there no way to stop the CLS for that option? * Greetings * Plugin Author [Spacetime](https://wordpress.org/support/users/spacetime/) * (@spacetime) * [5 years, 4 months ago](https://wordpress.org/support/topic/cls/#post-13932664) * If the block code (at least the wrapping div) is inserted serverside and the block height is defined, then the layout will not shift. * Remote debugging doesn’t seem to be enabled. Which block is shifting the layout? * Thread Starter [topfgartenwelt](https://wordpress.org/support/users/topfgartenwelt/) * (@topfgartenwelt) * [5 years, 4 months ago](https://wordpress.org/support/topic/cls/#post-13932858) * Oh my God, I don’t know what you mean. I set in the settings dynamic blocks to client side insertion. Than I activated Client side device detection and defined under the tab display a height. At the moment I’m testing block 2. * I want to configure it for my AdSense Ads and block referrers like facebook later on. * I have activated remote debugging. * Greetings - This reply was modified 5 years, 4 months ago by [topfgartenwelt](https://wordpress.org/support/users/topfgartenwelt/). * Plugin Author [Spacetime](https://wordpress.org/support/users/spacetime/) * (@spacetime) * [5 years, 4 months ago](https://wordpress.org/support/topic/cls/#post-13932998) * Block 1 has no height defined. * Block 2 uses server-side and client-side device detection. For client-side detection all devices are enabled. * Use only one device detection method (usually client-side should be used) and enable only wanted devices. If you need to insert on all devices then you don’t need device detection – disable it. * [https://adinserter.pro/documentation/device-detection](https://adinserter.pro/documentation/device-detection) * Thread Starter [topfgartenwelt](https://wordpress.org/support/users/topfgartenwelt/) * (@topfgartenwelt) * [5 years, 4 months ago](https://wordpress.org/support/topic/cls/#post-13933248) * Ok. I have changed my settings to: * Dynamic Blocks –> server side Device Detection –> client-side insert for block 1, devices phone, tablet device detection –> none for block 2, because this one should appear on all devices –> but in which form the ad is added when nothing is chosen? Show or insert? For Adsense only insert is allowed, I read. Would it be better to define an extra block for desktop, because here I have an add with defined height and width. height defined in all blocks: 300 pixel referrers blocked: facebook, flipboard * The CLS seems to be gone 🙂 * Greetings * Plugin Author [Spacetime](https://wordpress.org/support/users/spacetime/) * (@spacetime) * [5 years, 4 months ago](https://wordpress.org/support/topic/cls/#post-13934249) * When you are not using client-side device detection the insertion method for non-static code defines Dynamic blocks setting: [https://adinserter.pro/documentation/plugin-settings#dynamic-blocks](https://adinserter.pro/documentation/plugin-settings#dynamic-blocks) * Yes, you can use a separate block for desktop or use only one with this approach: [https://adinserter.pro/documentation/device-detection#viewport-separators](https://adinserter.pro/documentation/device-detection#viewport-separators) * Thread Starter [topfgartenwelt](https://wordpress.org/support/users/topfgartenwelt/) * (@topfgartenwelt) * [5 years, 4 months ago](https://wordpress.org/support/topic/cls/#post-13935091) * Me again, thank you very much for your help! * I have made an own block for the desktop ad now, so my configuration is now as follows: * Dynamic Blocks –> server side Device Detection –> client-side insert for block 1, desktop device detection –> client-side insert for block 2, tablet, mobile device detection -> client-side insert for block 3, tablet, mobile * blocked referrers: *facebook.com, *flipboard.com * Now I was trying to set a cookie in block 4: * ``` var hours = 1; var date = new Date(); date.setTime(date.getTime() + (hours * 60 * 60 * 1000)); document.cookie = 'ai-hide-ads=1; expires=' + date.toUTCString () + "; path=/"; ``` * –> insertion footer –> no wrapping * In the blocks 1 to 3 I set the URL-Parameter to: ai-hide-ads. I tried if it works in an incognito tab. If I come from Facebook I don’t see any ads. I also don’t see any ads if I click on a link. If I come to my page from Google I see the ad, but when I click on a link, I don’t see any ad on the new loaded page too. Am doing something wrong? * Greetings Kathrin * PS: I rated your app!! * Thread Starter [topfgartenwelt](https://wordpress.org/support/users/topfgartenwelt/) * (@topfgartenwelt) * [5 years, 4 months ago](https://wordpress.org/support/topic/cls/#post-13936746) * Update: I was testing it on mobile and on desktop with the incognito tab. When I go directly to my page, I see the advertisement in the first post, but when clicking on an intern link the next page hasn’t any advertisement. But the advertisement should only be not inserted for users from facebook and flipboard. Why the advertisement is limited when going directly to the page or coming from Google? * Greetings Kathrin * Plugin Author [Spacetime](https://wordpress.org/support/users/spacetime/) * (@spacetime) * [5 years, 4 months ago](https://wordpress.org/support/topic/cls/#post-13936764) * Dynamic Blocks should be set to client-side insert. * I don’t see Javascript code in the footer. It seems the footer code is not enabled. * Thread Starter [topfgartenwelt](https://wordpress.org/support/users/topfgartenwelt/) * (@topfgartenwelt) * [5 years, 4 months ago](https://wordpress.org/support/topic/cls/#post-13936873) * Yesterday you told me to set the dynamic blocks to server side to avoid cls. If I use client side insert the cls is really huge. Too much for Google. * Where I should enable the footer code? I did everything that was written in the description 🙁 * Greetings Kathrin * Plugin Author [Spacetime](https://wordpress.org/support/users/spacetime/) * (@spacetime) * [5 years, 4 months ago](https://wordpress.org/support/topic/cls/#post-13936908) * No, misunderstanding. * > If the block code (at least the wrapping div) is inserted serverside and the > block height is defined, then the layout will not shift. * You still need to use client-side insertion for dynamic blocks (dynamic content– based on the rererrer). The basic code for the block is almost always inserted serverside. I only wanted to point out where the layout shift comes from. * You need to click on the button top right next to PHP to enable insertion of the header / footer code: [https://adinserter.pro/documentation/header-and-footer-code](https://adinserter.pro/documentation/header-and-footer-code) * Thread Starter [topfgartenwelt](https://wordpress.org/support/users/topfgartenwelt/) * (@topfgartenwelt) * [5 years, 4 months ago](https://wordpress.org/support/topic/cls/#post-13937889) * I have wrote you an Email with screenshots, I don’t know what to do anymore. And I don’t know how to insert the wrapping div server side 🙁 * Greetings Kathrin * Plugin Author [Spacetime](https://wordpress.org/support/users/spacetime/) * (@spacetime) * [5 years, 4 months ago](https://wordpress.org/support/topic/cls/#post-13938013) * Great, they will be able to offer direct help. * Thread Starter [topfgartenwelt](https://wordpress.org/support/users/topfgartenwelt/) * (@topfgartenwelt) * [5 years, 4 months ago](https://wordpress.org/support/topic/cls/#post-13938842) * If I leave the dynamic blocks on client side insert I get really high CLS thats no option 🙁 I put it back to server-side. Is that a problem for AdSense? * And how I get the AMP Ads to work? Would it be a problem to put the AdSense AMP Code directly in my theme that supports AMP or am I forced to do it with AdInserter? * Greetings Kathrin - This reply was modified 5 years, 4 months ago by [topfgartenwelt](https://wordpress.org/support/users/topfgartenwelt/). Viewing 15 replies - 1 through 15 (of 35 total) 1 [2](https://wordpress.org/support/topic/cls/page/2/?output_format=md) [3](https://wordpress.org/support/topic/cls/page/3/?output_format=md) [→](https://wordpress.org/support/topic/cls/page/2/?output_format=md) The topic ‘CLS’ is closed to new replies. * ![](https://ps.w.org/ad-inserter/assets/icon-256x256.jpg?rev=1502039) * [Ad Inserter - Ad Manager & AdSense Ads](https://wordpress.org/plugins/ad-inserter/) * [Frequently Asked Questions](https://wordpress.org/plugins/ad-inserter/#faq) * [Support Threads](https://wordpress.org/support/plugin/ad-inserter/) * [Active Topics](https://wordpress.org/support/plugin/ad-inserter/active/) * [Unresolved Topics](https://wordpress.org/support/plugin/ad-inserter/unresolved/) * [Reviews](https://wordpress.org/support/plugin/ad-inserter/reviews/) * 35 replies * 2 participants * Last reply from: [topfgartenwelt](https://wordpress.org/support/users/topfgartenwelt/) * Last activity: [5 years, 4 months ago](https://wordpress.org/support/topic/cls/page/3/#post-13944115) * Status: resolved