Convert Images to WebP in WordPress | Bulk Image Optimization to Speed Up WordPress Performance

preview_player
Показать описание
WebP is a modern image format that provides superior compression for images on the web. Using WebP, web developers can create smaller, richer images that make the website faster. WebP images are 26% to 34% smaller in size compared to PNG and JPEG. WebP supports transparency in images. You can have transparent WebP images like PNGs. This is image optimization wordpress tutorial where you will learn webp express plugin settings for wordpress image optimization. Question is how to serve images in next-gen formats in wordpress to optimize wordpress for better performance?

If you want to make your website faster, use WebP image format. If you are using WordPress, and you have PNG and JPEG images, you can easily convert all images into WebP.

I have images and these are PNGs and JPEGs. We will convert these all into WebP in WordPress. To do that go to plugins and search for 'WebP Express'. Install and activate it. Go to Settings and WebP Express. For the first time you will have to click at 'Save Settings' to make this plugin work. You can also use 'Save Settings and force htaccess rules'.

Choose Uploads only as a scope. you can also process 'uploads and themes' folders. Image types can be JPEGs and PNGs. For conversion methods, plugin supports a lot of conversion methods. It will use whatever it will find best. For this site, we have 'Graphicsmagik' and 'GD extension' support enabled so plugin is using that.

But site may still be not yet using WebP. We will have to alter HTML. Replace image URLs or Replace img tag with picture tag adding webp as srcset. Save settings. And now we have images in WebP format in our site. Open image in new tab and these are webp instead of png and jpg.

You can also bulk convert images into webp format. As a caution, this plugin uses htaccess rules and HTML alteration. If you move your site, images may stop showing up. You will have to deactivate plugin, activate again, save htaceess rules again, and bulk convert images again to save new paths. Then images will work again. Also this plugin may not work 100% on localhost, so use it on a live site.

If you are new to the channel, subscribe to learn more about web development, web application development, editing wordpress source code, how to create a website using wordpress, developing landing page in wordpress, working with child theme wordpress, custom wordpress theme development, wordpress plugin development, how to build a website with wordpress, create website with wordpress and related web development areas.

- 1000 IMAGES to WebP Conversion in Seconds
- Figma to WebP Image Compression & Conversion
- Convert Image to SVG with Individual Paths | Image to SVG | PNG to SVG | JPG to SVG

Thank You!
👍 LIKE VIDEO
👊 SUBSCRIBE
🔔 PRESS BELL ICON
✍️ COMMENT

#webstylepress #WordPressTutorial #WordPressTraining #WordPressForBeginners #WordpressPlugin #WebDevelopment #WordpressDeveloper #webp
Рекомендации по теме
Комментарии
Автор

I tried multiple plugins such as Imagify and others but could not meet any results. there is a photo in my gallery that i upload and can't reduce its size with any plugin. i don't know what's wrong with that photo and the photo is really necessary to be on my website. Anyway, I am saving this video for the future coz i may need it to delete this new plugin and shift my website to another hosting provider or something like that .... as you mentioned in the end that we need to convert all those images again otherwise they will not display properly.

ProAttique
Автор

sir after enabling alter html in the top it's saying You have configured Alter HTML to make references to WebP files that are yet to exist, but you have not enabled the option that makes these files come true when requested. Do that! how to fix it

krakenbgmi
Автор

I used bulk option since other didn't work, but bulk option just transformed some of images in webp not all of them. Why?

viktormihajlovic
Автор

Please how can i clear cache after it?

anyanwustephensomtochukwu
Автор

This is great and super informative. Thank you so much!!!

RR-okwz
Автор

This Video is Eye Opener Thanks You So Much

electronicmechanic
Автор

the size is the same!!! it really works?? or not?

JerryPisd
Автор

in frontend not show webp i will apply your tutorial

meenakshisharma
Автор

The best way is make webp before upload to wordpress

christianjack
Автор

tried .... 2to 5 images were converted - Will you help me to convert images with webp express (well explained)

globaltech
Автор

I've tried it, not works, images shown as jpg and png, not webp, what I'm doing wrong?

markuspatzer
Автор

Don't know why, but it gets stuck on some images and there is no way to just skip them. Have had this happen on more sites.

johnnystrautins
Автор

Check failed for source path File does not exists or is outside restricted basedir failed. 😢 This error showing

preetimehra
Автор

Did exactly what u did and mines haven’t changed

VybzKartelClassics
Автор

thank you about the video, it helped me 👍🏻

Baliproperty
Автор

Hi, I did exactly as your video but after reload my console is full of errors and can't see my images though extension has been changes to webp. What to do??

rabiyazia
Автор

I must've missed a step. My images now end with .jpg?resize=(then a list of numbers)

Update: I'm trying the Bulk convert option now. Wish me luck that I don't destroy my site.

RoklanReacts