This guide explains how to use Smush Pro’s Image Optimizing features to compress, resize, and share all your images without sacrificing quality. Use the Index on the left to quickly locate usage guidance on specific Smush features.
If you haven’t installed Smush yet, then you should visit the Smush Pro page where you can explore the plugin’s many features, and where WPMU DEV members can install Smush Pro directly to any connected site.
Advanced users can leverage some simple WP-CLI commands to optimize, list, and restore images with Smush Pro. See this API doc for more info.
Are you digging into Google’s new Core Vitals standard for measuring web experience? Check out how to Optimize Elementor Using R.O.S.E. to get the best performance you can.
To get the best results for optimization, we recommend utilizing both Smush and Hummingbird together. This is explained – in the context of sites running with Elementor – in our blog post on how to Optimize Elementor with Smush and Hummingbird.
Using WPBakery’s Impreza theme? Check out our blog on Optimizing WPBakery’s Impreza Theme with Smush and Hummingbird for some inside information on how to use these two world-class plugins for maximum performance.
Using the Avada theme? Check out our blog on How to Speed Up and Optimize Avada for Free Using Our Smush and Hummingbird Plugins for details on how to make the most of these two world-class plugins.
Using the Astra theme? Check out our blog on Optimizing Astra with Hummingbird and Smush for details on how to boost this lightweight theme’s performance even further.
Pro level visuals don’t have to come with a performance penalty. Check out our blog post on How to Speed Up Slider Revolution in WordPress for tips on using Smush and Hummingbird to showcase your dynamic content with maximum efficiency.
8.1 DashboardCopy chapter anchor to clipboard
The Dashboard reports your Smush stats and provides an overview of enabled features.
8.2 Bulk SmushCopy chapter anchor to clipboard
The Bulk Smush feature allows you to apply all your enabled features to any uncompressed images with a single click. You can Bulk Smush an unlimited number of images at a time with the Pro version and up to 50 images with one click on the free version.
Note that, on WordPress Multisite networks, Bulk Smush is not available by default and needs to be enabled in the Network Admin Smush settings. Once it has been enabled, Bulk Smush will be available on the subsites.
Our blog post, How To Bulk Optimize Images With Smush, explains how to get the most out of the bulk optimization feature.
The Bulk Smush module will alert you to uncompressed images in your Media Library. Click Bulk Smush Now to compress all un-Smushed images. Alternatively, click Media Library to open the library and compress images individually as described in Media Library below.
Additionally, you can trigger an immediate scan of your image library at any time by clicking Re-Check Images.
With Automatic Compression and all other features enabled, you may seldom need to Bulk Smush as your images will be compressed during the upload process.
When activated, Smush adds features to your Media Library that allow you to filter images by Smush status, selectively compress images and view the Smush stats associated with each image.
Use the Smush filter to display all images, just those that were ignored or those not yet processed. Smush does not compress video or Gif files. Any other ignored image types could indicate that you are not making full use of all available compression features.
Smush adds a column to the Media Library indicating whether an image has been compressed or not. Images that have not been processed by Smush can be compressed by clicking the Smush command for that image.
Once an image has been processed, you can click the View Stats link to reveal a list of the thumbnail copies WordPress has created for that image, along with the sizes of those files before and after compression.
8.2.1 Bulk Smush SettingsLink to chapter 2
The Settings features are your primary optimization tools.
Our blog post, How To Ace Google’s Image Page Speed Recommendations With Smush, focuses on Smush features that directly impact your Google Page Speed score.
The Image Sizes feature allows admins to choose which thumbnails they want to be compressed and which ones Smush should ignore.
In order to serve scaled images, WordPress generates multiple copies in different sizes of every uploaded image. Some themes and plugins also require copies. These copies, called thumbnails, can add up quickly, so we recommend you compress all thumbnails.
WordPress duplicate images are a net positive for most users – a simple exchange of storage space for faster page speed. WordPress pros, on the other hand, achieve page speed in many ways and the benefits of duplicate images may be minimal. Follow the Learn More link for guidance on preventing WordPress from creating multiple copies of your uploaded images.
Click Custom to reveal a list of the thumbnail sizes that WordPress is creating on your site. Select the checkboxes for the images you want to be compressed, and leave those you don’t want compressed unchecked. The image sizes you select will be compressed automatically upon upload if you have Automatic Compression enabled.
If your site is hosted on either a Business or an eCommerce plan at wordpress.com, and you have the Site Accelerator option enabled in the Jetpack plugin, you will not be able to bulk smush your images. That is because that feature in Jetpack offloads image thumbnails to wordpress.com’s own CDN and Smush cannot fetch them to optimize them for you.
Users of the free version of Smush on wordpress.com sites will see a notice like this when that Jetpack feature is enabled:
If you are a Smush Pro user, you will still be able to optimize your original full-size images if you enable the Smush my original full size Images option below.
Click the slider to enable automatic compression, and Smush will compress every image copy WordPress generates as soon as it’s created. Smush will only automatically compress the image sizes you selected in the Image Sizes setting above.
Our well-designed multi-pass lossy compression reduces file sizes significantly by stripping out as much data as possible without reducing image quality. Click the slider to enable multi-pass lossy compression.
If yours is a photography site, you may want to retain the metadata that digital equipment frequently attaches to your images, but for most sites, it is entirely unnecessary. Click the slider to enable Smush to strip unnecessary metadata from all images.
As of WordPress 5.3, large image uploads are resized down to a specified max width and height. If you require images larger than 2560px, you can override this setting here.
Original Images (Smush Pro only)
- Smush my original full-size images – As of WordPress v5.3, every image that gets uploaded will have your normal thumbnail outputs, a new max sized image, and the original upload as a backup. By default, Smush will only compress the thumbnail sizes that your theme outputs, skipping the new max sized image. Enable this setting to include optimizing this image too.
- Store a copy of my small originals – As of WordPress v5.3, full-size images above a certain size (2560px by default) will be stored as originals, while a new max sized image will be created. However, if the uploaded image is smaller than the specified size WordPress won’t create a backup for it. Enable this setting to ensure you always have backups of all your image uploads.
PNG to JPEG Conversion (Smush Pro only)
Click the slider to enable this feature and Smush will convert PNG files to JPEGs, but only when doing so results in a smaller file size.
8.3 Directory SmushCopy chapter anchor to clipboard
Your Uploads folder is the primary folder for images, but images can reside elsewhere. Plugins that create their own image copies, for example, may store those images in the plugins folder. Directory Smush finds uncompressed images stored outside the uploads folder and allows users to compress those images if they wish.
Activate the feature, then click Choose Directory to reveal a list of directories where uncompressed images are located. Click the arrow to the left of any directory to reveal a list of subdirectories, and click the arrow to the left of any subdirectory to reveal the images within.
Click the checkbox next to any directory or subdirectory to compress all the images they contain or select images individually if you wish, then click Choose Directory to begin compression. If several directories are selected, the process could take several minutes.
8.4 Lazy LoadingCopy chapter anchor to clipboard
Lazy loading retrieves only the data necessary to display what is actually being viewed at any given moment and can have a dramatic impact on page speed. The heavier your site is with images, the greater the benefit. The feature’s settings allow you very specific control over what file types are lazy-loaded, as well as when and where that occurs.
To enable lazy-loading, select Lazy Load in the Smush menu and click Activate.
You can choose which media types are lazy-loaded and which are not by selecting or deselecting the file type checkboxes.
You can choose where lazy loading is applied by selecting or deselecting the out location checkboxes.
Display & Animation
You can choose how images appear as they scroll into view by selecting an animation effect, a placeholder image or no effect at all.
Images will load first and then begin to fade in. Set the duration of the fade-in milliseconds by entering how long the fade should be from start to finish into the Duration field. The fade will begin as soon as any part of the image scrolls onto the screen. You can delay the fade if you want the animation to occur with the entire image in view by entering the delay time in milliseconds into the Delay field.
Choose the Spinner if you want a spinner to display while images fully load. Use the uploader to upload a custom spinner if you wish.
If you want a custom placeholder image to display while images load, use the uploader to upload your image. There are two images already present that you can choose to display as well. You can add a background color if you wish by using the color picker provided. Of course, you can simply choose None and containers will remain empty until images are fully loaded.
You can choose which post types use lazy loading and which ones don’t by enabling or disabling the slider for each post type.
Post, Pages, URLs, Classes and IDs
Disable lazy loading for individual URLs by entering the URLs into the field provided, one URL per line. You can do the same with classes and IDs by entering them into the field, one class or ID per line.
By default, the scripts required to support a page’s functionality are placed in the footer to facilitate faster page speed, but there may be times when you need scripts to load early. Choose whether scripts load in the header or footer by clicking the corresponding button.
NOTE: Your theme must be using the wp_footer() function for this feature to work. The function should be located in your wp_include folder, or you can simply contact your theme’s developer and inquire about whether the function is present.
The lazy load feature is not available for background images.
Native lazy load
Click the Enable native lazy loading toggle to enable support for native browser lazy loading.
In some cases, this can cause the Google PageSpeed audit to fail the “Defer offscreen images”. Disable native lazy loading rectify this.
If you are using W3C’s validation tool, you may experience errors due to No Script on your pages. Click on the Disable Noscript toggle to avoid this issue.
If you no longer want to use the lazy load feature, you can deactivate it at any point by clicking Deactivate.
8.5 CDN ProCopy chapter anchor to clipboard
One of the major factors that can make your site slow is the distance your content has to travel between the hosting server and the location of the visitor viewing your site. Generally speaking, the further the location, the longer your site will take to load. A chief value of CDNs is that they pre-position your content in servers around the world thereby reducing the distance your content has to travel no matter where a visitor is located. Check out our CDN overview video for more information.
A valid SSL certificate installed on your domain is required for the CDN to function without error. If you are using Cloudflare and getting Error 526: Invalid SSL certificates, you’ll want to review Cloudflare’s help doc here to resolve the issue.
The first load of any image from the CDN will be a bit slower than you might expect. This also occurs when an image is queried from a new location where the CDN hasn’t yet cached it. This is because the CDN will first send the image to the Smush API to optimize it, then it is served to the user’s browser. This results in a slight delay, but it happens only once per image per location.
To enable the Smush CDN, select CDN in the Smush menu and click Get Started.
The Smush CDN consists of 40 terabytes-per-second servers located in 45 locations around the world. Closer servers mean faster speeds and faster speeds mean better page rank. Our CDN also ensures that a larger number of users can visit your site at the same time, without causing delays in content delivery.
Note: Enabling the CDN will have no impact on the Bulk Smush or Directory Smush features, as those run independently from the CDN.
Supported Media Types
Smush CDN can serve the following media types: JPG, PNG, GIF, and WebP (SVG format is not supported).
Note: If you are trying to serve large GIF images on your site, they may timeout. If you experience this issue, try to replace the large GIFs with smaller ones or consider using a different file format.
The CDN does not currently support videos. We recommend you consider a third-party provider specializing in video hosting and that you embed the videos into your posts and pages.
If you are using the WP-Retina 2x plugin and also want your retina images to be served via the Smush CDN, you’ll need to add the following constant to your wp-config.php file, just before the line that says “That’s all, stop editing“:
define ( WP_SMUSH_CDN_DELAY_SRCSET, true );
When enabled, background images that have been declared with CSS will be served from the CDN whenever possible.
For this feature to work, your theme’s background images must be declared correctly using the default wp_attachment functions. Non-media library uploads can still be compressed using the Directory Smush feature, they just won’t be served from the CDN.
Click the slider to enable Smush to serve your background images from the CDN. When disabled, background images will be served from either your primary server, which we do not recommend, or from a third party if you’ve invested in one.
Note that the Smush CDN is able to serve background images only if they are served via the
<img> HTML tag or via an inline CSS style at a
<div> or when declared in a
<style> HTML tag. The Smush CDN does not serve background images added to your website in a CSS stylesheet.
The Smush CDN will serve background images using the following methods:
It will not serve background images using the following method:
Right-click on your background image and use the browsers built-in inspector to see what method your theme/plugin is using to serve your background images. If you need help contact our 24/7 live support team.
Improperly-sized images can impact page speeds, and this feature allows the CDN to automatically resize any images that do not fit their containers. This resizing occurs when the images are served and has no impact on the size of the original image.
How Automatic Resizing works
Every image served to the user’s browser gets a sizes attribute with a max-width as defined by the content_width in your active theme. For example, if your theme defines the content_width as 1000px, then that would be the largest image size served to the user’s browser, even if the original image is larger. If the original size of an image is smaller than the content_width, then the largest size of the image served will be its original size.
The image below illustrates what you might see in your browser’s developer tools for the example above. The srcset contains several possible image sizes that can be served depending on the browser’s viewport size. But even though the original image in this example has been scaled to 2048px wide, the max-width that will be served is 1000px because that’s what is defined in the theme for the content_width.
Note that if you hardcode the width of an image directly in its HTML like
< img width="800" src="image.jpg" / >, then that width attribute would override the srcset and that would be the image size served to the browser, regardless of what is set for the content_width in the theme. You would see that width attribute appear in the Styles section of your browser’s developer tools as
If you resize an image via CSS, that would of course affect the image appearance on screen, but it would not affect the sizes available to the browser in the image srcset.
As an example of the above, let’s say your theme defines content_width as 1000px, and you have an original image that is also 1000px wide, but your stylesheet contains CSS to adjust the width of the image to 90%. The image will appear at 900px on screen, but the image sizes attribute will still have 1000px as the max-width. So that 1000px image would still be the image size served, which would then be resized by your CSS. The reason for that is that by the time the CSS loads, the image has already been loaded in the browser and its srcset defined.
Note that if your theme does not define the content_width, or if it is defined incorrectly, then the largest image size in the srcset will be the plugin default of 1920px, unless you have set a smaller size in the Image Resizing option in Smush. If you set a size smaller than your theme’s content_width in Image Resizing, then that would be the largest size served to the browser for your full_size images.
Smush can automatically convert and serve your images as WebP to compatible browsers.
We’ll detect and serve WebP images to browsers that will accept them by checking Accept Headers and gracefully fall back to normal PNGs or JPEGs for non-compatible browsers.
Click the Enable REST API support toggle to allow Smush to automatically replace image URLs when fetched via REST API endpoints.
You can disable the CDN feature by clicking Deactivate.
Excluding Images from the CDN
There may be times when you wish to exclude one or more images from the Smush CDN. For example, full-screen images in a slider getting resized by the Automatic Resizing option.
While there is no option in the plugin itself to exclude specific images from the CDN, there is a filter that can be used to achieve this:
The filter can be used in your active theme’s functions.php file, or in a mu-plugin uploaded to your site. For more on using mu-plugins, see our Installing Mu-plugins documentation.
To exclude only a single specific image from the CDN, use this code and adjust the image URL in the $src variable:
To exclude multiple images from the CDN, use the following code instead. Adjust image URLs in the $skip_images array and add/remove as needed (note only the last entry in the array should not have a comma at the end).
Smush CDN cannot fetch images from a password-protected site. Since the Staging environment for WPMU DEV hosted sites is always password-protected, Smush Pro will automatically serve media from the local server when active in a Staging environment.
If you move your Staging files into Production, your Production environment’s media will automatically be served from the Smush CDN.
8.5.1 Bandwidth and UpgradesLink to chapter 5
10GB CDN bandwidth is available on all WPMU Membership plans, except for the single Hummingbird plan.
Of course, you can always purchase more CDN bandwidth that best suits your needs. Check out our CDN plans below.
- 50GB – $5/m
- 100GB – $10/m
- 250GB – $20/m
- 500GB – $30/m
- 1TB – $50/m
- 5TB – $200/m
- 10TB – $350/m
Smush CDN bandwidth plan can be upgraded or downgraded at any time.
For more information about tracking bandwidth usage and guided instructions for increasing and checking your plan, visit the Smush section of our CDN usage documentation.
8.6 Local WebP ProCopy chapter anchor to clipboard
The Local WebP feature in Smush Pro enables you to serve images from your Media Library in next-gen WebP format, without relying on the Smush CDN.
Note that once you have configured this feature, you will need to run the Bulk Smush again for your existing images to get a WebP version created for each one.
This feature only works for images in your Media Library; it cannot create .webp versions of images located in other directories.
When you run Bulk Smush, this module will create a /smush-webp/ folder in the wp-content directory that replicates the structure of your /uploads/ folder, and will create and store .webp versions of all your images there.
The server rules you’ll configure below will take care of searching for those newly created next-gen format images inside that folder and serving them to your site. If there’s no WebP file for a specific image, the original JPEG/PNG gets served.
Local WebP conversion is an awesome alternative to using the CDN. For a quick and comprehensive guide to the local WebP feature and how to set it up, check out our blog on Smush Local WebP Conversion.
To enable local WebP, select Local WebP in the Smush menu and click Get Started.
When first enabled on a site that is not hosted by WPMU DEV, the top section in the module will display a Status reminder that server configurations haven’t been applied yet.
This same Status message will appear if the plugin does not detect the required rules where it expects to find them once you’ve configured things. So if you do still see that message, you’ll want to double-check your configuration.
Once the configuration rules have been applied correctly as detailed in the settings below, the Status indicator will change to the following:
If your site is hosted with WPMU DEV, the required rules will be configured for you automatically, and you’ll see this Status message appear there instead as soon as you enable the module:
As the Status message states, no further actions are required to set up local WebP conversion in terms of implementing this feature on your server. However, you will still be required to run Bulk Smush again to ensure that WebP versions of your existing images are created.
The Supported Media Types section simply indicates the media types that will be converted to WebP. Currently this feature supports .jpg and .png image formats.
8.6.1 ConfigurationsLink to chapter 6
Smush Pro will try to automatically detect the type of server running your site (Apache/Litespeed or Nginx), and display that here. If the detected type is incorrect, change it manually to get the correct rules to display below.
This section will display the needed rules according to the server type selected above. Note that rules can be applied automatically for Apache/Litespeed servers only. Nginx servers require that the rules be added manually to the configuration file.
Is your WordPress site installed in its own directory? If so, be sure to review WordPress in its own directory below.
Once you have added the appropriate rules for your server type as detailed below, click the Re-Check Status button at the top-right of the module.
You should then see a confirmation message in the Status section telling you things are configured correctly, along with a reminder that you will need to run the Bulk Smush tool to convert all your existing images to WebP format.
If the Automatic compression option is not enabled in the Bulk Smush settings, the Status message will display a reminder that you may want to enable that.
Note that it may be possible that your server has difficulty serving the webp images, even if the rules have been correctly applied and you have run the Bulk Smush tool to convert your images. In this case, you’ll see the following status message appear and you’ll want to contact your hosting provider for assistance.
If your server type is Apache, try the Automatic method first. Click the Apply Rules button to have the needed rules added to the .htaccess file located in the root directory.
If the Automatic method does not work properly for you in your setup, you can switch to the Manual option and add the displayed rules to your .htaccess file yourself. The rules should ideally be added at the top of the .htaccess file located in the root directory of your WordPress install.
If neither the Automatic nor the Manual methods work for your setup, try the following Troubleshooting steps as laid out in that section.
If you have access to vhosts.conf or httpd.conf, try this:
- Look for your site in the file and find the line that starts with <Directory> – add the code above that line and into that section and save the file.
- Reload Apache.
- If you don’t know where those files are, or you aren’t able to reload Apache, you would need to consult with your hosting provider or a system administrator who has access to change the configuration of your server.
If your server type is Nginx, the required rules must be added manually to your configuration file following the instructions given in that section.
If you do not have access to your NGINX config files you will need to contact your hosting provider to make these changes.
If your setup is running Nginx as a proxy for Apache, the Apache/Litespeed rules may not work in .htaccess, and you’ll want to add the Nginx rules manually instead.
Nginx & Apache (reverse proxy)
If your host uses a hybrid setup that runs both Nginx and Apache (such as Cloudways or Nexcess), your images would most likely be cached and served via Nginx. So, in order to use Smush’s Local WebP feature, you or your host’s support team need to make some adjustments on the servers:
- Exclude image extensions from Nginx rules so those files are now served via apache.
- Go to Smush > Local WebP and follow the instructions to add Apache rules.
- Clear all cache and refresh your page.
Note: if you tried the Auto method at Step 2 and after clearing cache, the feature is not working, try adding rules to your .htaccess file following the Manual instructions.
Revert WebP Conversion
If you need to delete the .webp files from your server for any reason, if your storage space is reaching its limit, for example, you can delete them all with a single click. Click the Delete WebP Files button in this option to completely wipe them off your server.
Note that this option does not delete any .webp files served via the Smush CDN; only the image files created with this module.
A confirmation modal will pop up asking you to confirm the action. Click the Delete button to start the process.
Once all WebP images have been deleted, you’ll see a confirmation notice at the top of your screen.
If you wish to deactivate this module for any reason, simply click the Deactivate button and your regular .jpg & .png images will be served instead of the converted .webp images.
Clicking this button will create a disable_smush_webp file inside the /smush-webp/ folder which is checked in the server rules you already added. If that file exists, the original JPEG/PNG images will be served. If you enable the feature again, that file gets deleted and .webp images are served once again.
This can be super-handy when you need to do some troubleshooting and don’t want to delete all your .webp files.
8.6.2 Verifying WebP OutputLink to chapter 6
Unlike the WebP Conversion option in the Smush CDN, you won’t see the .webp format appear in source code, as the images are not served via a CDN with this feature.
Instead, if you want to verify that images are indeed served as webp, you’ll want to pop open your browser’s developer tools and click on the Network tab. Then reload the page to get fresh data in there and check the Response Headers for any image. If you see “content-type: image/webp” there, that tells you that the browser is indeed serving up the webp version of the image.
8.6.3 Local WebP IntegrationsLink to chapter 6
Note that if the Amazon S3 Integration is active in Smush Pro > Integrations, images that are offloaded to AWS will not be served in .webp format with this module. Only locally stored images will be served in .webp format. The Status message at the top of the module will display a reminder of this:
8.6.4 WordPress in its own directoryLink to chapter 6
When you install WordPress in its own directory, it inherits the DOCUMENT_ROOT of the parent directory. So if, for example, your WordPress is installed in a directory called “mysite” inside “public_html“, the document root of that site would still be public_html, not public_html/mysite
The Local WebP feature in Smush Pro will display the rules it needs with what it sees as the document root (public_html in the above example), and you would need to adjust those rules in a few places to include the directory where your WordPress is installed.
The examples below show where the rules need to be adjusted for each server type. For each instance where you see SUBDIR_HERE before wp-content, change SUBDIR_HERE to the actual directory name where your WordPress is installed.
The rules for Apache/Litespeed servers need to be adjusted in 3 places, as follows:
The rules for NGINX servers need to be adjusted in 2 places, as follows:
8.7 IntegrationsCopy chapter anchor to clipboard
Click the slider to add Smush Stats to Gutenberg blocks. When enabled, a Smush Stats category is added to the page and post editors and appears in the Blocks tab of any post or page containing an image. Click any image on the page to see sizes available for that image, allowing you to choose the smallest file that meets your needs on that page.
WPBakery Page Builder
When you add images at custom sizes using the WPBakery Page builder’s editor interface, it does not actually save a thumbnail copy of that image at that custom size. Rather, it creates those image sizes on-the-fly as the image is requested in the browser.
Enable this feature to ensure all such custom-sized images added via the page builder are also optimized when they are served to the user’s browser.
Amazon S3 (Smush Pro only)
If you are using S3 to store images and WP Offload Media to manage the uploads, then enable this feature and Smush will compress any images contained in your S3 buckets, significantly reducing your cloud storage usage. This feature works together with Automatic Compression, so be sure to have that feature enabled in the Settings tab.
If you wish to offload your existing media library content to your Amazon S3 bucket using the WP-Offload Media plugin, note that you will need their Pro version for that feature; the free version can only offload media uploaded after that plugin is installed on your site. If you need help setting up the integration, there is an excellent walkthrough available on the WP-Offload site here: https://deliciousbrains.com/wp-offload-media/doc/amazon-s3-quick-start-guide/
NextGen Gallery (Smush Pro only)
If you’re using NextGen Gallery to manage your image galleries, then enable this feature to add Smush Pro commands and stats to the NextGen interface.
When enabled, a column is added to the Gallery Manager showing the filesize reduction Smush was able to achieve with each image. The NextGen integration also adds a Smush button to the manager so unSmushed gallery images can be compressed and a Restore button so users can return compressed images to their original states.
8.8 ToolsCopy chapter anchor to clipboard
The Smush tools are additional features to help improve your site management. The tools currently available are:
Image Resize Detection
The Image Resize Detection tool conveniently highlights any images that are either too large or too small for their containers. This is especially helpful to ensure that you are consistently delivering high-quality images in your galleries, and lowers the risk of you unknowingly serving blurry undersized images. Learn more in the video below.
Click on the Detect and show incorrectly sized images toggle to enable this feature and click Update Settings to save your changes.
If this is enabled, when you view your site on the front end, you will notice an Image Issues section in your right sidebar.
NOTE: Only site administrators will see this information and the front end will remain unchanged for any visitors.
Both oversized and undersized images will be listed with the actual size of the image in a yellow bubble and the recommended image dimensions in a green bubble. Hover over each numbered block for a note recommending the ideal image size for that container, or click on it to be redirected to the image in question. The image that is associated with the numbered block you just clicked will flash once with a gray cast to indicate that it is the image you have selected.
If all the images on the page are the correct size or there are no images on the page, you will see a note stating that All images are properly sized under the same Image Issues section.
Use the Bulk Restore feature to restore your image thumbnails to their original format. This tool can be useful if you make any mistakes with your images and wish to revert them back to their original state.
Note that you need to have the Store a copy of my full size images feature enabled in the Bulk Smush Settings to be able to restore your images.
The Bulk restore feature will only work to restore the originals for images that have been uploaded to the /uploads/ directory via the media library. This feature will not restore any images that have been optimized using Directory Smush. If you need to restore optimized images in a directory other than the /uploads/ directory, you will need to restore those manually.
The Bulk Restore tool uses the original image to restore the thumbnails. This means that if your original image has been compressed by Smush, the quality of the restored thumbnail may be worse than its original state. To change whether or not your original images are compressed, you can enable or disable the Smush my original images feature in your Bulk Smush settings. More information on changing Bulk Smush settings can be found in the Bulk Smush Settings technical document.
Click the Restore Thumbnails button to start the restoration process.
You will then be met with a confirmation request. Click Confirm to follow through with the restoration. Alternatively, click Cancel or the X icon to exit without initiating the restoration.
The restoration process will be tracked by a progress bar and you can cancel the process by clicking on either of the X icons.
If the bulk restoration has been successful, you will receive a success message. Click Finish to complete the process.
If Smush has run into any errors while trying to bulk restore your thumbnails, you will receive a message informing you of which images were not regenerated.
Click Retry to run the bulk restoration again or Cancel to close the message. You can view the unrecovered images in your media library by clicking on the arrow icon for each image.
8.9 SettingsCopy chapter anchor to clipboard
The Settings module allows you to change the default Smush settings for translation, plugin data, accessibility, and more.
8.9.1 GeneralLink to chapter 9
Smush will automatically use the language set in your WordPress Admin Settings as the Active Translation language, provided there is a matching translation available.
In order for the Active Translation language to reflect in Smush, please ensure that the Smush translation file for the relevant language has been added to your site. Read our WPMU DEV Translations document for a detailed guide to exporting and using translations. Translation files for Smush can be found here.
Once the Smush translation file has been added to your site and you have changed your site language in your WordPress Admin Settings, Smush should fully reflect the new Active Translation language.
Usage tracking is incredibly useful for our designers, and enables us to learn more about what features you use and don’t use. It is a completely anonymous feature, and helps us deliver more relevant features in the future.
To enable usage tracking, toggle on Allow usage tracking and click Save Changes.
8.9.2 ConfigsLink to chapter 9
The Configs module allows you to save your Smush configurations so that they can be applied to another site in just a few clicks.
Save a Configuration
To save your current configuration, click Save Config.
Then, enter a name and optional description for the configuration and click Save.
Saved configurations are listed alphabetically. To view details about a saved configuration, click the configuration in the list.
To make changes to a saved configuration, click the gear icon. The available actions are:
- Apply – Apply the saved configuration to this Smush installation.
- Download – Download the saved configuration as a .json file.
- Name & Description – Edit the name and description for the saved configuration.
- Delete – Permanently delete the saved configuration.
Upload a Configuration
To upload a configuration that you’ve downloaded from another site, click Upload, and select the relevant .json file from your computer.
Smush will import the uploaded configuration and add it to the Preset Configs list.
Apply a Configuration
To apply a saved configuration to your Smush installation, click Apply.
You will be asked to confirm that you would like to replace your current settings with the saved configuration. Click Apply to proceed.
Sync with the Hub
Smush configurations will automatically be synced with the Hub. Synced configs can be accessed and applied directly from the Config or Security modules in the Hub, or from the Smush installation of any of your sites.
If a new config created in the Hub doesn’t appear immediately in the Smush Settings module, click Check again to refresh your data.
This feature is only available to users with the WPMU DEV Dashboard plugin and an active WPMU DEV subscription.
8.9.3 PermissionsLink to chapter 9
This setting applies only to WordPress multisite installations.
Subsites will inherit network settings by default, but the Subsite Controls feature allows you to grant subsite administrators the ability to override modules. You can choose to give subsite administrators any of the following permissions:
Select None to force subsites to inherit all network settings. Subsite administrators will not have access to any of the Smush module settings.
Select All to to give subsite administrators the ability to override all Smush module settings.
Select Custom to give subsite administrators the ability to override settings for select Smush modules.
8.9.4 Data & SettingsLink to chapter 9
The bulk restore tool can be used to restore your thumbnails to their original state, which is helpful if you’ve made a mistake and need to regenerate your images. Read our Tools documentation for a quick guide to the bulk restore tool.
Choose how your data should be handled if Smush is uninstalled. Select Keep to save your settings upon uninstallation, which will allow them to be restored if Smush is reinstalled. Alternatively, you can select Delete, which will wipe your current settings upon uninstallation.
Click Save Changes to save your changes.
Reset Factory Settings
To immediately restore Smush to its default settings, click Reset Settings.
Your API key is linked to your WPMU DEV membership account and is important for granting you access to many of the features offered. If you are having issues with accessing pro features, you can force update your API key to update your membership status. Click Update API Status to action this update.
8.9.5 AccessibilityLink to chapter 9
Color accessibility will improve the visibility of elements as per the Web Content Accessibility Guide requirements, up to level AAA which is the highest level of compliance. Toggle on Enable high contrast mode and click Update Settings to activate this mode.
8.10 TutorialsCopy chapter anchor to clipboard
This module gives you direct access to Smush tutorials that may be extremely beneficial in helping you get the most out of the plugin. Click on any of the articles to read the full blog or click on the View All button to jump to our complete Tutorial blog page.