Load bad value for src attribute

Resolved juanelpepito
(@juanelpepito)

4 years, 6 months ago
Hi, I use free version of smush and its great! Thanks! But I have a problem with specific images. I use a custom field to upload an image that will be use as placeholder when some post haven’t any thumbnail.
Especially for theses default thumbnail images, I think smush is not loading the right src attribute. Here is what I get when I inspect:
```
<img width="1024" height="682" alt="" src="image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==" />
```
And there is a blank where my placeholder image should be.
Can you help?

Here is my code to call this image:
```
$defaultThumbnail = get_field('default_thumbnail', 'options');
echo !empty($defaultThumbnail) ? '<img src="' . $defaultThumbnail['sizes']['large'] . '" width="' . $defaultThumbnail['sizes']['large-width'] . '" height="' . $defaultThumbnail['sizes']['large-height'] . '" alt="' . $defaultThumbnail['alt'] . '" />' : 'null';
```
- This topic was modified 4 years, 6 months ago by juanelpepito.
- This topic was modified 4 years, 6 months ago by juanelpepito.

Viewing 8 replies - 1 through 8 (of 8 total)

Plugin Support Imran – WPMU DEV Support
(@wpmudev-support9)

4 years, 6 months ago

Hello @juanelpepito !

Hope you’re having a good day!

It looks like this may be related to the Lazy Loading feature – I’m guessing that by the fact that the src becomes replaced with the gif “spinner” we use while the images are being loaded in the background.

Please do a quick test with Lazy Loading deactivated and see if that changes anything.

Please also make sure that you don’t have any other lazy loading plugins/features enabled besides the one with Smush – this is to avoid a potential conflict.

If the test shows that this is caused by Lazy Loading and the issue persists when other lazy loading features are enabled, you can add an unique class to the elements and exclude those images by that class on Smush >> Lazy Load.

Kind regards,
Pawel

Thread Starter juanelpepito
(@juanelpepito)

4 years, 6 months ago

Hi Pawel,
Thanks a lot for your answer. Indeed if I disable the Lazy loading, everything comes back to order. I already tried to add the class .default-thumbnail to exclude those elements from the lazy loading feature but I doesn’t work.

It works when I disable some pages though. But it is a bit of a pity to do that cause my default thumbnail image can be on severals pages.

Kind regards,
J
Plugin Support Laura – WPMU DEV Support
(@wpmudev-support8)

4 years, 6 months ago
HI @juanelpepito

You mentioned that you tried to add class to exclude from lazy load. Did you add the class via your code similar to this?
```
$defaultThumbnail = get_field('default_thumbnail', 'options');
echo !empty($defaultThumbnail) ? '<img src="' . $defaultThumbnail['sizes']['large'] . '" width="' . $defaultThumbnail['sizes']['large-width'] . '" height="' . $defaultThumbnail['sizes']['large-height'] . '" alt="' . $defaultThumbnail['alt'] . '" 
 class="default-thumbnail" />' : 'null';
```
If yes, then adding the

.default-thumbnail

to exclusions in Lazy Load settings should work. Unless there’s some more of “dynamic action” performed on these images, like some other lazy load or other optimization or image “effect” JS applied to it. Is there or is it really a “static” image after it’s already generated by this code of yours?

Could you share a link to some page where this could be seen in action (may be a testing site/page)? A look at “real life case” could help actually.

Best regards
Adam
Thread Starter juanelpepito
(@juanelpepito)

4 years, 6 months ago

Thanks a lot,

Indeed the class is added exactly the way you describe it. Then in the admin, in the Lazy Loading section, I add .default-thumbnail in the Classes & IDs block.

Staging link can be found here: https://hiros.alwaysdata.net/en/agenda/2022/ (pw: geheim)

Thanks,
J

Plugin Support Laura – WPMU DEV Support
(@wpmudev-support8)

4 years, 6 months ago

Hi @juanelpepito

Thanks for sharing that!

I actually noticed that only know but that’s ACF field that you are fetching the data from, right? The generated code looks fine but just to make sure – if it’s an “image” type field then to what “format” it is set in ACF? Is it set to just return raw URL or rather entire image code?

Also, your code – is it added directly in some template file or it’s via some additional function that executes it via some action/filter hook?

Best regards,
Adam

Thread Starter juanelpepito
(@juanelpepito)

4 years, 6 months ago

Code is written in template directly. For instance, in the page I shared, I use page-agenda.php.

Indeed, I use ACF image field to retrieve the image and my output is an array. But I also tried with a static image, already saved on the server, same issue.
Plugin Support Imran – WPMU DEV Support
(@wpmudev-support9)

4 years, 6 months ago
Hello @juanelpepito !

Hope you’re having a good day!

This is odd then and unexpected behaviour. Could you send us a download link to the theme (and parent theme if needed) so we can check this on a test site of ours? If so, please upload the zips to a cloud drive and share the details using our contact form:

https://wpmudev.com/contact/#i-have-a-different-question

Please use the template below:

Subject: “Attn: Pawel”

Message template:
```
– Link to your WordPress site
– Download link to file on a cloud drive
– Link back to this thread for reference (ex. https://wordpress.org/support/topic/ticket-title/)
– Any other relevant URLs/info
```
To ensure we don’t miss this please let us know here once you’ve submitted the form.

Kind regards,
Pawel
Thread Starter juanelpepito
(@juanelpepito)

4 years, 6 months ago

Thank you for your answer. I’ve submitted the files and infos through the contact form.
Thanks,
J

Viewing 8 replies - 1 through 8 (of 8 total)

The topic ‘Load bad value for src attribute’ is closed to new replies.