Month: July 2020

“Instructions for Optimizing Multiple Images with the No-Cost Smush Tool”

|

Utilizing large images on your WordPress website not only consumes storage space but also reduces the speed of your site. Rather than spending time and energy manually compressing them, find out how Smush can assist you in doing it all at once.

Smush is a recognized image optimization tool that concentrates on reducing the size and dimensions of your images. It conserves storage space and reduces the burden on your server, resulting in a faster website.

Ensure you have downloaded the Smush plugin for free from WordPress.org if you haven’t done so already.

It is possible to manually reduce the size of your images before uploading them to WordPress, however, this process is much more time-consuming compared to utilizing a plugin such as Smush.

Smush gives you full control over when and how your images are compressed and optimized in at least 7 ways.

In this written piece, we demonstrate the steps on how to:

1. Activate Smush Scan

2. Exclude Selected Image Sizes

3. Super-Smush for 2x More Compression (or Ultra-Smush for 5x)

4. Remove Image Metadata

5. Choose JPEGS Over PNGs

6. Manage Your Original Images

7. Bulk Smush Images

1. Activate Smush Scan

When you activate Smush, it automatically combs through your site and takes note of any images that can be compressed.

Smush presents the quantity of images requiring attention on its primary interface.

Screenshot of the amount of images that need smushing - 19.
This is just one of the methods you can use to smush your images.

Before hitting the Bulk Smush button, it’s worth checking out Smush’s other image compression features.

Let’s review each of these choices.

2. Exclude Selected Image Sizes

First, you can exclude images of certain sizes from being compressed by simply unticking the checkboxes shown below:

Screenshot of the various image sizes you can exclude.
If you want Smush to compress all of your images, you can choose the ‘All’ option.

WordPress creates multiple copies of an image. If you run a site that requires your images to be crystal clear, you may not want your larger images to be compressed, however, you can still compress the smaller image versions using these settings.

3. Super-Smush For 2x More Compression (or Ultra-Smush for 5x)

If you prioritize website speed and storage capacity, you can enhance image optimization even more with Super-Smush.

Bulk Smush Settings - Super Smush
Choose Super Smush for better performance and load speed without compromising image quality.

Super-Smush operates by eliminating as much image data as it can without compromising the quality, resulting in a file size reduction of up to double that of standard smush.

For even more compression and savings (up to 5x more) with minimal image quality loss, choose the Ultra Smush setting.

Smush Settings - Ultra Smush enabled
Ultra Smush your images for 5x compression.

You have the ability to adjust Smush’s settings so that it keeps a copy of your original images. If you’re not prepared to use the Super-Smush or Ultra-Smush options, there are other methods to reduce the file size by a few kilobytes.

4. Remove Image Metadata

Smush lets you strip unnecessary metadata from your images.

Screenshot of the strip metadata button.
The information that Smush strips serves no purpose on most sites.

When this feature is turned on, any extraneous information within your photos will be eliminated while retaining the essential data for search engine optimization.

Whilst a lot of the EXIF data stored within a photo is harmless, other details such as the location it was taken and the camera details are better off removed. The location could lead people to where you took the photo (your house perhaps) and if the serial number of the camera is included, it could be used to trace other photos online taken with the same camera and result in an invasion of privacy.

These scenarios may be unlikely, however since all the extra data is clogging up your site anyway, it makes perfect sense to remove it. Luckily, Smush does it for you automatically once you enable this setting.

Select JPEGs instead of PNGs.

Another way to potentially reduce your file sizes is by converting your PNG images to JPEGs.

Screenshot of the pngs to jpegs button
If a saving won’t be made, Smush will leave your images as PNGs.

If you’re unsure whether you should enable this setting, a good general rule of thumb is that you should convert photographs to JPEG as there is no noticeable loss in quality. You can achieve a file size of less than 10% of the original if you compress as a JPEG compared to PNG.

If you have graphics, screenshots, or images that contain text, it’s better to leave them as PNGs to ensure they stay crystal clear as JPEGs tend to add a little bit of noise/grain around the text

6. How Smush Handles Original Images

As of WordPress 5.3, large images are automatically resized down to the new maximum image size of 2560px in width/height. WordPress then refers to these resized images as “new originals”.

Smush can assist you in bypassing this limitation if you need to upload an image that exceeds this size.

Screenshot of the resize my full size images section with custom size set to 4000px.
You can select your own new maximum width and height for images.

With this setting enabled, Smush automatically creates a new size for super-large images and reduces these to your new custom sizes, rather than WordPress resizing them to its default maximum size of 2560px.

If you manually adjust the size of your images before uploading them to WordPress, you may not need to activate this feature. However, it can save you a considerable amount of time and effort, especially if you have numerous large images that you want to showcase on your website.

Now that you’ve decided how large your original images will be, it’s time to decide what to do with them.

By default, Smush doesn’t compress your original images during a Bulk Smush, it only compresses the thumbnail images that WordPress produces.

It is logical to compress your original images as well, as they are the primary source of storage consumption.

Screenshot of the original images toggles.
Use the top toggle to ensure your full-sized images are smushed.

If you’re smushing all of your original images, you might want to have a backup in case you decide to revert back to the pre-smushed version.

If you upload an image higher than the maximum size your site will support (either WordPress’ maximum or a custom maximum you create with Smush) WordPress stores your image as the original and then creates the new max-sized image to display on your site.

If an image you upload is smaller than the maximum allowed, WordPress will not store this as a separate original – this version will be compressed directly by Smush.

Whilst Smush guarantees no loss in quality when compressing your images, we understand that some people will want a backup, which is why the ‘Store a copy of my small originals’ feature exists.

Enable this to store a copy of your original images in wp-content/uploads.

7. Bulk Smush Images

Reducing the file size of your images will save storage space on your website and also decrease the loading time for your visitors. After adjusting the various settings, it’s now time to use Bulk Smush to compress your images.

When you hit the blue button, Smush will compress the images that it identified upon activation.

Screenshot of a smush in process showing it at 94%.
Make sure you keep the tab open until Smush has finished compressing all the images.

After the process is complete, Smush will monitor your site for any new images that require compression.

When your image total on Smush’s main screen starts to creep up again, all you need to do is hit the Bulk Smush button and all your images will be compressed. It’s much quicker and easier than doing it manually outside of WordPress.

If you’re happy with your first Bulk Smush, you may want to consider enabling Automatic Compression.

Screenshot of automatic compression showing it enabled.
You can easily enable or disable this feature using the toggle shown above.

If you turn on Automatic Compression, Smush will immediately compress your images when you upload them, eliminating the need for Bulk Smush in the future.

Image Optimization at the Touch of a Button

Compressing your images with Bulk Smush is just the start.

Optimizing images on your website reduces the strain on the server when handling browser requests. Additionally, using Smush can assist in improving your Google PageSpeed score.

Smush boasts a ton of other features such as a blazing-fast CDN and the ability to convert your images into next-gen formats that can help your site reach its full potential.

[Editor’s note: This post was originally published in July 2020 and updated in Dec 2023 for accuracy.]

Bulk image optimization is a process of reducing the file size of multiple images at once without compromising their quality. This is an essential step for website owners, bloggers, and digital marketers who want to improve their website’s loading speed and overall performance. One of the most popular tools for bulk image optimization is the free Smush tool.

Smush is a WordPress plugin that allows users to optimize their images in bulk with just a few clicks. It is an easy-to-use tool that can help you save time and improve your website’s performance. In this guide, we will show you how to use the Smush tool to optimize your images in bulk.

Step 1: Install and Activate the Smush Plugin
The first step is to install and activate the Smush plugin on your WordPress website. To do this, go to the “Plugins” section of your WordPress dashboard, click on “Add New,” and search for “Smush.” Once you find the plugin, click on “Install Now” and then “Activate.”

Step 2: Configure Smush Settings
After activating the plugin, you will be taken to the Smush dashboard. Here, you can configure the settings for image optimization. You can choose to automatically optimize images when they are uploaded, or you can manually optimize them later. You can also choose to resize images, convert them to a different format, and strip metadata.

Step 3: Bulk Optimize Images
Once you have configured the settings, you can start optimizing your images in bulk. To do this, go to the “Bulk Smush” section of the Smush dashboard. Here, you can select the images you want to optimize and click on “Bulk Smush Now.” The plugin will then start optimizing your images in the background.

Step 4: Monitor Progress
While the images are being optimized, you can monitor the progress in the “Bulk Smush” section. The plugin will show you how many images have been optimized, how much space has been saved, and how much faster your website will load.

Step 5: Enjoy Faster Loading Times
Once the bulk optimization is complete, you can enjoy faster loading times for your website. This will improve the user experience for your visitors and help you rank higher in search engine results.

In conclusion, bulk image optimization is an essential step for improving your website’s performance. The free Smush tool makes it easy to optimize your images in bulk, saving you time and improving your website’s loading speed. By following the steps outlined in this guide, you can easily optimize your images and enjoy a faster, more efficient website.

Read More

How to Swiftly Detect and Eliminate Suspicious Code with Defender Post-Hack

|

If you’re not vigilant, dubious code lurking on your websites can easily remain undetected and cause serious issues. Whether your site has been compromised and requires immediate remediation, or you simply wish to examine your sites for any unusual behaviors, Defender offers a solution to swiftly identify and eradicate malware permanently. Discover how it works in this tutorial.

Are you in search of an easy and straightforward method to find and remove suspicious code from your websites?

This tutorial provides a step-by-step guide on how Defender‘s extensive array of security tools can assist in eliminating and preventing suspicious code from resurfacing.

You will also learn effective strategies to ensure your sites remain safeguarded against such problems in the future.

Let’s get started, as the well-being of your sites is on the line!

How To Identify and Fix Suspicious Code and Files Using Defender

To begin… Identifying and deleting suspicious files and code requires the Pro version of Defender.

You can acquire Defender Pro, along with our collection of Pro WordPress plugins and site management tools for a mere $3/month. This is exceptional value, particularly if you own or oversee critical sites that are highly vulnerable to malware or attacks.

The first step is to activate the Suspicious Code feature through Malware Scanning > Settings.

Ensure that File Change Detection is enabled for both ‘Scan Core Files’ and ‘Scan Plugin Files.’ This will help lower the chances of false positives during your scans.

A screen showing Defender's various security settings
Activate these essential security settings before proceeding any further.

After enabling these settings, you are set to scan your site for malware.

To initiate this, head to Malware Scanning from the WordPress admin sidebar or the main Defender dashboard.

A screen showing where you can start a new malware scan
Start a new malware scan with a single click and identify threats in seconds.

Once here, you can kick off a new scan with just one click.

Then, relax and allow Defender to perform its functions. The scan should only take a few moments, dependent on your site’s size.

A screen showing a Defender malware scan in progress.

Once the scan is finished, you will be notified of any issues found related to file change detection, known vulnerabilities, and suspicious code.

A screen showing that vulnerabilities have been detected.
The Issues tab provides details on all identified vulnerabilities or suspicious activities.

Next, simply click on the Issues tab. You will find a compilation of all potentially harmful files that have been altered or compromised in some manner.

A screen showing the issues the Defender scan has detected.
Defender promptly spots issues for you to address.

Click on any detected files for more detailed information about the issue and its exact location.

In the example provided, the suspicious code has been found within a WordPress plugin. Defender clearly indicates the error and the file where it was detected.

A screen showing details of an issue that was detected during the malware scan.
Quickly identify where the detected issue was located.

Alongside crucial details such as the plugin URL, location of the issue, date added, and developer, you have three options for addressing suspicious files or code.

You can choose to ignore, delete, or Safe Repair the file.

Note: It’s highly advisable to verify that something is truly benign before deciding to delete and/or ignore it. If you’re uncertain or need guidance, feel free to consult with our 24/7 WordPress experts.

Keep in mind that there is a possibility that reported concerns or vulnerabilities could be false positives, meaning genuine code being misidentified as suspicious due to its similarity to malicious code.

This can occur due to various factors, like a function modified by a plugin or theme, or alterations made directly in the file or theme editor.

Fortunately, Defender is built to minimize the chances of false positives. Yet, malicious code frequently mimics legitimate code, making complete avoidance nearly impossible.

To help validate suspicious code, you can undertake a couple of actions:

  • Verify custom edits: Consult with the plugin developer to verify the questionable code.
  • Contact our support: If you did not add the code, and you’re confident that no one you know did, don’t hesitate to reach out to WPMU DEV support for feedback and to report what you consider to be malicious code.

It is strongly advised to consult either the plugin developer or our support team for guidance before deleting any files. You’ll need to disable the plugin beforehand to delete the corresponding file.

Another excellent and risk-free option is to utilize Defender’s Safe Repair feature.

A screen showing where the user can enable the Safe Repair feature
Employing Defender’s Safe Repair feature is a fantastic way to fix your site without the concern of causing further damage by deleting a file.

Click Safe Repair to automatically quarantine the file for a specified duration that you set (30 days – one year).

This allows for a swift site repair and fixes the issue immediately if it is responsible. The quarantine timeframe also provides sufficient time for thorough investigation.

Moreover, if it turns out to be a false positive, you can effortlessly restore the file. This prevents you from accidentally deleting a vital file and averting further issues with your site.

A screen showing a potentially malicious file in quarantine, and the options you have to deal with it
Restore or permanently delete files with a single click.

Once you are confident that deleting the file is both safe and necessary, you can securely do so from the Quarantined tab.

And that’s a wrap!

You’ve witnessed how straightforward and quick it is to pinpoint and address suspicious files or code following a hacking incident or malware attack.

However, promptly addressing critical issues as they arise is one thing….

Preparing and safeguarding your sites against future threats is quite another!

With that in mind, here are some ‘bonus tips’ to make sure your sites are well-equipped to handle potential hacks or other issues should they arise again.

BONUS TIPS: How To Set Up Your Sites For Ongoing Protection

Schedule Automated Site Scans

Another beneficial feature of Defender Pro is the capability to schedule automated site scans.

This not only frees you from the need to conduct manual scans but also ensures that your sites are checked regularly for security issues effortlessly.

Scheduled scans can be configured via Malware Scanning > Settings. From there, all you need to do is activate scheduled scanning and specify the frequency, day of the week, and time of day for the scans to commence.

A screen showing where you can schedule and automate your malware scans.
Effortlessly establish automated scans according to your desired frequency.

Activate Notifications for Suspicious Activities

After setting up automated scans, it’s advisable to establish notifications so you can be alerted of scan results regardless of your location, saving you from needing to check in manually.

Simply navigate to the Notifications section using the sidebar or from the main Defender dashboard.

Here, you’ll discover various notification options available for selection.

For instance, in the event of detecting suspicious code, you should enable the Malware Scanning “Notification” and “Reporting” options.

A screen showing where you can enable Defender notifications.
Defender provides multiple notification options for you to customize.

After making your selections, you can configure additional settings and preferences for each notification.

You also have the option to add users directly or invite them via email.

A screen showing where Defender users can adjust the recipients of their notifications

Next, you can further fine-tune the notification settings to ensure you only get alerts at appropriate times.

Additionally, you can set up bespoke email message templates for your clients to ensure the notifications they receive align with your preferences and are clear to the end-user.

A screen showing where you can confirm notification settings and set up email message templates
Enable notifications when necessary and provide customized message templates for your users.

Identifying and Erasing Suspicious Code Has Become Simpler With Defender

As illustrated, suspicious code is no challenge for Defender and it truly only requires a few clicks to eliminate.

In addition to locating malicious code and the capacity to remove it, Defender can also stop SQL injections, prevent unauthorized access to WordPress vulnerabilities, halt PHP execution, and much more.

For further insights into WordPress security, be sure to check out our Ultimate Guide to WordPress Security. And for more details on how Defender operates, don’t forget to review the plugin’s documentation.

Don’t have the time or resources to tackle malware or hacks on your own? Explore our Expert Services!

We recognize that when a malware incident occurs on a client site you manage, you may lack the time or resources to rectify it yourself.

In such cases, our Expert ‘done-for-you’ Services present another excellent alternative.

Instead of stressing over security concerns or malware attacks by yourself, you can enlist our experts at an affordable cost to manage it for you. You can also readily resell these services to your clients without incurring any additional fees from us.

Furthermore, we offer a full 7-day money-back guarantee. If we assist in resolving a hacked site and a problem reappears within seven days, we will return to fix it at no additional charge!

Discover more about our Expert Services here.

[Editor’s note: This article was initially published in July 2020 and revised in May 2024 for accuracy.]

Read More

Optimizing Images to their Fullest Potential with Smush: A Detailed Tutorial

|

Manually enhancing your images would require extensive resizing, a decent amount of programming, and a significant amount of time. Fortunately, Smush takes care of all the difficult tasks for you and offers additional benefits, all of which are detailed in this guide to assist you in maximizing the plugin’s potential.

For instance, Smush is widely recognized for reducing image sizes without sacrificing quality, but it can also assist in postponing the loading of offscreen images through its lazy-load function, transform your images into newer formats like WebP, and deliver your images via our high-speed CDN that comes with Smush Pro.

Fortunately, with Smush installed, you won’t have to spend a lot of time or energy on your images. The majority of the features can be turned on with just a single click.

If you’re a first-time user or looking to discover some awesome features you may have overlooked, this guide will assist you in maximizing your experience with this plugin.

We look at how to:

  1. Smush All Your Images in Bulk
  2. Enable automatic compression for newly uploaded files.
  3. Super Or Ultra-Smush For Double the Compression
  4. Display Your Full Size Images
  5. Convert Your PNGs to JPEGs
  6. Smush From the Media Library
  7. Optimize Directory Images
  8. Lazy Load Your Images For a Boost of Speed
  9. Utilize Smush’s CDN
  10. Serve the Correct Image Sizes
  11. Convert Your Images to Next-Gen Formats
  12. Save Time With Automatic Smush Configs
  13. Integrate With Popular WordPress Tools

Without further delay, here’s how to maximize the benefits of Smush:

1. Smush All Your Images in Bulk

When you first install Smush, chances are you’ll have a backlog of images that need your attention.

The Bulk Smush function searches your website for images that could be improved by compression.

Screenshot of the bulk smush feature which shows 31 images which need smushing.
Each time you add new images, Smush will add them to this total.

All you have to do is click the button – Smush does all the hard work for you and lets you know when the job is complete.

If you need to optimize numerous images, you have the option to exit the plugin and return later. Smush will keep working on compressing your images in the background and will let you know when the task is finished.

But rest assured, no matter how many images you have to optimize, thanks to built-in features like parallel image processing, which gives you 8x the normal processing speed, your images are in the best and fastest hands.

Screenshot showing the bulk smush successfully completed.
Much faster than compressing them yourself.

If necessary, you have the option to omit specific image dimensions from Bulk Smush. Nonetheless, since Smush optimizes images without compromising their quality, it could be advantageous to compress all sizes.

Screenshot of the various image sizes which are available to exclude.
Uncheck the boxes corresponding to the image sizes you do not want to be compressed.

One other feature worth noting is that when you click the Re-Check Images button, Smush performs an automatic scan of your Media Library to check if new images have been added since the last bulk smush.

Media Library Scan
Smush automatically scans your media library when you recheck images.

2. Automatically Compress New Uploads

Once you have used the Bulk Smush feature to catch up on your backlog of image compressing, you will seldom need to use it again.

This is because of the handy Automatic Compression feature. If you enable this, Smush will compress images as soon as you upload them to your site.

Smush also has a generous maximum file size limit of 256MB per image, so if you have any gigantic images to be uploaded, they’ll automatically be compressed and optimized for you too.

Screenshot showing the various image sizes that you can include when bulk smushing if you didn't want to select 'all'.
The time-consuming task of regularly trimming images can quickly become a distant memory for you.

3. Super Or Ultra-Smush For More Compression

If your main focus is on your site’s speed, you may want to take image compression a step further.

Super-Smush provides double the compression compared to regular smushing by removing all unnecessary data, while maintaining the quality of your images.

A screen showing the different Smush modes.
Take your image compression power to the next level.

Or, if you want to really amp up your compression powers, try the Ultra-Smush option for an impressive 5x compression on top of the already amazing Super-Smush. Ultra is only available with Smush Pro, but completely worth the upgrade if having the fastest possible sites is a priority for you.

The latest Ultra Smush offers image compression that is five times more efficient than what Super Smush provides.Check it out here

If you don’t want to take it as far as Super or Ultra-Smush, you can instead strip the unnecessary metadata from your images, leaving only what is needed for SEO purposes. Photos often store camera settings in the file such as focal length, date, time and location – removing this will reduce your file size.

If you’re a photographer, you might want to keep this information, but it serves little purpose on most sites so is generally safe to remove.

4. Display Your Full Size Images

If you upload an image that is larger than 2560px in either width or height, WordPress will automatically scale it down to generate a ‘web-optimized’ maximum image size.

If you are purposefully adding larger images and want to override this, you can use the image resizing option.

Screenshot of the resize my full size images button
You have the ability to establish a customized maximum size for images.

Bear in mind that your theme may also have its own maximum image size – you will need to check this before enabling this feature.

Want to disable automatic resizing of images altogether? You can enable Disable scaled images. This means scaled versions of images will not be generated, and only your original uploaded images will be kept.

If you are uploading full-sized images, you can also choose whether or not these will be included in Bulk Smush.

Screenshot of the settings for smushing original images.
Additional straightforward features that can be activated with a single click.

Make sure you enable the Backup original images selection if you want to store a copy of all your full-size images, in case you ever wanted to return them to their pre-smushed forms.

Discover more about WordPress’s image management process by reading this blog article.

5. Convert Your PNGs to JPEGs

There are some circumstances where one of these two file types is more suitable than the other. However, if your main concerns for your site are memory usage and speed, then using JPEGs instead of PNGs should be beneficial.

If you upload your images as PNGs, Smush can check to see whether converting them to JPEGs will reduce the file size.

Screenshot of the png to jpeg button
The files will remain as PNGs if there is no reduction in the file size.

You can, of course, make the same conversion outside of WordPress. However, using Smush removes the hassle and converts all your files in one swoop.

6. Smush From the Media Library

If you would prefer to select individual images for compression, look no further than your own media library.

Here, you will find a new column labelled ‘Smush’.

Screenshot of the column which appears in the media library upon activation of smush.
You can compress your images one-by-one.

If you have auto-compression turned off, any photos which you upload should be ready to smush from within your media library.

You can smush your images individually, or alternatively single out images to be ignored from bulk smushing.

7. Optimize Directory Images

While your uploads folder is typically the main folder where images are found, they may also reside elsewhere in your directory.

For example, plugins that create their own image copies may store those images in the plugins folder.

In cases like this, the Directory Smush feature helps you easily identify and compress images stored outside the uploads folder.

A screen showing the directory Smush feature
Find and optimize images stored outside of the typical uploads folder.

Simply choose which directories and subdirectories you want to scan, and Smush will optimize and compress all of the images in bulk, it’s that easy.

A look at how Smush enables you to scan directories.
Optimize selected directories and subdirectories with a click.

8. Lazy Load Your Images For a Boost of Speed

If you have pages with a lot of images, displaying them all at once can put a lot of pressure on the server.

Deferring your off-screen images is a good way to allow the server to concentrate on loading the elements of your site above the fold so that your visitor can get stuck straight in.

Screenshot of the lazy loading feature activated.
It takes one click to deactivate if you find it’s not right for your site.

If there are certain types of images or certain output locations you wish to exclude from lazy loading, you can easily add them here.

Screenshot of the different media types and output locations you can exclude.
Remove the ticks from any of the options that you don’t wish to include.

You can also exclude certain various post types, specific URLs, and CSS classes and IDs.

Basically, if you want to enable lazy loading, you can fine-tune exactly how and where it is enabled.

Once you have chosen which images will lazy load, you can then decide how you want the pre-loading images to appear.

Screenshot of the display animation options.
If you don’t want any form of animation, simply select ‘None’.

9. Utilize Smush’s CDN

The closer you are to the server that is providing your content, the faster it will load. A CDN (Content Delivery Network) is a series of servers which are spread around the globe, and when a browser makes the HTTP request, the content is served from the closest server to its location.

Smush Pro boasts a 121-point CDN, with a few extra tricks up its sleeve. It can automatically resize your images as well as convert them to Google’s own next-gen format, WebP.

Check out the video below to learn more about our CDN.

If all you want is for your images to be served from the CDN, you do not need to delve any further into these.

However, there are a few useful tools that can be of benefit to your site, so they are worth checking out.

You can activate and configure the Smush Pro Image CDN right from your dashboard.

Screenshot of the CDN just after activation.
Once you have activated the CDN, you will see more options within Smush.

This will store and serve copies of all your JPG, PNG, and Gif images from the Smush edge servers – drastically improving speed.

Don’t Leave Your Background Images Out

As standard, only images used on your posts and pages will be served through the CDN.

If you want your background image to be served from the same speedy CDN as the rest of your images, Smush has you covered.

Screenshot of the background images option.
Your background images will reach your visitor quicker if served through our CDN.

You will need to ensure that your background images are properly declared with CSS in your theme’s files.

10. Serve the Correct Image Sizes

Ideally, you should never serve an image larger than what will be displayed on the user’s screen. Using original or full-size images when a smaller image will do makes your pages take longer to load while your browser waits for the images to render.

Smush’s CDN houses a handy feature to resize your image to fit the container, without needing to touch a line of code.

Screenshot of the automatic resizing option.
As the resizing is done from the CDN, your original images will remain full size.

11. Convert Your Images to Next-Gen Formats

JPEG 2000, JPEG XR, and WebP are modern image formats with superior compression capabilities. This means they produce much smaller image files so you can greatly improve your page speed.

Images served in the WebP format can benefit from more than 25% compression, and when you think about the number of images on your site, that’s a tonne of space that can be saved.

Smush Pro gives you two options for converting your images to next-gen formats.

1.Convert images with Smush Local WebP

The Local WebP feature in Smush Pro enables you to serve images from your Media Library in next-gen WebP format, without needing the Smush CDN.

A screenshot of the LocalWebP feature from the main Smush dashboard
Serve images in next-gen formats without the need for Smush’s CDN.

The conversion to WebP is lossy when converting from JPEG images, and lossless when converting from PNG images.

Note that once you have configured this feature, you will need to run a Bulk Smush again for your existing images to get a WebP version created for each one.

Local WebP also only works for images in your Media Library and cannot create WebP versions of images found in other directories.

2.Convert images with Smush CDN

Smush’s CDN offers the option to convert your images to WebP in just one click.

Screenshot of the webp conversion button.
All the legwork is taken care of by Smush.

Not all browsers support next-gen formats, which is something you would usually have to bear in mind when deciding to make the switch.

However, if you enable the WebP Conversion feature, Smush will automatically check whether or not a browser supports this format, and if not, will serve it in the original one. This ensures that none of your visitors are compromised.

12. Save Time With Automatic Smush Configs

If you manage multiple sites, this feature will save you hours of time by allowing you to apply your preferred Smush settings to any site with a click.

All you have to do is follow the already mentioned steps in this article and set Smush up exactly how you want it.

Then navigate to Settings > Configs and simply hit ‘Save Config’ to save your current settings as a new config, which you can apply to other sites instantly.

A screenshot showing the Smush Configs module
Set up Smush with your ideal settings and apply to other sites with a click.

You can also choose from a number of default configs and you can integrate with The Hub site management tool to easily apply your configs to multiple sites at once.

13. Integrate With Popular WordPress Tools

A screen showing brands that Smush is compatible with
Smush plays nicely with and enhances your favorite WordPress tools.

Smush is fully compatible with your favorite WordPress tools and has direct in-plugin integrations with Gutenberg, Amazon S3, Gravity Forms, WPBakery builder, and NextGen Gallery.

Like most Smush features, all of these integrations can be activated with a click and allow for more specialized and targeted image optimization for the tool you’re integrating with.

Support at Your Fingertips

Now you know the ins and outs of this little plugin, it’s time to get stuck in and see how your site can benefit.

Smush is a very user-friendly plugin, so you should have no trouble managing your images.

If, however, you find yourself in need of some friendly advice, members should look no further than our awesome support team who are available 24/7.

And when you’re ready to take your image optimization to the next level, give Smush Pro a try and automatically unlock advanced features like our 121-point CDN, 5x Ultra Smush – plus – free access to the entire WPMU DEV suite of plugins and site management tools.

You can also check out the plugin documentation and view new updates and features coming soon in our roadmap.

Image optimization is a crucial aspect of website performance and user experience. Large, unoptimized images can slow down your website, leading to higher bounce rates and lower search engine rankings. Fortunately, there are tools available to help you optimize your images for the web. One such tool is Smush, a popular image optimization plugin for WordPress.

Smush is a powerful tool that can help you compress and optimize your images without sacrificing quality. It offers both free and premium versions, with the premium version offering additional features such as bulk smushing and the ability to optimize images up to 32MB in size.

Here is a step-by-step guide on how to maximize image optimization with Smush:

Step 1: Install and Activate Smush
To get started with Smush, you’ll need to install and activate the plugin on your WordPress website. You can do this by going to the Plugins section of your WordPress dashboard, clicking on “Add New,” and searching for “Smush.” Once you’ve found the plugin, click “Install Now” and then “Activate.”

Step 2: Configure Smush Settings
After activating Smush, you’ll be taken to the plugin’s settings page. Here, you can configure various settings such as automatic compression, image resizing, and lazy loading. You can also choose to enable or disable the plugin’s features based on your needs.

Step 3: Bulk Smush Your Images
If you have a lot of images on your website, you can use Smush’s bulk smushing feature to optimize them all at once. Simply go to the Bulk Smush tab and click on the “Bulk Smush Now” button. The plugin will then compress and optimize all of your images in the background.

Step 4: Optimize New Images
Smush can also automatically optimize new images as you upload them to your website. To enable this feature, go to the Smush settings page and check the box next to “Automatically smush my images on upload.” This will ensure that all new images are optimized before they are added to your website.

Step 5: Use the Smush CDN
If you have the premium version of Smush, you can take advantage of the plugin’s content delivery network (CDN) feature. This feature allows you to serve your images from a global network of servers, which can help improve your website’s performance and speed.

Step 6: Monitor Your Results
Finally, you can monitor your image optimization results by going to the Smush dashboard. Here, you’ll see statistics on how much space you’ve saved by optimizing your images, as well as how many images have been optimized.

In conclusion, Smush is a powerful tool that can help you maximize image optimization on your WordPress website. By following these steps, you can ensure that your images are optimized for the web, leading to faster load times and a better user experience.

Read More

Recent Comments