Support only during business hours : Monday to friday, from 8:30 am – 5:30 pm CEST

In regards to the COVID-19 situation

Your support team is currently doing their best to offer the best support possible despite the current COVID-19 situation. However during these exceptional circumstances, please note that you should expect a response time of 2-3 business days, until further notice.Rest assured that we will still do our best to handle your requests as soon as possible! Everyone stay safe and healthy! 😷

Serve scaled images?

This topic is resolved

Tagged: 

Viewing 12 posts - 1 through 12 (of 12 total)
  • Author
    Posts
  • Felix
    Participant
    • 8 Topics
    • 19 Posts
    @tacet22
    Up
    0
    ::

    Hi, I am trying to optimizing the site speed.
    GTMetrix tests are pretty bad. For the “Serve Scaled Images” score I got an F, so then I downloaded the Imagify. However, when I contacted their support, they said it’s a theme issue (not on their end).

    Your theme loads larger image sizes and resizes the appearance of those images through HTML and/or CSS attributes. This results in the browser downloading a larger image file than the dimensions actually applied displaying the image. See their response below. Can someone advise me on what I should do?

    A solution would be for the theme to provide a selection of different image sizes for the browser to choose from, or (if that’s not possible, for example for CSS background images), to serve the image in a smaller size that would fit its actual presentation.

    This type of issue is not related to Imagify; it should be addressed by the theme provider.

    Olivier
    Keymaster
    Themosaurus Support
    • 0 Topics
    • 2029 Posts
    @themosaurusrex

    Hi @tacet22,

    Thank you for your feedback.

    Which images are exactly the issue please? Could you point us to the areas in which images are too big for for their display?

    Thank you.

    Felix
    Participant
    • 8 Topics
    • 19 Posts
    @tacet22

    I’m assuming every image?
    I ran my website through GTMetrix because the theme is slow (there are other threads relating to this), and I’m trying to fix each issue. See the attachment for the result.

    GTMetrix says “Serve scaled images” is one of the key issues and then when I did more research on this, the recommendation was to use Imagify plugin. However, they said the issue is on the Theme’s end.

    Olivier
    Keymaster
    Themosaurus Support
    • 0 Topics
    • 2029 Posts
    @themosaurusrex

    @tacet22,

    Unfortunately, this is not helping us to find the root cause of your image issues. Please also note that if you have uploaded large images on your website, in your section widgets or in your hero for instance, this is forcing your browser to resize the image. This is not directly related with our theme as it has more to do with the uploaded content itself.

    Just to be sure, could you share the URL to the website pages that you’ve tested with GTMetrix with us please? You can post it in your next reply and mark it as private to keep this between us.

    Thank you.

    Felix
    Participant
    • 8 Topics
    • 19 Posts
    @tacet22
    This reply has been marked as private.
    Olivier
    Keymaster
    Themosaurus Support
    • 0 Topics
    • 2029 Posts
    @themosaurusrex

    @tacet22,

    Thank you for sharing this with us!
    As mentioned above, the issue is more related with the uploaded content than the theme itself. Our theme allows you to display large image that will be resized by your browser if those are too big but we encourage you to select smaller images and lighter image files. From what we see on your pages, you’ve uploaded very large images, which make your page loading time longer.

    In your case, the only solution is to force WP to crop your background image to a smaller image ratio set by our theme (1800x550px) and use those smaller images instead. This might not be ideal for some images as you won’t able to select the displayed image area unless you add third party plugins. The good news is that it should solve your issue with Imagify, allowing you to improve image loading and performances.

    To force this behavior, simply add the following code snippet to your website:

    /**
      * Resetting default image sizes for section widgets.
      */
    function gwangi_custom_change_section_widget_background_image_size() {
    	global $gwangi_grimlock;
    	remove_filter( 'grimlock_section_widget_background_image_size', array( $gwangi_grimlock, 'change_section_widget_background_image_size' ), 10 );
    }
    add_action( 'after_setup_theme', 'gwangi_custom_change_section_widget_background_image_size', 10 );

    To add this code snippet to your site, we recommend that you use a the Code Snippets plugin (https://wordpress.org/plugins/code-snippets/). If you have never activated this plugin, please read the following post:

    Adding Custom PHP Without Changing Your Child Theme

    Please also note that we don’t provide any theme customization. So, you shouldn’t expect other snippets from us unless it’s to fix an issue stemming from our own codebase. We always try our best to help theme users whenever we can and only provide code snippets out of courtesy to prevent them from waiting for the next update.

    Regards,

    Felix
    Participant
    • 8 Topics
    • 19 Posts
    @tacet22

    Hi, I followed these instructions, but GTMetrix still shows a score of F.
    I added the code snippet plugin (screenshot) and clicked saved changes
    I also have Imagify plugin.

    Any ideas on what I should do next?

    Olivier
    Keymaster
    Themosaurus Support
    • 0 Topics
    • 2029 Posts
    @themosaurusrex

    @tacet22, Do you have Grimlock Animate activated and do you wish to keep it ?

    Felix
    Participant
    • 8 Topics
    • 19 Posts
    @tacet22

    I deactivated it and there’s no improvement in speed.

    Olivier
    Keymaster
    Themosaurus Support
    • 0 Topics
    • 2029 Posts
    @themosaurusrex

    @tacet22 Thank you for confirming this, but I still don’t see any changes in the sizes of your pictures. Did you also remove the snippet shared above?

    Deactivating Grimlock Animate and using the snippet will let Imagify do its work. Furthermore, removing Grimlock Animate will remove extra JS scripts and CSS styles to load, which should minimize the size of your page.

    Olivier
    Keymaster
    Themosaurus Support
    • 0 Topics
    • 2029 Posts
    @themosaurusrex

    Please note that I took the liberty to move this topic to our Feature Requests forum. As creating a new option to force the appropriate background image size for the Grimlock section widgets could be a nice addition to our framework, we will implement this feature in the next update.

    Olivier
    Keymaster
    Themosaurus Support
    • 0 Topics
    • 2029 Posts
    @themosaurusrex

    Hi @tacet22,

    It took us quite some time but we’ve made two recent Grimlock updates (v 1.3.5 and v 1.3.6) that should improve this issue.

    After the update, you should find some performance improvements related with this issue. However, you might still be seeing the issue because your browser cache is showing you an older version of the page (browsers do that to load pages faster). To see that the issue is resolved you will need to empty your browser cache and reload the page. If you want to read more on what browser cache is and how to clear it, here is an article that might help you:
    https://www.lifewire.com/how-to-clear-cache-2617980

    Kindest regards,

Viewing 12 posts - 1 through 12 (of 12 total)

The topic ‘Serve scaled images?’ is closed to new replies.

Troubleshooting Demo Imports

You're trying to setup your theme but you're experiencing errors when importing the demo content? Or you've just followed the setup guide but your website doesn't look exactly like our demo? These are common issues for which you can find easy and quick fixes.

Happy With our Support So Far?

Feel free to review our theme on Themeforest! It helps us making our products more known to new potential customers, which allow us more time to improve the quality and develop new features. #SharingIsCaring ❤️

Discover MatchPress

Skip • Like • Super-Like

Add powerful matching features like Member likes, skips, super likes, conditional private messaging and much more.