WebP Converter for Media – Convert WebP & Optimize Images

Beskrivning

Speed up your website by serving WebP images. By replacing files in standard JPEG, PNG and GIF formats with WebP format, you can save over a half of the page weight without losing quality.

After installing the plugin you do not have to do anything more. Your current images will be converted into a new format. When compress images is finished, users will automatically receive new, much lighter images than the original ones.

As of today, over 90% of users use browsers that support the WebP format. The loading time of your website depends to a large extent on its weight. Using convert WebP, now you can and speed up it in a few seconds without much effort!

This will be a profit both for your users who will not have to download so much data, but also for a server that will be less loaded. Remember that a better optimized website also affects your Google ranking.

Stöd för ytterligare kataloger

Now you can convert WebP and optimize images not only from /uploads directory but also from /plugins and /themes directories. This allows full integration with the WebP format!

Hur fungerar detta?

  • By adding images to your Media Library, convert WebP starts automatically and WebP images are saved in a separate directory.
  • Om du just har installerat tillägget kan du optimera bilder med ett klick.
  • As WebP you will see all the images added to the Media Library and other selected directories.
  • When the browser tries to download an image file, the server verifies if it supports image/webp files and if the file exists.
  • If everything is OK, instead of the original image, the browser will receive its equivalent in WebP format.
  • In default loading mode the plugin does not change image URLs, so there are no problems with saving the HTML code of website to the cache and time of its generation does not increase. It does not matter if the image display as an img HTML tag or you use background-image. It works always!
  • Namnet på den laddade bilden innehåller inte tillägget WebP. Endast källan till den laddade filen ändras till en WebP-fil. Som ett resultat har du alltid en URL till en fil. Oavsett om webbläsaren stöder WebP eller inte.
  • Image URLs are modified using the module mod_rewrite on the server, i.e. the same, and thanks to this we can use friendly links in WordPress. Additionally, the MIME type of the sent file is modified to image/webp.
  • In case rewriting by rules from .htaccess file is blocked, a mode is available which loads images via PHP file. Then image URLs are changed, but the logic of operation is the same as in the case of the default mode.
  • Det slutliga resultatet är att dina användare laddar ner mindre än hälften av data, och själva webbplatsen laddas snabbare!

Konvertera WebP – det är framtiden!

Optimize images and raise your website to a new level now! Install the plugin and enjoy the website that loads faster by image optimization. Surely you and your users will appreciate it.

Support to the development of plugin

We spend hours working on the development of this plugin. Technical support also requires a lot of time, but we do it because we want to offer you the best plugin. We enjoy every new plugin installation.

If you would like to appreciate it, you can provide us a coffee. If every user bought at least one, we could work on the plugin 24 hours a day!

Please also read the FAQ below. Thank you for being with us!

Skärmdumpar

  • How to start using plugin few moments?
  • Skärmdump av alternativpanelen
  • Skärmdump vid återskapande av bilder

Installation

  1. Upload the plugin files to /wp-content/plugins/webp-converter-for-media directory, or install plugin through the WordPress plugins screen directly.
  2. Activate plugin through Plugins screen in WordPress Admin Panel.
  3. Use Settings -> Settings -> WebP Converter screen to configure the plugin.
  4. Click on the button Regenerate All.
  5. Kontrollera om allt fungerar bra.

That’s all! Your website is already loading faster!

Vanliga frågor

Hur får man teknisk support? (innan du ber om hjälp)

Please always adding your thread, read all other questions in the FAQ of plugin and other threads in support forum first. Perhaps someone had a similar problem and it has been resolved.

När du lägger till en tråd följer du dessa steg och svarar på var och en av dem:

1. Do you have any error on the plugin settings page? Please read this thread if you have any errors.

2. URL till din webbplats.

3. Configuration of your server (link to it can be found on the settings page of plugin in the section ”We are waiting for your message”) – please take a screenshot of the ENTIRE page and send it to me.

4. Settings of plugin – please take a screenshot of the ENTIRE page and send it to me.

5. Please do the test, which is described in the FAQ in question How to check if plugin works?. Please send a screenshot of Devtools with test results.

6. Enable debugging to the file and check if any errors are generated in the debug.log file when the works. Provide their content.

7. Do you use any plugin filters or actions from this FAQ? If so, list them all.

8. What plugin version are you using? If it is not the latest then update and check everything again.

9. A list of all the plugins you use. Have you tried checking the plugin operation by turning off all others and activating the default theme? If not, please try whenever possible. This is very important because other plugins or themes can cause problems. Therefore, we recommend disabling all necessary plugins and enabling the default theme.

Please remember to include the answers for all questions by adding a thread. It is much easier and accelerate the solution of your problem.

Error on plugin settings screen?

If you have an error on the plugin settings screen, first of all please read it carefully. They are displayed when there is a problem with the configuration of your server or website.

Meddelandena är utformade för att minska antalet supportförfrågningar som upprepas. Det sparar din och vår tid. Läs den här tråden för mer information.

Fel vid konvertering?

Du kan få flera typer av fel vid konvertering. Läs först deras innehåll noggrant. För det mesta kan du lösa detta problem själv. Försök att göra detta eller kontakta serveradministratören.

If you get an error: File "%s" does not exist. Please check file path. means that the file_exists() function in PHP returned false using the file path given in the error message. Check this path and make sure it is correct.

If you get an error: File "%s" is unreadable. Please check file permissions. means that the is_readable() function in PHP returned false using the file path given in the error message. Check the permissions for the file and the directory in which the file is located.

If you get an error: "%s" is not a valid image file. means that the file is damaged in some way. Download the file to disk, save it again using any graphics program and add again to the page. If the error applies to individual images then you can ignore it – just the original images will load, not WebP.

If you get an error: "%s" converted to WebP is larger than original and has been deleted. means the original image weighed less than WebP. This happens when images have been compressed before. Disable the ”Automatic removal of WebP files larger than original” option in plugin settings to force always using WebP.

In the case of the above problems, contacting the support forum will be useless. Unfortunately, we are unable to help you if your files are damaged. You have to fix it yourself. If you have previously used other tools that changed the original files and damaged them, you will do nothing more.

Remember that it happens that other plugins can cause problems with accessing files or the REST API. Please try to disable all other plugins and set the default theme to make sure that it is not one of them that causes these types of problems.

What are requirements of plugin?

Practically every hosting meets these requirements. You must use PHP at least 7.0 and have the GD or Imagick extension installed. The extension must support WebP format. If you have an error saying that the GD or Imagick library are not installed, but you have it installed then they are probably incorrectly configured and do not have WebP support.

De är nödvändiga PHP-tillägg, som bland annat används av WordPress för att generera miniatyrer. Din server behöver också ha modulerna mod_mime, mod_rewrite och mod_expires aktiverade.

An example of the correct server configuration can be found here. Link to your current configuration can be found in the administration panel, on the management plugin page in the section ”We are waiting for your message” (or using the URL path: /wp-admin/options-general.php?page=webpc_admin_page&action=server).

Note the items marked in red. If the values marked in red do not appear in your case, it means that your server does not meet the technical requirements. Pay attention to the WebP Support value for the GD library and WEBP in the list of supported extensions for the Imagick library.

In a situation where your server does not meet the technical requirements, please contact your server Administrator. We are not able to help you. Please do not contact us about this matter, because this is a server configuration problem, not a plugin.

REST API måste också vara aktiverat och fungera utan ytterligare begränsningar. Om du har problem med det, kontakta utvecklaren som skapade din webbplats. Han borde lätt hitta problemet med att REST API inte fungerar.

How to check if plugin works?

When you have installed plugin and converted all images, follow these steps:

  1. Run Google Chrome and enable Dev Tools (F12).
  2. Gå till fliken Nätverk och välj filtrering för Img(Bilder).
  3. Refresh your website page.
  4. Check list of loaded images. Note Type column.
  5. If value of webp is there, then everything works fine.
  6. Remember that this plugin does not change URLs. This means that e.g. link will have path to .jpg file, but .jpg.webp file will be loaded instead of original .jpg.
  7. In addition, you can check weight of website before and after using plugin. The difference will be huge!
  8. Mer information: här

Please remember that in default loading mode (via .htaccess) URLs will remain unchanged. When you open the image in a new tab or look at its URL, you’ll see the original URL. When you try to save the image to disk (e.g. by clicking Save as…) the original image will be saved.

WebP is only used when loading a image on a website. In default loading mode (via .htaccess) it is done by the rules from the .htaccess file, on the server side, without the visible URL change to the image. Yes, it can be called magic 🙂

That is why the plugin should be tested in Dev Tools. If the Type of file is WebP, then everything is working properly. You can also turn off the plugin for a moment and check the weight of your website, then turn it on and test again. The difference should be visible.

The operation of the plugin for non-advanced users may sometimes be less understood, but everything is fine. Thanks to this, regardless of whether your browser supports WebP or not, everything works without problems.

Only images from the /uploads directory are automatically converted. If you use other plugins that also save images in the /uploads directory then this may not work. Therefore, check the plugin settings and try converting all images again.

Why are some images not in WebP?

If the converted image in WebP format is larger than the original, the browser will use the original file. This converted file will be deleted. Therefore, you can also see files other than WebP on the list. When this happens, you will receive information in debug.log.

När det händer skapas en fil med namnformatet .webp.deleted. Detta förhindrar förnyad konvertering av bilder som blev större än originalet efter konvertering till WebP. Om alternativet tingad konvertering alla bilder är markerat kommer även denna bild också att konverteras om.

If you want to force the use of WebP files, uncheck the Automatic removal of WebP files larger than original option in the plugin settings. Then click on the Regenerate All button to convert all images again.

Remember that this plugin supports images from the /wp-content directory, e.g. files downloaded from the Media Library. Redirections will not work if your images are downloaded from another domain, i.e. from an external service.

When checking the operation of the plugin, e.g. in Dev Tools, pay attention to the path from which the files are downloaded and which directories you have enabled in the settings of plugin.

Hur ändrar jag sökväg till uppladdningar?

This is possible using the following types of filters to change default paths. It is a solution for advanced users. If you are not, please skip this question.

Sökväg till rotinstallationskatalogen för WordPress (standardvärde: ABSPATH):

add_filter( 'webpc_site_root', function( $path ) {
    return ABSPATH;
} );

Path to /uploads directory (relative to the root directory):

add_filter( 'webpc_dir_name', function( $path, $directory ) {
    if ( $directory !== 'uploads' ) {
        return $path;
    }
    return 'wp-content/uploads';
}, 10, 2 );

Directory path with converted WebP files (relative to the root directory):

add_filter( 'webpc_dir_name', function( $path, $directory ) {
    if ( $directory !== 'webp' ) {
        return $path;
    }
    return 'wp-content/uploads-webpc';
}, 10, 2 );

Note that the /uploads-webpc directory must be at the same nesting level as the /uploads, /plugins and /themes directories.

Prefix in URL of /wp-content/ directory or equivalent (used in .htaccess):

add_filter( 'webpc_uploads_prefix', function( $prefix ) {
    return '/';
} );

For the following sample custom WordPress structure:

...
├── web
    ...
    ├── app
    │   ├── mu-plugins
    │   ├── plugins
    │   ├── themes
    │   └── uploads
    ├── wp-config.php
    ...

Use the following filters:

add_filter( 'webpc_site_root', function( $path ) {
    return 'C:/WAMP/www/project/webp'; // your valid path to root
} );
add_filter( 'webpc_dir_name', function( $path, $directory ) {
    if ( $directory !== 'uploads' ) {
        return $path;
    }
    return 'app/uploads';
}, 10, 2 );
add_filter( 'webpc_dir_name', function( $path, $directory ) {
    if ( $directory !== 'webp' ) {
        return $path;
    }
    return 'app/uploads-webpc';
}, 10, 2 );
add_filter( 'webpc_uploads_prefix', function( $prefix ) {
    return '/';
} );

After setting the filters go to Settings -> WebP Converter in the admin panel and click the Save Changes button. .htaccess files with appropriate rules should be created in the directories /uploads and /uploads-webpc.

How to exclude paths from converting?

To exclude selected directories, use the following filter:

add_filter( 'webpc_supported_source_directory', function( bool $status, string $directory_name, string $server_path ): bool {
    $excluded_directories = [ 'my-directory' ];
    if ( ! $status || in_array( $directory_name, $excluded_directories ) ) {
        return false;
    }

    return $status;
}, 10, 3 );

To exclude selected files use the following filter:

add_filter( 'webpc_supported_source_file', function( bool $status, string $file_name, string $server_path ): bool {
    $excluded_files = [ 'my-image.jpg' ];
    if ( ! $status || in_array( $file_name, $excluded_files ) ) {
        return false;
    }

    return $status;
}, 10, 3 );

Argument $server_path is the absolute server path to a directory or file. Inside the filters, you can apply more complicated rules as needed.

Filters run before images are converted – they no longer support converted images. You have to delete them manually if they should not be converted.

How to run manually conversion?

Som standard konverteras alla bilder när du klickar på knappen Återskapa alla. Dessutom sker konverteringen automatiskt när du lägger till nya filer i ditt mediebibliotek.

Remember that our plugin takes into account images generated by WordPress. There are many plugins that generate, for example, images of a different size or in a different version.

If you would like to integrate with your plugin, which generates images by yourself, you can do it. Our plugin provides the possibility of this type of integration. This works for all images in the /wp-content directory.

It is a solution for advanced users. If you would like to integrate with another plugin, it’s best to contact the author of that plugin and give him information about the actions available in our plugin. This will help you find a solution faster.

You can automatically run the option to regenerate all new images. This is useful when you use external plugins that generate images themselves. To do this, use the following code:

do_action( 'webpc_regenerate_all', $paths );

Nedan följer ett exempel på hur du använder den här åtgärden för att automatiskt återskapa bilder efter att du har ändrat temat:

add_action('init', function() {
    do_action( 'webpc_regenerate_all' );
});

To manually start converting selected files, you can use the action to which you will pass an array with a list of paths (they must be absolute server paths):

do_action( 'webpc_convert_paths', $paths );

En alternativ metod är att manuellt börja konvertera den valda bilagan genom att skicka post-ID från mediebiblioteket. Kom ihåg att köra den här åtgärden efter att du har registrerat alla bildstorlekar (dvs. efter att du har kört funktionen add_image_size function):

do_action( 'webpc_convert_attachment', $post_id );

Argument $paths is array of absolute server paths and $skip_exists means whether to skip converted images.

You can also modify the list of image paths for an attachment, e.g. to exclude one image size. To do this, use the following filter:

add_filter( 'webpc_attachment_paths', function( $paths, $attachment_id ) {
    return $paths;
}, 10, 2 );

Argument $paths is array of absolute server paths and $attachment_id is the post ID of attachment, added to the Media Library.

To delete manually converted files, use the following action, providing as an argument an array of absolute server paths to the files (this will delete manually converted files):

do_action( 'webpc_delete_paths', $paths );

Hur ändrar jag .htaccess-regler?

Manuell redigering av reglerna i .htaccess-filen är en uppgift endast för erfarna utvecklare. Kom ihåg att fel regler kan få din webbplats att sluta fungera.

Below is a list of filters that allow you to modify all rules. Remember that it’s best to use your own rule set rather than edit parts of exists. This will ensure greater failure-free after plugin update.

Returning an empty string will delete these rules the next time you save the plugin settings. You must do this after each filter edit.

Regler för omdirigeringar: (returnerar regler för modulen mod_rewrite):

add_filter( 'webpc_htaccess_mod_rewrite', function( $rules, $path ) {
    return '';
}, 10, 2 );

Argument $path is absolute server path for .htaccess file (/wp-content/.htaccess or /wp-content/uploads/.htaccess).

Rules for image/webp MIME type: (returns rules for mod_mime module):

add_filter( 'webpc_htaccess_mod_mime', function( $rules ) {
    return '';
} );

Regler för webbläsarcachning: (returnerar regler för modulen mod_expires ):

add_filter( 'webpc_htaccess_mod_expires', function( $rules ) {
    return '';
} );

Alla regler från filerna /wp-content/.htaccess, /wp-content/uploads/.htaccess och /wp-content/uploads-webpc/. htaccess : (returnerar regler för moduler: mod_rewrite, mod_mime och mod_expires):

add_filter( 'webpc_htaccess_rules', function( $rules, $path ) {
    return '';
}, 10, 2 );

Argument $path is absolute server path for .htaccess file.

Does plugin support CDN?

Unfortunately not. This is due to the logic of the plugin’s operation. Plugins that enable integration with the CDN servers modify the HTML of the website, changing URLs for media files. This plugin does not modify URLs. Replacing URLs in the HTML code is not an optimal solution.

The main problem when changing URLs is cache. When we modify the image URL for WebP supporting browser, then use the browser without WebP support, it will still have the URL address of an image in .webp format, because it will be in the cache.

While in the case of the img tag you can solve this problem, in the case of background-image it is possible. We wanted full support so that all images would be supported – no matter how they are displayed on the website.

Therefore in this plugin for browsers supporting the WebP format, only the source of the file is replaced by using the mod_rewrite module on the server. The URL for image remains the same. This solves the whole problem, but it is impossible to do when the files are stored on the CDN server.

Om du använder en CDN-server, hitta en som automatiskt omvandlar bilder till WebP-format och skickar korrekt bildformat till webbläsaren.

Konfiguration för Apache

När det gäller Apache, när inställningarna sparas, genereras .htaccess -filer automatiskt på följande platser:
/wp-content/.htaccess
/wp-content/uploads/.htaccess
/wp-content/uploads-webpc/.htaccess

If these files are missing or empty, try disabling and re-enabling the plugin or saving the plugin settings again. Also check the write permissions of the directories where these files are located.

Om din server är en kombination av Apache och Nginx, kom ihåg att bildfilerna måste stödjas av Apache. Först då kommer omdirigeringarna i .htaccess-filen att fungera korrekt. Alternativt kan du använda konfigurationen för Nginx.

Konfiguration för Nginx

This configuration is only required for the image loading mode set to via .htaccess in the plugin settings.

Redigera konfigurationsfilen:
/etc/nginx/mime.types

och lägg till den här kodraden:

types {
    # ...
    image/webp webp;
}

Hitta sedan konfigurationsfilen i en av sökvägarna (kom ihåg att välja konfigurationsfil som används av din vhost):
/etc/nginx/sites-enabled/
/etc/nginx/conf.d/

and add below code in this file (add these lines to very beginning of file if possible – if they will be at the bottom, other rules may block the rules for WebP from working):

server {
    location ~ /wp-content/(?<path>.+)\.(?<ext>jpe?g|png|gif)$ {
        if ($http_accept !~* "image/webp") {
            break;
        }
        add_header Vary Accept;
        add_header Cache-Control "private" always;
        expires 365d;
        try_files /wp-content/uploads-webpc/$path.$ext.webp $uri =404;
    }
    # ...
}

När du har gjort ändringar, kom ihåg att starta om maskinen: systemctl restart nginx.

Configuration for Multisite Network

Multisite Network mode works fine but requires adding configuration manually.

Klistra in följande kod manuellt i början av .htaccess-filen i katalogen /wp-content:

# BEGIN WebP Converter
# ! --- DO NOT EDIT PREVIOUS LINE --- !
<IfModule mod_rewrite.c>
    RewriteEngine On
    RewriteCond %{HTTP_ACCEPT} image/webp
    RewriteCond %{DOCUMENT_ROOT}/wp-content/uploads-webpc/$1.jpg.webp -f
    RewriteRule (.+)\.jpg$ /wp-content/uploads-webpc/$1.jpg.webp [NC,T=image/webp,L]
    RewriteCond %{HTTP_ACCEPT} image/webp
    RewriteCond %{DOCUMENT_ROOT}/wp-content/uploads-webpc/$1.jpeg.webp -f
    RewriteRule (.+)\.jpeg$ /wp-content/uploads-webpc/$1.jpeg.webp [NC,T=image/webp,L]
    RewriteCond %{HTTP_ACCEPT} image/webp
    RewriteCond %{DOCUMENT_ROOT}/wp-content/uploads-webpc/$1.png.webp -f
    RewriteRule (.+)\.png$ /wp-content/uploads-webpc/$1.png.webp [NC,T=image/webp,L]
</IfModule>
<IfModule mod_headers.c>
  Header Set Cache-Control "private"
</IfModule>
# ! --- DO NOT EDIT NEXT LINE --- !
# END WebP Converter

Och följande kod i början av .htaccess-filen i katalogen /wp-content/uploads-webpc:

# BEGIN WebP Converter
# ! --- DO NOT EDIT PREVIOUS LINE --- !
<IfModule mod_mime.c>
    AddType image/webp .webp
</IfModule>
<IfModule mod_expires.c>
    ExpiresActive On
    ExpiresByType image/webp "access plus 1 year"
</IfModule>
<IfModule mod_headers.c>
  Header Set Cache-Control "private"
</IfModule>
# ! --- DO NOT EDIT NEXT LINE --- !
# END WebP Converter

Is the plugin completely free?

Yes. The plugin is completely free.

However, working on plugins and technical support requires many hours of work. If you want to appreciate it, you can provide us a coffee. Thanks everyone!

Tack för alla betyg och recensioner.

If you are satisfied with this plugin, please recommend it to your friends. Every new person using our plugin is valuable to us.

Allt detta är väldigt viktigt för oss och låter oss göra ännu bättre saker åt dig!

Recensioner

19 september 2021
This plugin is awesome. It works flawlessly and has saved a lot of load times for my site.
19 september 2021
its Perfect,tnx but i have a little problem,why this plugin work for all images?its work for 80 or 90% images of website
19 september 2021
The WebP Converter plugin is excellent. It improves the performance of the website and does not present any conflict with the theme or base template, or with the wordpress content manager. 100% recommended!!
18 september 2021
Definitely one of the best free plugins I've ever worked with. Easy to use and extremely effective! My many thanks to Mateusz!
Läs alla 389 betyg

Bidragsgivare och utvecklare

”WebP Converter for Media – Convert WebP & Optimize Images” är programvara med öppen källkod. Följande personer har bidragit till detta tillägg.

Bidragande personer

”WebP Converter for Media – Convert WebP & Optimize Images” har översatts till 12 språk. Tack till översättarna för deras bidrag.

Översätt ”WebP Converter for Media – Convert WebP & Optimize Images” till ditt språk.

Intresserad av programutveckling?

Läs programkoden, kika på SVN-filförvaret eller prenumerera på utvecklarloggen via RSS.

Ändringslogg

3.2.2 (2021-09-26)

  • [Changed] Option ”Force redirections to WebP for all domains” as default
  • [Added] Debug information for regeneration error

3.2.1 (2021-09-12)

  • [Fixed] Skipping converted images when converting all images

3.2.0 (2021-09-12)

  • [Removed] Filter webpc_files_paths
  • [Removed] Filter webpc_dir_excluded
  • [Changed] Error handling when converting images
  • [Added] Filter webpc_supported_source_file to exclude paths to files from converting
  • [Added] Filter webpc_supported_source_directory to exclude paths to directories from converting
  • [Added] Modifications to appearance of plugin settings page

3.1.1 (2021-09-08)

  • [Fixed] Generating .htaccess files for multisite websites
  • [Changed] Fields on plugin settings page
  • [Changed] Server configuration error detection

3.1.0 (2021-09-02)

  • [Fixed] Default state of notice displaying
  • [Added] Error detection for server that does not supports using .htaccess files from custom locations

See changelog.txt for previous versions.