Here my measurements from Google Lighthouse done inside Chrome – DevTools: (normal mode) https://imgur.com/a/y5vmGar and (incognito mode) https://imgur.com/a/7Sedqnb – as you can see, it is here all the time.

Greetings Kathrin

Dear Vlad, this piece of code I found in Lighthouse: https://imgur.com/a/6dpYvHu

Greetings Kathrin

But is it a problem when I do not use medium_large? I always use full size, that means for my website 696×464.

Greetings Kathrin

Thank you for the information!

Dear Vlad, I have tested it in incognito mode too and there is no change. The placeholders are missing. I think the problem is that the layout shift doesn’t happen on the load (this is measured by Page Speed Insights and webpagetest.org) it happens out of the first viewboard. You can see it when you use the Chrome Extension for Web Core Vitals. Here you can see the CLS clearly: https://imgur.com/a/izTClDE

Greetings Kathrin

• This reply was modified 5 years by Topfgartenwelt.

Both sizes are activated. But what size is used in the post itself?

Greetings Kathrin

The code is still there: https://imgur.com/a/sZFCX2B

• This reply was modified 5 years by Topfgartenwelt.

In Chrome Developer Tools: Open devtools, choose desktop or mobile version of the theme, disable cache on devtools, throttle the device to 2g (so you can see what is happening) scroll down to the bottom social media buttons, press strg+r or f5 and start the reload. Than you can see that there are no, really no! fitting thumbnails for images. The whole site is loaded without leaving space for the images, because there are no thumbnails deposited. The only thumbnail that I could find and that is used for post pictures on desktop is tdb_696x0. Here you have set a width. But that doesn’t help anything. You have to define the height to avoid CLS!!! The height is 464px. And 464 px have to be free for every inserted image!

In the mobile theme there is not a single thumbnail defined – not for the featured image and not for the other images in the posts, for example a thumb sized 330x220px.

I wright my articles with the Gutenberg Editor. It must be possible that pictures which are inserted by using the Gutenberg Editor get the right thumbnail sizes, so that there is no layout shift?

Here is a video that shows the Layout-Shifts clearly: https://imgur.com/a/c7WeyPf

It’s a mess!!! It’s a disaster!!!

Greetings Kathrin

• This reply was modified 5 years by Topfgartenwelt.

Unfortunately the CLS is in reality not 0. I have opened a topic with the problem. But could you remove that code in one of the next updates?

Greetings Kathrin

Ok, but the problem is the Footer Logo in the mobile version of the theme which is inserted via Themepanel and here I can’t do any settings.

Greetings Kathrin

Dear Vlad, I know that it works perfectly if I directly insert the ads in Newspaper. But the legal requirements have changed. In the EU no ad is allowed to be shown without consent and Google AdSense makes problems if there are too many impressions for visitors from Social Media. Unfortunately Newspaper offers no possibilty to stop referrers for Facebook and so on.

If a block or a CSS-Wrapper is inserted in the layout always a Layout Shift occurs like here: https://www.topfgartenwelt.com/svg-logo

This also happens if I write a CSS-Wrapper and put it directly into the Ad-Section of the Newspaper Composer. Why is that happen?

Greetings Kathrin

Maybe it is possible to do that in one of the next updates?

Ok, than I will suggest to test Borlabs-Consent-Plugin 🙂

Greetings Kathrin

It isn’t allowed anymore to just add the code, you need the consent of the visitors for using it. But you’re also recommending a consent plugin that is out of date. I think you haven’t recognized yet that legal things are changing and are getting stricter.

The Plugin you mentioned offers nearly No Support and ist Not TCF 2.0 (the new Version of the Privacy Shield) compatible and that’s a must for Google AdSense. What about Testing a new Plugin? A Plugin that fullfills the legal requirements?

Greetings Kathrin

I have the Same question.

I know that I can add the ads there. I wanted to know if it’s possible to don’t show up the ad tag if only an AMP-Ad is added and no normal mobile ad?

Please read what is written! Thanks!
Greetings Kathrin

• This reply was modified 5 years by Topfgartenwelt.

And which Consent Plugin you will recommend? I’m forced to use one because I’m situated in the EU like you. And Borlabs is a Consent Plugin which is officially recommended to comply with the regulations in the EU. I hope you know that all website owners situated in the EU are forced to use such plugin????

Greetings Kathrin

Vlad it’s the only way to get no Layout Shift!!

And which Plugin is supported by Newspaper for inserting Ads? Because there are just two that are officially recommended by Google: AdInserter and Advanced Ads. You can read it here: https://support.google.com/adsense/answer/7527509?hl=de

Why you don’t support by the biggest search maschine of the world recommended Plugins? I don’t understand that!!!

But also if I don’t use a plugin and want to use a wrapper in the field for ads in the tagdiv-composer there is a layout shift. What is causing that layout shift? And why every css added is causing a layout shift in the theme?

Greetings Kathrin

Dear Vlad, if I use the theme panel I create a CLS on my own. Every peace of code that is not loaded at once causes that problem. I need to do it directly in the style.css. Will I find it there under the same parameter .td-post-sharing-top?

The testing tool always switched to the responsive layout of the theme 🙁

@larane You’re welcome

In the mobile theme there are the top-social-buttons and after that buttons there is the possibilty to insert an ad. That I have done including the description -Werbung/Advertisement-. But this ad block receives most of the invalid clicks in my blog. According to the guidlines of AdSense there should be enough space between links (social media buttons) and the ad. So I want to increase the space between the ad and the top social media buttons.

Doing it with CSS within the themepanel always increases the CLS, can please tell me where I have to do it in the style.css of the mobile theme? It just should be done by increasing the margin, but I don’t know where.

Greetings Kathrin

You’re right 🙁