Viewing 17 posts - 1 through 17 (of 17 total)
  • Author
    Posts
  • July 22, 2021 at 10:47 am #1311421
    Chris_85

    Hello,
    we use the full width slider of the avia layout builder. We would like to add the scrset attribute for the image in order to show smaller images on smaller displays. Unfortunately we haven’t found a solution for this yet. Do you have a solution for this? To improve the loading speed of the page this would be a very important topic. I look forward to hear from you.

    Best regards

    Chris

    July 22, 2021 at 3:02 pm #1311497
    thinkjarvis

    Hi Chris,

    I have assumed that you are using a FULL WIDTH slider and not the FULL SCREEN slider. The Full screen slider uses background css images and requires a different solution to below. I’ll send you some css if you need it.

    Unofficial response but something I have been working on for a while and have the following solution:

    Turn on Responsive images in the Enfold performance panel – This activates Srcset. The full width slider uses this function. As long as you have the right size thumbnails set up it will serve the smaller size images on different screensizes. Make sure you clear your cache.

    The default WordPress Srcset implimentation serves images per screen size width – So for a full width element – Fully optimised requires the thumbnail sizes below.
    On a 360px wide screen it will serve a 360px wide image.

    I personally use the Shortpixel Regenerate Thumbnails Advanced Plugin to add some extra sizes. It is free and compatible with Enfold.
    Please be CAREFUL if you remove other thumbnails as it may affect your site design depending on the other Enfold default sizes used throughout the site.

    I personally recommend adding or making sure the following sizes are covered:
    360px wide – Google speed testing – Small Mobiles
    450px wide – All other mobiles
    768px wide – Ipad Portrait
    1024px wide – Ipad landscape
    1440px wide – macbook pro/720p screens
    Upload size 1920px wide Native size – 1080p – (4K screens normally apply a zoom by default)

    If your slider has no minimum height set then this should automatically work as the image will scale in uniform.

    If you set a minimum height then you may need to upload a taller image to compensate as Srcset uses the screen width not the height to determine which image to serve. The image may become blurred on smaller screens as the image will be stretched to the min-height.

    • This reply was modified 3 years, 5 months ago by thinkjarvis.
    July 28, 2021 at 10:43 am #1312992
    Chris_85

    thanks for your answer!! I take a look and responsive images are activated in enfold settings. I also use the Full width Slider. But the Srcset-Tag is not loaded. (Screenshot). Any ideas?

    Unbenannt

    • This reply was modified 3 years, 5 months ago by Chris_85.
    July 28, 2021 at 11:37 am #1313008
    thinkjarvis

    Hi Chris,

    Post deleted I have given you wrong info. Please see new post below.

    • This reply was modified 3 years, 5 months ago by thinkjarvis.
    July 28, 2021 at 12:53 pm #1313020
    Chris_85

    Hi,

    thank you very much for your response.

    Can you send me a screenshot of this setting. I dont have it. i use the enfold version 4.8.3

    Thanks,

    Chris

    July 28, 2021 at 1:01 pm #1313021
    thinkjarvis

    I appologise I have given you wrong information.

    I was refering to Lazy load I forgot that Srcset is controlled globally.

    You only need to turn on the setting in the theme control panel.

    Enfold > Performance >
    Capture

    Note that it will only work if you have appropriate image sizes for it to downsize to.

    • This reply was modified 3 years, 5 months ago by thinkjarvis.
    July 28, 2021 at 1:12 pm #1313026
    thinkjarvis

    Make sure you have cleared your cache. It doesnt look like Responsive images is turned on in your performance panel in the screenshot you sent.

    If it doesnt work wait and see if one of the forum mods picks up your request for help.

    July 28, 2021 at 1:22 pm #1313033
    Chris_85

    Hi, thanks for your answer.

    i had acitvated the responsive Imgages in the global settings. I also have different image sizes to downscale imagesizes. But it is not working.
    I look forward to got some help with this request.
    Thanks

    July 28, 2021 at 1:27 pm #1313035
    thinkjarvis

    Can you try creating a new slider on a test page to see if there is an error with the current element?
    Use the same images and see if it works?

    July 28, 2021 at 4:09 pm #1313060
    Chris_85

    I also tryed this. There i have the same issue, no SCRSET Tag is added.

    Thanks,

    Chris

    August 2, 2021 at 4:23 am #1313789
    Ismael

    Hi,

    Thank you for the update.

    Would you mind posting the login details in the private field? We would like to check the plugins and the theme settings. Please make sure to upgrade the theme to the latest version, 4.8.5.

    Best regards,
    Ismael

    August 13, 2021 at 9:04 am #1316562
    Chris_85

    you can find the credentials in the private section. Plz. let me know how to use SCRSET in a slider full width…

    Thanks

    August 16, 2021 at 3:50 am #1316842
    Ismael

    Hi,

    Thank you for the info.

    Did you modify the slider shortcode files in the child theme? We tried to check it but the Appearance > Editor panel is not accessible. Please include the FTP details in the private field.

    What happens when the Imagify plugin is disabled? Please make sure to also temporarily disable the cache and minification plugins while testing the page.

    Best regards,
    Ismael

    August 16, 2021 at 10:51 am #1316931
    Chris_85

    Hi,

    i added the theme editor to wordpress. You can have a look now. I also deactivated the Plugin “imagify”.
    is the scrset function available by default for this type of slider?

    Best regards
    Chris

    August 17, 2021 at 4:57 am #1317040
    Ismael

    Hi,

    Thank you for the update.

    Yes, the scrset attribute should be enabled for the Fullwidth Easy Slider by default. Unfortunately, we are not yet sure why it is not working in the site. It works fine on our installation. We created a test slider and uploaded a large image (1920x1200px) but the srcset attribute is still missing. (see private field)

    Please remove the other Enfold theme (4.4.1) from the themes folder to rule out any theme conflict. We will check the site again afterwards.

    Best regards,
    Ismael

    August 17, 2021 at 7:57 am #1317105
    Chris_85

    Hi Ismael,

    that was the issue. i deleted the old enfold theme folder, than srcset was included.
    I wouldn’t have thought of that because the old theme folder was renamed and the theme was not active either. Strange why a conflict arises then?

    Best regards

    Chris

    August 18, 2021 at 6:14 am #1317254
    Ismael

    Hi Chris,

    Yeah, that is odd. But I am glad that it is finally working. Please let us know in another thread if you need anything else. We will close this one for now.

    Have a nice day.

    Best regards,
    Ismael

  • Author
    Posts
Viewing 17 posts - 1 through 17 (of 17 total)
  • The topic ‘scr-set Attribut for full width Slider’ is closed to new replies.