I don't know if something is affecting my archive page; when I select that specific page, a product looks bigger and shows on the entire page. Its duration is about one second but is very noticeable.
The archive page: hidden link
The site: hidden link
We have checked the mentioned page a couple of times, in incognito mode and in different browsers, but so far we weren't able to reproduce the problem. Have you managed to fix it in the meantime?
I still see the problem in all my browsers; the ones I tried are Google, Edge, and Firefox, I tried in incognito mode, and I still see the issue. Also, I tried in different PC equipment and still see the glitch.
I also deleted the cache of my browsers and the cache of the site.
After refreshing the page a few times in a row we were able to check it. I would like to request temporary access (wp-admin and FTP) to your site to take better look at the issue. You will find the needed fields for this below the comment area when you log in to leave your next reply. The information you will enter is private which means only you and I can see and have access to it.
Our Debugging Procedures
I will be checking various settings in the backend to see if the issue can be resolved. Although I won't be making changes that affect the live site, it is still good practice to backup the site before providing us access. In the event that we do need to debug the site further, I will duplicate the site and work in a separate, local development environment to avoid affecting the live site.
- Please make a backup of site files and database before providing us access.
- If you do not see the wp-admin/FTP fields this means your post & website login details will be made PUBLIC. DO NOT post your website details unless you see the required wp-admin/FTP fields. If you do not, please ask me to enable the private box. The private box looks like this: hidden link
Please, let me know if you need any additional details. Have a nice day.
I have double-checked the problem, but so far I haven't been able to find a fix. I asked my colleagues to take a look to see if there's anything I'm missing.
I'll come back here as soon as one of them answers me (which shouldn't take long). Thank you in advance for your patience!
I have escalated this ticket to our 2nd tier of support where our 2nd tier specialists will take a deeper look at this issue and will try to find a solution.
I will get back to you as soon as I get an answer from them.
We have checked the issue again, and it seems the problem here is that after the first load, once the img has been cached by the browser, the media is being rendered before the processing of the CSS that determines its intended size.
This occurs due to the fact that the CSS added to the Custom CSS editors in the custom WordPress Archive is injected onto the page (which happens fairly late in the page assembling process). To avoid such issues we can move the critical CSS definitions into a CSS file loaded by the child theme, or, for simplicity, you can move the CSS into style tags within one of the HTML editors in the custom archive.
For example, in this screenshot (hidden link) you can see we've moved the CSS declarations for the .lf_product class into style tags in the final markup editor, before the [wpv-layout-meta-html] and [wpv-filter-meta-html] shortcodes.
In that case the CSS is handled before the img tag is added to the page, so that it already knows its intended width before first being rendered. It seems to do the trick.
Could you please give it a try in your end? Just check which CSS styles should be included inside the 'style' tag, and see if it helps.
