Hi there,
we are facing an issue with the Flex Block only.
When we create new posts we often have the thumb placeholder not showing, actually nothing – which then causes the formating to fail for our newsroom page.
You can check the normal behaviour here: https://www.livetube.tv/news
Here is an example how it looks when the first image is not showing and also not the thumb placeholder
https://app.screencast.com/HQv1Q5nE4fzLq
Here with magnifier
https://app.screencast.com/w9BRg0tku0qUk
Here is a link to our thumb placeholder
https://www.livetube.tv/news/wp-content/uploads/sites/8/2022/11/Placeholder-Large-LiveTube.jpg
For all other blocks the thumb placeholder is showing correctly
We would appreciate your help with this
Thanks
Hello @smilelondon!
We can take a look at this and investigate why it is not working for you. Contact us via email at contact@tagdiv.com and provide the following:
– admin URL and credentials
– a link to this topic in order to identify you
Thank you!
Hi there
Sorry for the delay.
We have conducted further investigation and wanted to share some additional insights with you:
Specifically, during the rendering process of the images, there appears to be a lack of reserved space for the images within the Flex Block. As a result, the post is generated before the image finishes rendering, and this leads to the default thumbnail image not being displayed because of the missing fixed image-container size
We have tried adjusting various settings within the TagDiv Composer and explored the theme’s options, but we have not found a solution to mitigate this problem. Image width and hight can only be set in percentage.
Let me know if you still need Admin access to investigate this.
We believe that it is more a general issue with the time between importing posts, generating thumbnails and offloading images to a CDN and the missing reserved fixed width and height space for the images.
Perhaps there is even a CSS code we might be able to add, however we do not know the newspaper specific thumb name of the entry thumb in a Flex Block.
Here is what we experimented with
.entry-thumb { height: 300px;
/* adjust as needed */
width: 100%;
background-size: cover;
background-position: center; }
I look forward to hearing back from you
Regards
Sven