-
Posts
-
Hey guys,
Noticing a very weird issue with images in Enfold and the popular WP Retina 2x plugin.
Retina images works totally fine, as you can see by this code copied from my site (https://www.microstockman.com/adobe-stock-contributor-review/) :
<img class="avia_image lazyloaded" alt="Adobe Stock logo" title="Adobe Stock" height="100" width="355" data-srcset="https://www.microstockman.com/wp-content/uploads/2019/07/Adobe-Stock-355x100.jpg, https://www.microstockman.com/wp-content/uploads/2019/07/Adobe-S (Email address hidden if logged out) 2x" srcset="https://www.microstockman.com/wp-content/uploads/2019/07/Adobe-Stock-355x100.jpg, https://www.microstockman.com/wp-content/uploads/2019/07/Adobe-S (Email address hidden if logged out) 2x">However, if I want to add a link to that image using the ALB, then the code is simply:
<img class="avia_image " src="https://www.microstockman.com/wp-content/uploads/2019/07/Adobe-Stock-355x100.jpg" alt="Adobe Stock logo" title="Adobe Stock">And retina no longer works. Remove the link, and it works.
For now, I have left the link so you can see it doesn’t work, where as other images on the site (such as https://www.microstockman.com/microstock-photography-sites/) that don’t have links do work.
In addition, if I add an image NOT using the Image element in the ALB (just inserting it into a text block using the TinyMCE editor tools), such as the same Adobe Stock logo on this page: https://www.microstockman.com/microstock-agency-reviews/ then retina works, while having a link attached to it.
Seems is a problem with your image element messing up the code?
Using latest Enfold.
Thanks
Tim
Hey THP,
Thank you for using Enfold.
We are not really sure how the plugin applies the srcset attribute, so we can’t really tell you what’s the problem. Have you tried asking the plugin authors how the plugin applies the data-srcset attribute? The data-srcset attribute is missing in the image element, which is probably why it doesn’t work.
Best regards,
IsmaelHey guys,
Thanks for your reply.
I contacted the author and here is his reply:
Could this be incorporated into a future Enfold update, to ensure responsive, retina images are served? Your theme does claim to be Retina-Ready, which in most respects it is. But you would expect the image element to be as well.
Would love to hear your thoughts.
Thanks.
Hi,
Sorry for the late reply – but I’ve recently been tagged for this topic.
I’m currently working on a solution for Enfold to handle scrset and size attribute for images. As this will affect many parts and ALB elements of Enfold a first step (hopefully in the next release) will provide a basic implementation for manageing this and then we will implement it step by step for the images. Depending when Kriesi will make the next releases more and more elements will support it.
Check the changelog.
Best regards,
GünterHi @Gunter, Thank you for the reply.
It’s great to hear that you are working on a far reaching improvement to this, thank you very much for the update. I really look forward to seeing huge progress on this soon(ish).
Could I suggest you also test compatibility with the hugely popular WP Retina 2x plugin as you implement things?
Would love to see a roadmap of upcoming changes in general, it really helps to keep confidence in using Enfold for our client jobs high.
Regards
Tim
Hi,
Thank you for the update.
The srcset feature that we are planning to add in the theme is basically the same as what the plugin is doing. It will apply the srcset and sizes attributes to the image elements, so you probably don’t have to use that plugin once the new option is available.
Best regards,
IsmaelHi Ismael,
I think there might be some confusion between responsive images and retina images.
As I understand it, responsive images are a great start, but still are not Retina (or HiDPI) ready necessarily. These need to be appended with “@2x” at the end of the file name.
Please see here: https://meowapps.com/plugin/wp-retina-2x/ for more info.
But basically once you enable srcset on your Enfold image elements, then this plugin should take care of the rest.
I’m really keen to see your implementation of this.
Thanks again.
We’re running into this issue as well. What’s the recommended workaround until the fix is available?
Hey guys,
Any roadmap for these fixes?
One of your mods said….
“I’m currently working on a solution for Enfold to handle scrset and size attribute for images. As this will affect many parts and ALB elements of Enfold a first step (hopefully in the next release) will provide a basic implementation for manageing this and then we will implement it step by step for the images. ”
So now that 4.6 is out, is there any improvements in it on this? COuldn’t see any in changelog
Also, completely off topic, is the new 4.6 version compatible with WooCommerce 3.7? I saw no mention of it in the changelog.
Cheers
Tim
Hi,
think there might be some confusion between responsive images and retina images. These need to be appended with “@2x” at the end of the file name.
The plugin is actually using the srcset and sizes attribute to decide which image the page have to use based on width or pixel density descriptor. The “@2x” is an example of a pixel density descriptor.
// https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#attr-sizes
Any roadmap for these fixes?
The scrset feature is not included in the latest version v4.6. There’s no ETA yet — unfortunately.
Best regards,
IsmaelHi guys,
first of all I apologize if my english is not correct.
I’m writing this post, because I finally want to kwno: are there any news about srcset feature for Enfold ALB? I’m waiting for it since three years… when for the first time i bought the Enfold Theme.
By the way, the srcset appeared in WordPress Core since 2016… so four years ago, not yesterday, as you seem to imply.
And it’s not aboutonly retina tech or similiar, this concerns all devices that would load the pictures at different resolutions … the images in Enfold Elements are not loaded in the right size, but scaled for every device… And in 2020 it can be considered an issue, I’m sorry to said!
And Ismael you said:The scrset feature is not included in the latest version v4.6. There’s no ETA yet — unfortunately.
I think it would also be the time to put it in one of the best selling themes on Theme Forest, don’t you think so? Among other things, you declare it Responsive in Theme Forest, but the images in the ALB Elements do not rescale without the srcset, so the pages are slowed down while loading.
I complain.
I would like to receive and I’m waiting for an official answer from Kriesi, please.
Best regards
PaoloHi,
The feature is still under development, so it won’t be released any time soon because of different priorities. For now, you will have to use or install external plugins that adds srcset attribute to the images automatically. Unfortunately, you might not be able to find any plugin that is completely compatible with the sliders or color sections.
// https://wordpress.org/plugins/adaptive-images/
You can actually optimize the site or the pages even without adding the srcset attribute by compressing the images and by implementing basic optimization procedures. Please check this article for more info.
// https://kriesi.at/archives/scoring-100-100-in-google-pagespeed-insights-gtmetrix-pagespeed-and-yslow
Best regards,
IsmaelHi @Ismael and @Günter and team, as you can see I started this thread a year ago. Many others have made similar comments on many other threads.
It really saddens me to hear your latest reply.
I’m not sure how you can have different priorities to something so core in a modern web, and that Gunter was actually working on a year ago.
This is your product, so of course we can’t tell you what to do, but please, please listen to your customers. This feature will benefit every single Enfold user, whether they know it or not!
Perhaps if we knew what these ‘other priorities’ were we may try to understand. But at the moment it just feels like you are neglecting to keep the theme up to date with web standards – not to mention your competition.
I love Enfold and have 9 licenses for it in use. Please don’t take this as an attack, but as a plea for the Enfold team to listen to their customer base and communicate better with us.
Please, please, please reconsider your position on this essential part of the theme.
Hi,
I’m not sure how you can have different priorities to something so core in a modern web
We understand your concern, but the feature probably doesn’t get that much attention because we noticed that it’s still possible to have a fully optimized site even without adding the srcset attribute to the templates — please check the article above and scroll to the image optimization section. It’s an old article but the suggestions there should still work.
There are also available plugins out there that offers the same functionality or better, so it makes much more sense to allocate the development time to more significant features that will actually add more value to the theme and for the users.
Thank you for understanding.
Best regards,
Ismael
- The topic ‘Images with links not working with Retina’ is closed to new replies.