2 Ways to Use WebP Images in WordPress

Using the WebP image format can dramatically improve the loading speed and performance of your website, especially for sites that contain a large number of images.WebP image format developed by Google(math.) genusHigher compression ratio and better image quality, is currently a popular choice for improving website performance. In this post, we'll detail two ways to use WebP images in WordPress: via the EWWW Image Optimizer,ImagifyThe

Method 1: Using WebP Images in WordPress with the help of EWWW Optimizer

EWWW Image Optimizer is a powerful WordPress image compression plugin that supports WebP image formats and automatically displays them on supported browsers. Below are the detailed steps to convert images to WebP format using EWWW Image Optimizer:

Step 1: Install and activate EWWW Image Optimizer plug-in

1. Log in to the WordPress admin backend.
2. Navigate to Plugins > Add New Plugin.
3. Type "EWWW Image Optimizer" in the search bar, find the plugin and click "Install".

4. Once the installation is complete, click "Activate".

Step 2: Configure EWWW Image Optimizer Plugin Options

1. After activating the plug-in, go to the Settings > EWWW Image Optimizer page.
2. The plugin will display an installation wizard, but you can click the "I know what I'm doing" link to exit the wizard.

3. Scroll down and check the checkbox next to the WebP Conversion option.
4. Click the "Save Changes" button to store the settings.

Step 3: Insert rewrite rules

1. Scroll down to the WebP Conversion section.

2. The plugin will use the red preview image to show you some rewrite rules.

3. Click "Insert rewrite rule" button, the plugin will automatically try to insert these rewrite rules into your .htaccess file.
4. If the plugin successfully adds these rules, the red image preview will change to green and display "WebP"Text.

Step 4: Insert rewrite rules manually (if required)

1. If the plugin is unable to insert the rule, copy the rewrite rule from the plugin's settings page.
2. show (a ticket) .htaccess file, paste the copied rules to the bottom of the file.
3. Go back to the plugin's settings page and click the "Save Changes" button again.

Step 5: Batch Convert Old Images to WebP Version

1. Go to the Media > Library page and switch to the list view.
2. Click the Screen Options button and change the Number of items per page to 999.

3. Click the "Select All" checkbox at the top to select all images.
4. Select the "Batch Optimization" option in the "Batch Actions" drop-down menu and click the "Apply" button.
5. On the next screen, select the option to skip image compression and convert it to WebP only.

6. Click the "Scan for unoptimized images" button and then click the "Optimize" button to continue.

Step 6: Test WebP Image Delivery

1. Open blog posts that contain multiple images.
2. Hover over any image and right-click to open it in a new tab.
3. Confirm that the address bar displays the image with the extension .webpThe

Method 2: Using Imagify to Use WebP Images in WordPress

Imagify supports converting images to WebP format. Below are the detailed steps to convert images to WebP format using Imagify:

Step 1: Install and Activate the Imagify Plugin

Enter "Imagify" in the Add New Plugin search box, find the plugin and click "Install" to activate it.

Step 2: Configure Imagify Plugin Options

1. After activating the plugin, go to the Settings > Imagify page.
2. Click "Create a free API key"Button.

3. Enter your email address and check your inbox for an email containing the API key.

4. Copy and paste the API key into the plugin's settings page and click "Save Changes"Button.

Step 3: Enable WebP Conversion Options

1. Scroll down to the Optimization section and check the options "Create Webp versions of images" and "Display images in Webp format on websites".

2. Choose the appropriate delivery method (.htaccess method or tag method).
3. Click the "Save and Go to Batch Optimizer" button.

Step 4: Batch Optimize Images

1. Navigate to the Media > Batch Optimization page.
2. The plugin will automatically start optimizing all your WordPress images in the background.
3. Wait for optimization to complete.

Step 5: Test WebP Image Delivery

1. Open a page or post that contains some images.
2. Hover over the image and right-click to select "Open Image in New Tab".
3. Confirm that the address bar displays the image with the extension .webpThe

Both of the above methods are effective in using WebP images in WordPress to improve website performance. Depending on your specific needs and the plugin you are using, choose the most suitable method to ensure that images load faster and provide a better browsing experience for your users.

Contact Us
Can't read the tutorial? Contact us for a free answer! Free help for personal, small business sites!	Customer Service
① Tel: 020-2206-9892
② QQ咨询：1025174874
(iii) E-mail: [email protected]
④ Working hours: Monday to Friday, 9:30-18:30, holidays off