AdInserter and Borlabs

Ad Inserter supports IAB TCF 2.0:
https://adinserter.pro/faq/gdpr-compliance-cookies-consent#tcf

After reading this I’m a little bit disappointed. I was glad that everything was working now. But if I use dynamic blocks: server side I have a CLS for every block that I inject. I think this is a problem caused by my theme. There is no way to get the tfc 2.0 get working correctly by using dynamic blocks server side?

Greetings Kathrin

Actually this is a limitation of the TCF framework. It works only client-side (Javascript code in the browser).

Ad Inserter can check cookies server-side and when the pages are not cached this works pretty well.

However, TCF cookie is encoded and there is only a javascript function that decodes the cookie data and provides the consent stauses, the check needs to be done client-side.

?? And you have no idea what is causing the layout shift when using dynamic blocks client side insert even when a placeholder with a maximum height is set? If you could do that I could talk to my layout developer if he has a solution for that problem. I only found out that the ad-block is causing the problem but not why.

Greetings Kathrin

It may be that the loaded ad is sometimes higher than the block height.
Make sure the ad fits into the reserved ad space.

Also make sure all the blocks inserted client-side have defined height (or do not display anything and use No wrapping style).

You can also compare the same page loaded in both ways (server-side and client-side dynamic blocks)- check for differences in height.

Maybe the theme applies some styles that change the height when the ads are loaded.

A useful test would be to replace all codes inserted cleint-side with a simple short text (one word) so ad codes can be eliminated. Then you can restore codes block by block to see the difference.

If you find anything related to the plugin itself we’ll be happy to investigate.

The loaded ad isn’t higher than the block height because I was using a fixed adcode (250 px height).

Now I set the dynamic blocks to client side insert and device detection to client side and no wrapping and the CLS is gone, but now I get the warning that the wrapping code is needed for client-side device detection. There is also no CLS if I use dynamic blocks client side insert and device detection server side. Even if I use a static dummy ad there is no CLS on desktop. Also on mobile I have no CLS if I use Dynamic Blocks Client Side insert and server side device detection. Would that also work with a responsive ad? And include mobile tablets and mobiles or have I to use phone devices therefore?

It’s the wrapper that cause the CLS ?? Is there a way to avoid that? And is there a way to get a little bit blank space under the ad without using a wrapper? Maybe with a style code?

But would the server side device detection work with the Borlabs cookie?

And if I use Borlabs the ads are blocked until I get the consent of the user, so the ads are loaded later. Will this increase the CLS again or it is avoided by defining the max height?

Greetings Kathrin

For the blank space I used: <p style="margin-bottom 50px"></p> Is that ok?

Greetings Kathrin

If there is no wrapping then the block will not be inserted – device detection can’t work. You need to figure out which element is shifted – compare pages as suggested above.

Your code looks ok.

Oh my God, it’s a mess.

“A useful test would be to replace all codes inserted cleint-side with a simple short text (one word) so ad codes can be eliminated. Then you can restore codes block by block to see the difference.”

I have also tried to insert just a word by AdInserter if you mean something like that. It’s also causing a layout shift when using the wrapper. It is the wrapper causing the problem in connection with tagdiv-Composer (I’m using the newspaper theme).

But I don’t know why. I have tried it again with the options dynamic blocks client side insert and device detection client side insert for desktop and there is no layout shift anymore. I don’t know what happened. I just deleted two Plugins (statcounter and AMP)…and the Layout Shift can’t be produced anymore. Was the problem maybe a plugin conflict?

Greetings Kathrin

OK, then it is not the ad code.

Basically the wraper is as you configrue it – you see the CSS code used and you can check it the source code.
The wrapper style doesn’t change after the insertion.

However, if the layout shift is gone after removing some plugins then it seems that those plugins may add some style codes to the page that caused the shift.

A conflict is very unlikely – make sure there are no javascript errors on the page.

Another possibility could be that some of those plugins repositions some elemets or is making changes after the ad codes are inserted.

The good thing is that it seems to be working correctly now without causing any layout shift. Unfortunately the ad in the mobile theme overlaps the text. I used an ad with a static hight of 250 px and set the container also to 250 px. The overlap disappeared when I set the container to 300 px. But how can I ensure that it works correctly with AdSense? So that there is no overlapping?

Greetings Kathrin

You should add the height of the ad label.

If you add some additinal space it should also work fine.
Just make sure the height of the Ad Inserter block is at least the height of the inserted code (ad + ad label).

Please note that if you are using responsive code you can’t be sure what the height of the ad will be.

Ok, maybe this was the problem. So you recommend to use an ad with an fixed height to avoid problems with overlapping?

Greetings Kathrin

Absolutely!

Thank you very much for your patience!!

Greetings Kathrin