Images And Lazy Load - Question | JoomShaper

Images And Lazy Load

G

Gary

SP Page Builder 2 years ago

Using pagebuidler pro 3.8.9 on Joomla4.2.9 I have a number of users with iOS devices and Safari browser that only get gray boxes when loading pages created with pagebuilder. It seems that Safari has a problem with the "lazy load" functios and that creates the grey boxes. on certain imags. When I inspect those elemens i see that there is a tag as part of the image that says 'loading="lazy" ' and that tag is pervasive througout pagbuilders files. Now I know that lazy loading is supposed to load pages faster and that is a good thing, BUT when a majority of users with the Safari browser can't veiw the page, THAT is a big problem! How can i turn off or remove the "loading='lazy' tags from pagebuilder so that themajority of my users can use the site? There is no issue with all other browsers and I have suggested that those users change browsers, but iOS user being what they are, asking them to change something that comes with Apple devices does not go over well!

0
6 Answers
Paul Frankowski
Paul Frankowski
Accepted Answer
Senior Staff 2 years ago #109178

Hi Gary,

I heard that Apple is such a good manufacturer with a lot of satisfied users. But seriously It's not the first time to mess something up, and they tell webmasters that "it's a feature, not a bug".


Start with SPPB Options/Settings and disable Lazy Load there.

In SPPB 3.8 > Pages > Options (top right corner) > Lazy Load: Off.

In SPPB 4.x > Pages > Settings > Lazy Load: Off

info_728_2023.jpg

0
G
Gary
Accepted Answer
2 years ago #109281

Yes, that is the way it is SUPPOSED to work. But even with that off this part of the config.xml file is what causes the problem: <field name="lazyplaceholder"

        type="text"

        default="res.cloudinary.com/joomshaper/image/upload/v1582107175/placeholder.svg"

        label="COM_SPPAGEBUILDER_LAZY_IMG_PLACEHOLDER"

        description="COM_SPPAGEBUILDER_LAZY_IMG_PLACEHOLDER_DESC" 

        showon="lazyloadimg:1" />

        Thaat place holedr is what Safari sees and THAT is what the users get, regardless of what the lazy load is set at.

        NOW, here is what is contained in the database table "com_sppagebuilder" in the parameter field AFTER the LAZY LOAD is set to off:

{"production_mode":"0","gmap_api":"","ig_token":"{\"appId\":\"\",\"appSecret\":\"\",\"accessToken\":\"\",\"igId\":\"\"}","updater":"https:\/\/www.joomshaper.com\/updates\/com-sp-page-builder-pro.xml","fontawesome":"1","google_fonts":"0","lazyloadimg":"0","**lazyplaceholder":"https:\/\/res.cloudinary.com\/joomshaper\/image\/upload\/v158210717\/placeholder.svg"**,"disableanimatecss":"0","disablecss":"0","disable_og":"0","fb_app_id":"","disable_tc":"0","joomshaper_email":"[email protected]","joomshaper_license_key":"9b1ba702670dbcaedbe01b9ba2131de9"}            {"production_mode":"0","gmap_api":"","ig_token":"{\"appId\":\"\",\"appSecret\":\"\",\"accessToken\":\"\",\"igId\":\"\"}","updater":"https:\/\/www.joomshaper.com\/updates\/com-sp-page-builder-pro.xml","fontawesome":"1","google_fonts":"0","lazyloadimg":"0","lazyplaceholder":"https:\/\/res.cloudinary.com\/joomshaper\/image\/upload\/v158210717\/placeholder.svg","disableanimatecss":"0","disablecss":"0","disable_og":"0","fb_app_id":"","disable_tc":"0","joomshaper_email":"[email protected]","joomshaper_license_key":"9b1ba702670dbcaedbe01b9ba2131de9"}        

So the lazy load settings do not seem to have any affect on the settings in the database so certain image layouts are formatted and presented with them still on and in place.  All other browsers seem to handle this without problems and it is certainly possible that this is a small set of Safari users with older browsers that this affects.  That being said, turning the lazy load parameters completely off should still be an option.  Some of the addons in pagebuilder are likely just carried over form version to version without regard to how they handle the lazy loading of images.  I have researched this quite a bit and we could have a really lengthy discussion about it.  I would jst like to see the old options page returned where the placeholder image AND the lazy loading selection actually worked!
0
Paul Frankowski
Paul Frankowski
Accepted Answer
Senior Staff 2 years ago #109284

Even when you cleared Joomla cache you still have lazy code??

You didn't share any URL so I have to guess like in lotter.

Ping me on Sunday, I will be on event by next two days. But URL you can share even today.

0
G
Gary
Accepted Answer
2 years ago #109299

Joomla cache has nothing to do with it. It is the tag in the image from SpPagebuilder. the urls in www.archuletadems.org.
If you inspect the image at the top of the page, you will see the tag "loading="lazy" and lazy loading is swithced off in pagebuilder. If you inspect that same image in Safari, it will have the placeholder tag - https:\/\/res.cloudinary.com\/joomshaper\/image\/upload\/v1582107175\/placeholder.svg - and thje user will only see a big gray square! The pagebuilder addon used to present that iage is "IMAGE LAYOUTS" and there is NO setting in that addon for "lazy loading", but that section tags the imge with both the lazy loding on AND the image placeholder. Browsers other than Safari do not see the placeholder but they ALL see the lazy loading tag!

0
AC
Angela Copple
Accepted Answer
10 months ago #177558

Did you ever figure this out? It is the same issue I'm having.

0
Paul Frankowski
Paul Frankowski
Accepted Answer
Senior Staff 10 months ago #177561

Angela, You don't have to use Lazy from SPPB, instead of you can use settings from JCH_Optimize (Free/Pro) - it may work better for you, also becuase it's used for whole site, not only SPPB component, and has tons of speed up settings.

0