✅ 🔗 🐞 Intermittent bg image loading issue in the first Loop Grid item (Related to #22368) - [ED-12415] #23085

ofmarconi · 2023-07-17T12:56:06Z

Prerequisites

I have searched for similar issues in both open and closed tickets and cannot find a duplicate.
The issue still exists against the latest stable version of Elementor.

Description

Hello Elementor Team,

I'm experiencing intermittent issues with images failing to load in loops and in the background. The images are referenced through CSS, however, it appears that the image URLs are not consistently listed within the CSS for some loops, leading to instances where they fail to load. And some users are having trouble describing the problem as it doesn't follow a pattern:

https://www.facebook.com/groups/Elementors/posts/6128272220631846/

What I noticed is that in the final CSS it is not including the background image of 1 Loop, in the others it includes it as expected, but in the one that does not load it is because there is no request to load it. then you reload the page and it appears or another Loop does not load.

Steps to reproduce

This problem is random and doesn't occur at every instance, making it quite challenging to pinpoint. I would greatly appreciate any advice or solutions you could provide to help resolve this issue.

Isolating the problem

This bug happens with only Elementor plugin active (and Elementor Pro).
This bug happens with a Blank WordPress theme active (Hello theme).
I can reproduce this bug consistently following the steps above.

System Info

					
== Server Environment ==
	Operating System: Linux
	Software: LiteSpeed
	MySQL version: Ubuntu 20.04 v10.3.38
	PHP Version: 7.4.33
	PHP Memory Limit: 1024M
	PHP Max Input Vars: 1000
	PHP Max Post Size: 100M
	GD Installed: Yes
	ZIP Installed: Yes
	Write Permissions: All right
	Elementor Library: Connected

== WordPress Environment ==
	Version: 6.2.2
	WP Multisite: No
	Max Upload Size: 100 MB
	Memory limit: 40M
	Max Memory limit: 1024M
	Permalink Structure: /%postname%/
	Language: en-US
	Timezone: -3
	Debug Mode: Inactive

== Theme ==
	Name: By Marks.art.br
	Version: 1.1.4.1632168674
	Author: Marconi
	Child Theme: Yes
	Parent Theme Name: Hello Elementor
	Parent Theme Version: 2.8.1
	Parent Theme Author: Elementor Team

== User ==
	Role: administrator
	WP Profile lang: en_US
	User Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/114.0.0.0 Safari/537.36

== Active Plugins ==
	Admin Columns Pro
		Version: 5.6.4
		Author: AdminColumns.com

	Advanced Database Cleaner PRO
		Version: 3.2.2
		Author: Younes JFR.

	All-in-One WP Migration
		Version: 7.76
		Author: ServMask

	All-in-One WP Migration Unlimited Extension
		Version: 2.52
		Author: ServMask

	Elementor
		Version: 3.14.1
		Author: Elementor.com

	Elementor Pro
		Version: 3.14.1
		Author: Elementor.com

	JetEngine
		Version: 3.2.2
		Author: Crocoblock

	Page scroll to id
		Version: 1.7.7
		Author: malihu

	Qi Addons For Elementor
		Version: 1.6.2
		Author: Qode Interactive

	Rank Math SEO
		Version: 1.0.119
		Author: Rank Math

	Retarget Marks
		Version: 2.36
		Author: Marconi

	WP Offload SES Lite
		Version: 1.6.5
		Author: Delicious Brains

	WPS Hide Login
		Version: 1.9.8
		Author: WPServeur, NicolasKulka, wpformation


== Elements Usage ==
	
	footer : 1
		container : 5
		html : 1
		icon-list : 3
		image : 1
		lottie : 1
		social-icons : 1
	header : 1
		container : 5
		image : 1
		mega-menu : 1
	popup : 2
		button : 1
		container : 1
		heading : 1
		icon : 1
	wp-page : 5
		animated-headline : 1
		button : 4
		container : 64
		counter : 4
		divider : 18
		form : 3
		heading : 34
		html : 3
		icon : 9
		icon-box : 1
		icon-list : 6
		image : 19
		loop-carousel : 2
		loop-grid : 1
		lottie : 2
		qi_addons_for_elementor_text_marquee : 1
		social-icons : 2
		text-editor : 4
		video : 1
	single-post : 1
		button : 3
		container : 8
		divider : 4
		heading : 2
		html : 1
		icon-list : 3
		loop-grid : 1
		progress-tracker : 1
		theme-post-content : 1
	loop-item : 3
		container : 11
		divider : 3
		heading : 4
		icon-list : 5
		theme-post-content : 1
		theme-post-title : 1
	jet-listing-items : 0
		container : 1
		divider : 1
		text-editor : 1
		theme-post-title : 1
	error-404 : 1
		button : 1
		container : 3
		heading : 1
		theme-site-logo : 1


== Settings ==
	
	cpt_support: post, page
	allow_tracking: yes
	unfiltered_files_upload: 1
	font_display: fallback
	meta_generator_tag: 1


== Features ==
	Custom Fonts: 0
	Custom Icons: 0

== Integrations ==
	


== Elementor Experiments ==
	Optimized DOM Output: Inactive
	Improved Asset Loading: Active
	Improved CSS Loading: Active
	Inline Font Icons: Inactive
	Accessibility Improvements: Inactive
	Additional Custom Breakpoints: Inactive
	admin_menu_rearrangement: Inactive by default
	Flexbox Container: Active
	Upgrade Swiper Library: Active
	Grid Container: Active
	Default to New Theme Builder: Inactive
	Hello Theme Header & Footer: Inactive
	Editor Top Bar: Inactive
	Landing Pages: Inactive
	Nested Elements: Active
	Nested Accordion: Inactive by default
	Lazy Load Background Images: Inactive
	Global Style Guide: Active
	Page Transitions: Inactive
	Notes: Inactive
	Loop: Active
	Form Submissions: Active
	Scroll Snap: Inactive
	Menu: Active


== Log ==
	


== Elementor - Compatibility Tag ==
	
	Elementor Pro: Compatibility not specified
	Qi Addons For Elementor: Compatibility not specified

== Elementor Pro - Compatibility Tag ==

ofmarconi · 2023-07-18T02:29:48Z

(Snapshot) HTML file with error in loop: https://github.com/elementor/elementor/files/12075265/THLAW.-.Consultoria.Estrategica.zip

I was able to save the HTML with the error, you can see that the first Loop post does not load the image, it is usually the first loop that gives the error:

Grassmedia · 2023-07-18T14:54:45Z

+1 This issue applies to the Loop carousel and Loop Grid

portrayaloflife · 2023-07-27T22:56:48Z

Been seeing this too, duplicate ticket here >> #22368

nicholaszein · 2023-07-30T00:36:45Z

Hello @ofmarconi!

Thank you for submitting your issue! 🙏

🏷️ We've labeled this issue and our team will take a look at it. If there is indeed a problem, they'll work on fixing it. We can't say exactly when it'll be sorted out, but we kindly ask for your patience. Thanks for understanding!

Best regards

portrayaloflife · 2023-07-31T02:17:23Z

@ofmarconi is your loop pulling from WP native POST or are you using a custom post type?

LorenaFlyy · 2023-07-31T08:49:37Z

Hello, I can confirm the problem: Intermittent image loading issue inside loops with background images (always the first post), sometimes also with regular post images from the widget. Here it is the second post that is affected, but this is only from my memory, can't reproduce it currently. The posts are always pulled from WP native post not CPT in my case. I've experienced it since May. Btw, the image "comes back" when you reload the page with CMD+Shift+R. But this is not reliable. Next time you visit the page, it can be vanished again. I have no cache plugins activated, only Elementor + Elementor Pro installed (and Updraft Plus).

Grassmedia · 2023-07-31T09:46:11Z

@LorenaFlyy summarizes the issue well. In my case, I'm using native post types but, have also witnessed the problem with Woo Products and CPT's. This is Woo ...

Daveden2 · 2023-08-09T14:54:07Z

I thought it was just me! I was using the loop grid with a CPT. I had to refresh the page for the ACF background colour to show up in the first loop item

mateitudor · 2023-08-10T20:07:08Z

I get the same behavior from a simple featured image on a default WP post, no CPT, no fancy ACF. It's been going on for so, so long.

mangotam · 2023-08-11T15:08:11Z

wait for this bug fix ! Same issue here

portrayaloflife · 2023-08-18T23:43:36Z

I don't know why they are saying "If there is indeed a problem" when all of us are clearly having the same issue. Kind of frustrating.

ofmarconi · 2023-08-19T13:05:52Z

Could you all check the system information? In my case the key information is:
LiteSpeed
Ubuntu 20.04 v10.3.38
PHP 7.4

mateitudor · 2023-09-01T10:30:59Z

Still happening in 3.16.0-dev3 / Pro beta3

micmiller-apptio · 2023-09-18T20:13:29Z

This is also likely related to #21489

ttec-mark-musante · 2023-09-21T16:01:41Z

Seeing the same issue as @Daveden2 where intermittently the first loop item does not pull in the background color from an ACF field on the post. Refreshing the page fixes the issue but due to caching the page does not always refresh for non-authenticated visitors and the cache must be cleared.

The inline CSS that sets the background color is only added for loop items after the first when this happens.

The issue most reliably appears after updating content on the page in the Elementor editor and then clicking the View page option. That first page load usually has this issue.

.e-loop-item-198 .elementor-element.elementor-element-3647ce49:not(.elementor-motion-effects-element-type-background), .e-loop-item-198 .elementor-element.elementor-element-3647ce49 > .elementor-motion-effects-container > .elementor-motion-effects-layer {
background-color: #002b75;
}

Municornus · 2023-10-09T01:44:19Z

I get the same behavior from a simple featured image on a default WP post, no CPT, no fancy ACF. It's been going on for so, so long.

I possibly ran into a similar issue with featured images (default post type, no ACF) but for me it's not the first post's image that is not rendering but the 5th...
It's very erratic and annoying. All the html looks correct, but the missing image(s) are rendered at 0x0 px, 0:0 aspect ratio.

Only patterns I've found so far with regards to this issue:
(I've a main category archive page and a few subcategory archive pages, each with a loop grid for posts.)

Often it's specifically the 5th post that loads without image (haven't found anything special about it except it being the tallest img of the bunch).
Occasionally on the main category archive page only the first one or two posts of each subcategory load with images, the rest (11-13 posts!) without.
If I navigate to one of the subcategory archive pages that share posts with the main archive, then go back to the main category post image that rendered correctly on the subcategory now also renders normally in the main category, but if I refresh the page the issue is back.

nicholaszein · 2023-10-17T13:01:51Z

Hello everyone!

Thank you for your patience! 🙏

This bug is being worked on, and our team is looking for a solution. Hopefully, we can find it soon.

🔗 As this is the same issue as #22368, I am closing comments here so we can have a centralized place to discuss and update you.

Feel free to continue the conversation there. 😉

Kind regards

nicholaszein · 2024-04-12T05:12:10Z

Hello everyone!

📢 We're happy to announce that the issue you raised was resolved in Elementor Pro v3.19.0! 🥳

✅ Feel free to check it out and update your plugin to the new version!

Check the changelog for more information:
Changelog of Elementor and Elementor Pro

Cheers 🥂

ofmarconi added the status/awaiting_triage Indicates when an Issue, Pull Request, or Discussion awaits to be triaged. label Jul 17, 2023

nicholaszein changed the title ~~Intermittent Image Loading Issue Inside Loops and in Background~~ 🔗 🐞 Bug Report: Intermittent bg image loading issue in the first Loop Grid item - (Related to #22368) Jul 30, 2023

nicholaszein added the status/has-pr Indicates that an Issue, or Discussion has a companion Pull Request awaiting to be merged. label Oct 17, 2023

nicholaszein changed the title ~~🔗 🐞 Bug Report: Intermittent bg image loading issue in the first Loop Grid item - (Related to #22368)~~ 🔗 🐞 Bug Report: Intermittent bg image loading issue in the first Loop Grid item - (Related to #22368) - [ED-12415] Oct 17, 2023

nicholaszein closed this as not planned Won't fix, can't repro, duplicate, stale Oct 17, 2023

nicholaszein changed the title ~~🔗 🐞 Bug Report: Intermittent bg image loading issue in the first Loop Grid item - (Related to #22368) - [ED-12415]~~ 🔗 🐞 Bug Report: Intermittent bg image loading issue in the first Loop Grid item (Related to #22368) - [ED-12415] Oct 17, 2023

elementor locked and limited conversation to collaborators Oct 17, 2023

nicholaszein removed the bug Indicates a bug with one or multiple components. label Nov 9, 2023

nicholaszein added the type/styles Indicates when a topic is related to the styles or design of a component. label Jan 11, 2024

nicholaszein changed the title ~~🔗 🐞 Bug Report: Intermittent bg image loading issue in the first Loop Grid item (Related to #22368) - [ED-12415]~~ ✅ 🔗 🐞 Intermittent bg image loading issue in the first Loop Grid item (Related to #22368) - [ED-12415] Jan 29, 2024

nicholaszein added this to the 3.19.0 milestone Jan 29, 2024

nicholaszein added duplicate Indicates when an Issue or a Discussion is a duplicate of another Issue or Discussion. mod/s* labels Jan 29, 2024

nicholaszein added the bug Indicates a bug with one or multiple components. label Mar 8, 2024

nicholaszein removed the mod/s* label Apr 12, 2024

nicholaszein closed this as completed Apr 12, 2024

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

✅ 🔗 🐞 Intermittent bg image loading issue in the first Loop Grid item (Related to #22368) - [ED-12415] #23085

✅ 🔗 🐞 Intermittent bg image loading issue in the first Loop Grid item (Related to #22368) - [ED-12415] #23085

ofmarconi commented Jul 17, 2023 •

edited by nicholaszein

ofmarconi commented Jul 18, 2023 •

edited

Grassmedia commented Jul 18, 2023

portrayaloflife commented Jul 27, 2023

nicholaszein commented Jul 30, 2023

portrayaloflife commented Jul 31, 2023

LorenaFlyy commented Jul 31, 2023

Grassmedia commented Jul 31, 2023 •

edited

Daveden2 commented Aug 9, 2023 •

edited

mateitudor commented Aug 10, 2023

mangotam commented Aug 11, 2023 •

edited

portrayaloflife commented Aug 18, 2023

ofmarconi commented Aug 19, 2023 •

edited

mateitudor commented Sep 1, 2023

micmiller-apptio commented Sep 18, 2023

ttec-mark-musante commented Sep 21, 2023 •

edited

Municornus commented Oct 9, 2023 •

edited

nicholaszein commented Oct 17, 2023

nicholaszein commented Apr 12, 2024

✅ 🔗 🐞 Intermittent bg image loading issue in the first Loop Grid item (Related to #22368) - [ED-12415] #23085

✅ 🔗 🐞 Intermittent bg image loading issue in the first Loop Grid item (Related to #22368) - [ED-12415] #23085

Comments

ofmarconi commented Jul 17, 2023 • edited by nicholaszein

Prerequisites

Description

Steps to reproduce

Isolating the problem

System Info

ofmarconi commented Jul 18, 2023 • edited

Grassmedia commented Jul 18, 2023

portrayaloflife commented Jul 27, 2023

nicholaszein commented Jul 30, 2023

portrayaloflife commented Jul 31, 2023

LorenaFlyy commented Jul 31, 2023

Grassmedia commented Jul 31, 2023 • edited

Daveden2 commented Aug 9, 2023 • edited

mateitudor commented Aug 10, 2023

mangotam commented Aug 11, 2023 • edited

portrayaloflife commented Aug 18, 2023

ofmarconi commented Aug 19, 2023 • edited

mateitudor commented Sep 1, 2023

micmiller-apptio commented Sep 18, 2023

ttec-mark-musante commented Sep 21, 2023 • edited

Municornus commented Oct 9, 2023 • edited

nicholaszein commented Oct 17, 2023

🔗 As this is the same issue as #22368, I am closing comments here so we can have a centralized place to discuss and update you.

nicholaszein commented Apr 12, 2024

📢 We're happy to announce that the issue you raised was resolved in Elementor Pro v3.19.0! 🥳

ofmarconi commented Jul 17, 2023 •

edited by nicholaszein

ofmarconi commented Jul 18, 2023 •

edited

Grassmedia commented Jul 31, 2023 •

edited

Daveden2 commented Aug 9, 2023 •

edited

mangotam commented Aug 11, 2023 •

edited

ofmarconi commented Aug 19, 2023 •

edited

ttec-mark-musante commented Sep 21, 2023 •

edited

Municornus commented Oct 9, 2023 •

edited