{"id":74443,"date":"2021-05-28T12:32:48","date_gmt":"2021-05-28T04:32:48","guid":{"rendered":"https:\/\/tanyadigital.com\/?p=74443"},"modified":"2021-05-28T12:37:51","modified_gmt":"2021-05-28T04:37:51","slug":"how-to-use-webp-image-in-wordpress","status":"publish","type":"post","link":"https:\/\/tanyadigital.com\/en\/how-to-use-webp-image-in-wordpress\/","title":{"rendered":"3 How to use WebP Images in WordPress"},"content":{"rendered":"<div class=\"tanya-before-content_2\" id=\"tanya-1623037748\"><div class=\"tanya-adlabel\">Iklan<\/div><script async src=\"\/\/pagead2.googlesyndication.com\/pagead\/js\/adsbygoogle.js?client=ca-pub-6179642671783853\" crossorigin=\"anonymous\"><\/script><ins class=\"adsbygoogle\" style=\"display:block;\" data-ad-client=\"ca-pub-6179642671783853\" \ndata-ad-slot=\"\" \ndata-ad-format=\"auto\" data-full-width-responsive=\"true\"><\/ins>\n<script> \n(adsbygoogle = window.adsbygoogle || []).push({}); \n<\/script>\n<\/div><p>Do you want to use WebP images in WordPress?<\/p><p>WebP Images is a modern image format that offers better image compression by reducing the file size. This makes your website load faster and saves bandwidth.<\/p><p>In this article, I will show you how to use WebP images easily in WordPress.<\/p><div class=\"wp-block-image\"><figure class=\"aligncenter\"><img decoding=\"async\" src=\"https:\/\/lh4.googleusercontent.com\/H0zZzwxwk39fxZq2d_FiB7HBJHjNsQk7e5Q9DYCqUsM1bSZaC8CZDwPgPgarudoguPT0Kl3B1MP8oxDUgE5A7D9WeeHK6pFRVrdCkTBNnRLK2M1PAfi0nD8-2z6HfTatWj6cDsef\" alt=\"\"\/><\/figure><\/div><h2 class=\"wp-block-heading\" id=\"h-what-is-webp-why-use-webp-images-in-wordpress\">What is WebP &amp; Why Use WebP Images in WordPress?<\/h2><p>WebP is a new file format for images to be used on the web. By using the WebP image format, your images will be 25-34% smaller than PNG and JPEG without any loss of quality.<\/p><p>If images slow down your website, converting them to the WebP format can improve your page load speed test score.<\/p><div class=\"tanya-content_3\" style=\"margin-top: 15px;margin-bottom: 25px;\" id=\"tanya-1846466709\"><div class=\"tanya-adlabel\">Iklan<\/div><a href=\"https:\/\/api.whatsapp.com\/send?phone=628133960815&#038;text=Halo%20Tanya%20Digital%2C%20Saya%20mau%20pesan%20paket%20SEO%20Enterprise\" target=\"_blank\" aria-label=\"Jasa SEO Enterprise Tanyadigital.com\"><img src=\"https:\/\/tanyadigital.com\/wp-content\/uploads\/2022\/12\/seo-enterprise-tanyadigital.png\" alt=\"Jasa SEO Enterprise Tanyadigital.com\"  srcset=\"https:\/\/tanyadigital.com\/wp-content\/uploads\/2022\/12\/seo-enterprise-tanyadigital.png 878w, https:\/\/tanyadigital.com\/wp-content\/uploads\/2022\/12\/seo-enterprise-tanyadigital-300x147.png 300w, https:\/\/tanyadigital.com\/wp-content\/uploads\/2022\/12\/seo-enterprise-tanyadigital-768x376.png 768w\" sizes=\"(max-width: 878px) 100vw, 878px\" class=\"no-lazyload\" width=\"878\" height=\"430\"  style=\"display: inline-block;\" \/><\/a><\/div><p>To learn more about image compression, see My guide on how to optimize images for the web.<\/p><p>[amp-cta id=&#8217;73465&#8242;]<\/p><div class=\"wp-block-image\"><figure class=\"aligncenter size-large\"><img fetchpriority=\"high\" decoding=\"async\" width=\"1024\" height=\"180\" src=\"https:\/\/tanyadigital.com\/wp-content\/uploads\/2021\/04\/forum.jpg\" alt=\"Forum Komunitas Digital Marketing Indonesia\" class=\"wp-image-73468\" srcset=\"https:\/\/tanyadigital.com\/wp-content\/uploads\/2021\/04\/forum.jpg 1024w, https:\/\/tanyadigital.com\/wp-content\/uploads\/2021\/04\/forum-300x53.jpg 300w, https:\/\/tanyadigital.com\/wp-content\/uploads\/2021\/04\/forum-768x135.jpg 768w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><figcaption>Forum Komunitas Digital Marketing Indonesia<\/figcaption><\/figure><\/div><p>Because WebP is a new file format, it is not supported by all browsers. However, most modern browsers such as Google Chrome, Firefox, and Microsoft Edge support WebP images.<\/p><div class=\"tanya-content_4\" style=\"margin-top: 15px;margin-bottom: 25px;\" id=\"tanya-1197197674\"><div class=\"tanya-adlabel\">Iklan<\/div><script async src=\"\/\/pagead2.googlesyndication.com\/pagead\/js\/adsbygoogle.js?client=ca-pub-6179642671783853\" crossorigin=\"anonymous\"><\/script><ins class=\"adsbygoogle\" style=\"display:block;\" data-ad-client=\"ca-pub-6179642671783853\" \ndata-ad-slot=\"\" \ndata-ad-format=\"auto\" data-full-width-responsive=\"true\"><\/ins>\n<script> \n(adsbygoogle = window.adsbygoogle || []).push({}); \n<\/script>\n<\/div><h2 class=\"wp-block-heading\" id=\"h-should-you-use-webp-images-in-wordpress\">Should you use WebP images in WordPress?<\/h2><p>WebP images can help you speed up your WordPress site. These are recommended best practices for use in conjunction with WordPress caching plugins, CDNs, and more.<\/p><p>By default, WordPress does not support WebP images and uploading WebP images will display an error.<\/p><div class=\"wp-block-image\"><figure class=\"aligncenter\"><img decoding=\"async\" src=\"https:\/\/lh6.googleusercontent.com\/NnIZnfbP2BuDiqu8tDYEI4eWpKakBAB3BlEyJ_xNcOk1hEr5N0VBnc0cuNdS28DhBbWLYXJDoqFkOPiAC31DOLCHv6qBmVMGEpGOLkLdQQZKFZa6k8ScY6g-m0vbFUo90aWNAsuD\" alt=\"\"\/><\/figure><\/div><p>To fix this, you will need to use an image compression plugin to convert the image to the WebP image format. You will still be uploading your images in file formats supported by WordPress such as PNG, JPEG, and GIF, so they can be used as backups.<\/p><p><em><strong>ALSO READ : <a href=\"https:\/\/tanyadigital.com\/en\/what-is-lead-generation\/\">What is Lead Generation? Importance and Purpose in Digital Marketing<\/a><\/strong><\/em><\/p><p>If your site uses a lot of images, and it slows down your WordPress blog, then you should consider using WebP images.<\/p><p>Here&#8217;s how to use WebP images in WordPress. I&#8217;m going to show you a few methods, so you can choose the one that suits you the most:<\/p><ul class=\"wp-block-list\"><li>Using WebP Images in WordPress with the EWWW Optimizer<\/li><li>Using WebP Images in WordPress with WP Rocket<\/li><li>Using WebP Images in WordPress with SG Optimizer<\/li><\/ul><h3 class=\"wp-block-heading\" id=\"h-method-1-using-webp-images-in-wordpress-with-ewww-optimizer\">Method 1. Using WebP Images in WordPress with EWWW Optimizer<\/h3><p>EWWW Image Optimizer Plugin is one of the best WordPress image compression plugins that allows you to optimize your WordPress images. It also supports WebP Images and can automatically display them in supported browsers.<\/p><p>The first thing you need to do is install and activate the EWWW Image Optimizer plugin. For more details, see my step by step guide on how to install a WordPress plugin.<\/p><p>Upon activation, go to Settings \u00bbEWWW Image Optimizer page to configure plugin options. You will be greeted by the setup wizard, but you can click the &#8216;I know what I&#8217;m doing&#8217; link to exit the wizard.<\/p><div class=\"wp-block-image\"><figure class=\"aligncenter\"><img decoding=\"async\" src=\"https:\/\/lh4.googleusercontent.com\/OzQUX-7bIxZvd5f20zZAwvDUUvi35dDZi3_cxayyrRRM0C_M_vdM-0ci_2JUyuwl1rTkMkvdzr8pTYuRaXOCqacL_aTEXh4VmZIquKDdhbKt4ov4PyxvhTkgIrM-Djd-ZWks7Xkg\" alt=\"\"\/><\/figure><\/div><p>On the next screen, you will see many plugin options. Scroll down and check the box next to the &#8216;WebP Conversion&#8217; option.<\/p><div class=\"wp-block-image\"><figure class=\"aligncenter\"><img decoding=\"async\" src=\"https:\/\/lh4.googleusercontent.com\/L-N6CiBfwyoTwU0EzaZiilrWnKgdOrb0-ctYD-q798MAR99Aowp1oOqcnWFAb97y3HqWg25J03Zu1kztLtyzemlwZwTwv0PtZlBpFNXFBTACvcyJ7YVPRgAoGxS2XL4BK-BQ8UhY\" alt=\"\"\/><\/figure><\/div><p>After that, click on the Save Changes button to store your settings.<\/p><p>Next, you need to scroll down to the WebP Conversion section. The plugin will now show you some rewrite rules with a red preview image.<\/p><p>You need to click on the &#8216;Insert Rewrite Rules&#8217; button, and the plugin will automatically try to insert these rewrite rules into your .htaccess file.<\/p><div class=\"wp-block-image\"><figure class=\"aligncenter\"><img decoding=\"async\" src=\"https:\/\/lh3.googleusercontent.com\/5MFCn9Ov7QBWGXY_4_lykLEV-WiAtL0TTHiLR9dk05rgmZ0Qp2MdjxNk3SVdsYBz5n2Donl-kPBCX8bJDTTCtw_bCoBBU4wwiFpI26-SourDV7t6J48gOg83LlEg3XmvQ6YAP8t3\" alt=\"\"\/><\/figure><\/div><p>If the plugin succeeds in adding the rule, the red image preview will turn green with the text &#8216;WebP&#8217;.<\/p><div class=\"wp-block-image\"><figure class=\"aligncenter\"><img decoding=\"async\" src=\"https:\/\/lh5.googleusercontent.com\/cuo7FDyxigIeMRetR0-wi1sxT2l6EvdFkO4aiBfvYYvJn8i80KqLjEJR6IDbXiWUUMX6g_PVQc1_DAPzFGDQMdwox--pe0lVvDUcdEmtAlL0HuKzzk1cmTSzwK_saHZQ9fv0l7fl\" alt=\"\"\/><\/figure><\/div><p>Sometimes, plugins may not be able to enter rules. If so, you will need to copy the rewrite rules from the plugin&#8217;s settings page and paste them at the bottom of your .htaccess file manually.<\/p><p>Once you are done, return to the plugin&#8217;s settings page and click the Save Changes button again. If the preview image turns green, it means that you have successfully enabled WebP image submission on your WordPress site.<\/p><p>Alternatively, you can choose from the JS WebP Rewrite method or the WebP Rewrite method as your WebP submission option. It&#8217;s a little slower than the .htaccess method, but will get the job done.<\/p><p><strong>Bulk Convert your Old Image to WebP Version<\/strong><\/p><p>EWWW Image Optimizer lets you easily convert previously uploaded image files to WebP images. Just head over to the Media \u00bbLibrary page and switch to list view.<\/p><div class=\"wp-block-image\"><figure class=\"aligncenter\"><img decoding=\"async\" src=\"https:\/\/lh6.googleusercontent.com\/9ALw1ZbQgblXf3EnYKoU8CcOJamjyynpvG-zbdGfsQ1RKaO369zNNd9ImM835gvHAxY0H662FHou37-ogz6B2Zh71s2n-Ygelp5cPyziyVwEns15qRQoPAdt48rNBVCPGLgrp-Fd\" alt=\"\"\/><\/figure><\/div><p>Next, you need to click the Screen Options button and change the &#8216;Number of items per page&#8217; to 999. If you have 1000+ images, that image will appear on the next page.<\/p><p>This way you will be able to quickly select a large number of images for bulk optimization. Next, click on the Select All checkbox at the top to select all images.<\/p><div class=\"wp-block-image\"><figure class=\"aligncenter\"><img decoding=\"async\" src=\"https:\/\/lh6.googleusercontent.com\/E4uyoEOb04_WxujEvr-rqm7BcbC-ywFzkLcrr9gI8t_RZLNQKrAeKuMgxZnvwwaND0wFuCwxZebg6hlCjfQtgFwMJysVaEU-yVdPnOtGz9L81akhV_z3WEqYZ4iviYI26VddRj8m\" alt=\"\"\/><\/figure><\/div><p>After that, click the Bulk Actions drop-down menu and select the Bulk Actions option. Finally, click the Apply button.<\/p><p>On the next screen, the plugin will give you the option to skip image compression and just convert it to WebP. You can check this option if your image is already optimized.<\/p><div class=\"wp-block-image\"><figure class=\"aligncenter\"><img decoding=\"async\" src=\"https:\/\/lh5.googleusercontent.com\/_1GgZTdukk-4c5OtzxWBi0R0YD5M52yn_k7-eSUcx2KgTM8Gxx8gjLoC8f6EiZhcjkBEB7KXU2YDSCQVZmpJqKHaOlKjDJNeIbcxR9Nj2q3hQkQNFYe5RAVEFP5c-00-zH7j_zIS\" alt=\"\"\/><\/figure><\/div><p>After that, click on the &#8216;Scan for Unoptimized Images&#8217; button to continue. The plugin will then show you the number of images found, so you can click the Optimize button to continue.<\/p><p>Your image will now be optimized, and the EWWW optimizer will generate a WebP version of your image.<\/p><div class=\"wp-block-image\"><figure class=\"aligncenter\"><img decoding=\"async\" src=\"https:\/\/lh3.googleusercontent.com\/6RTpKkW5I66mx8g8wwRPnQfNAUn7BXPGjphI9uuLXXi4W93AJrWajzCwydJfCpNp3fp3TKZY9NCWQZtRQXBruDN4WEscB0If_rRIYfdN5sdopc54JalBfh3LoRi0LHGuY_MFW6-u\" alt=\"\"\/><\/figure><\/div><p><strong><strong>Menguji Pengiriman Gambar WebP kamu<\/strong><\/strong><\/p><p>Setelah kamu mengoptimalkan gambar kamu, kamu dapat pergi ke posting blog atau halaman yang berisi beberapa gambar. Arahkan mouse ke gambar mana pun dan klik kanan untuk membuka gambar di tab baru.<\/p><p>This will open the image in a new browser tab, and you will be able to see that it has a .webp extension in the address bar.<\/p><div class=\"wp-block-image\"><figure class=\"aligncenter\"><img decoding=\"async\" src=\"https:\/\/lh4.googleusercontent.com\/84nc2bmgTFIQM_Zd4f44MI1AP1LqE3pExtWWrSNDq7FK0E_aaY2DukXZ09Ssdk2VqOZiKjOmZePCtHqhgTgH3TIUflbW_yo3WbSuuJqOHmVuR4KiG8ONN-OUkRX0GOrUqrkeRrjg\" alt=\"\"\/><\/figure><\/div><p>If the plugin cannot display webp images, you can return to the plugin&#8217;s settings page. From here, you can change your WebP submission option to the &#8216;JS WebP Rewriting&#8217; or &#8216; WebP Rewriting&#8217; method.<\/p><h3 class=\"wp-block-heading\" id=\"h-method-2-using-webp-images-in-wordpress-with-imagify\">Method 2. Using WebP Images in WordPress with Imagify<\/h3><p>Imagify is a WordPress image optimization plugin made by the people behind WP Rocket, the best WordPress caching plugin. It allows you to easily optimize and convert images to the WebP image format.<\/p><p>The first thing you need to do is install and activate the Imagify plugin. For more details, see my step by step guide on how to install a WordPress plugin.<\/p><p>Upon activation, you will need to visit the Settings \u00bbImagify page to configure the plugin settings. From here. click on the &#8216;Generate Free API Key&#8217; button to continue.<\/p><div class=\"wp-block-image\"><figure class=\"aligncenter\"><img decoding=\"async\" src=\"https:\/\/lh6.googleusercontent.com\/6dkopo8d8EN57bqTEIL3MPWON0e-UQD0pdeg5wKpIucRBVWKflQ_Q79WtDaZMBUN4Y1tQIRKd2SRpvDKsHKBH_hCYxq0tUPVFRNJSS7kgJ1HF3amDol_kZa_6izzoMmAKXzfHA9B\" alt=\"\"\/><\/figure><\/div><p>You will be asked to enter your business email address after which you can check your inbox for an email containing your API key. Copy and paste the key on plugin&#8217;s settings page and click on the Save Changes button.<\/p><p><strong><em>ALSO READ : <a href=\"https:\/\/tanyadigital.com\/en\/how-to-testing-facebook-ads\/\">How to Testing Facebook Ads and Getting Optimal Results<\/a><\/em><\/strong><\/p><p>Next, you need to scroll down to the Optimization section. There you need to check the options beside the &#8216;Create webp versions of images&#8217; and &#8216;Display images in webp format on the site&#8217; options.<\/p><div class=\"wp-block-image\"><figure class=\"aligncenter\"><img decoding=\"async\" src=\"https:\/\/lh3.googleusercontent.com\/yKgywBVXe8VT1Va47AUohd_t404TQzxB6OJxICkouAggeob-Y1L7sT-qoVLjh7Tq8jqdFw8y_UNzNRIkxoNa6Ik2dLj0r2ERRNkW0WsYgXBgXw4HR3ey8JvM22Rxi8B5QUDiy_AD\" alt=\"\"\/><\/figure><\/div><p>Below that, you can choose from two submission methods to display WebP images in WordPress. The first is the .htaccess method, and the second is by using the tag.<\/p><p>The .htaccess method is faster, but doesn&#8217;t work if you are using a CDN service. The tag method also works with CDNs, but it can break some WordPress themes.<\/p><p>You can choose the one that works well for your site. After that, click on the &#8216;Save &amp; go to bulk optimizer&#8217; button at the bottom.<\/p><div class=\"wp-block-image\"><figure class=\"aligncenter\"><img decoding=\"async\" src=\"https:\/\/lh4.googleusercontent.com\/w6ZfV0JYWQxr1eGjtc1vsJbMWkiyb1jTOGyJRbFg5kzUqr3Xp31HmYvJFg5ZzSKJyRizPEAMD301x3HazmYfdav8wDc_XLLK5FttG-ewegzZwZsSElra4A1gGrrJ7PyQkv_qQIHX\" alt=\"\"\/><\/figure><\/div><p>This will take you to the Media \u00bbBulk Optimization page. The plugin will automatically start optimizing all your WordPress images in the background.<\/p><div class=\"wp-block-image\"><figure class=\"aligncenter\"><img decoding=\"async\" src=\"https:\/\/lh6.googleusercontent.com\/4dXRcqHMLn1YWHxw03rWgd9h9i3S21TrHXHcaHXfsjo0hHAS4hMEN90AWzkjn49l_vepSYbVJfmIqgHLxfqevS5bIaQ9FdKAkO8xZFDKndCpwVHw0sgMZjzOLhO7I587ZCzVTXIG\" alt=\"\"\/><\/figure><\/div><p>If you have a lot of pictures, it might take a while. Don&#8217;t worry, you can close the page and come back later because closing the page won&#8217;t stop the image optimization process.<\/p><p><strong>Testing your WebP images in WordPress<\/strong><\/p><p>After the optimization is complete, you can visit a page or post that contains multiple images. Hover your mouse over the image, then right click to select &#8216;Open image in new tab&#8217;.<\/p><p>This will open the image in a new browser tab, and you will be able to see the .webp extension in the address bar.<\/p><div class=\"wp-block-image\"><figure class=\"aligncenter\"><img decoding=\"async\" src=\"https:\/\/lh5.googleusercontent.com\/15qe839Gl3g2VaPrZYTIJBzpHzJEXhRNAmeB7Jsp_UqB_1Hc7Ff4thnfHsNP63--57xNb9w4iivdR9MrC5SsVGh4HB6OK_xh87Wa-ITnc3VhJ0zg0K2KrKdhfp_o1V8P7E0Zm8NJ\" alt=\"\"\/><\/figure><\/div><h3 class=\"wp-block-heading\" id=\"h-method-3-using-webp-images-in-wordpress-with-sg-optimizer\">Method 3. Using WebP Images in WordPress with SG Optimizer<\/h3><p>This method is recommended if you are a SiteGround user.<\/p><p>SiteGround is one of the best <a href=\"https:\/\/wordpress.com\">WordPress<\/a> hosting companies. They offer a free SG Optimizer plugin for their users which allows you to optimize the performance of your WordPress. It also includes options for optimizing WordPress images.<\/p><p>First, you need to install and activate the SG Optimizer plugin.<\/p><p>Upon activation, the plugin will add a new menu item to your admin sidebar labeled &#8216;SG Optimizer&#8217;. Clicking on it will take you to the plugin&#8217;s settings page.<\/p><div class=\"wp-block-image\"><figure class=\"aligncenter\"><img decoding=\"async\" src=\"https:\/\/lh3.googleusercontent.com\/S3D5ovBVOInQypfojxNwULTryG6DSJEdMWqq6SBRyOSZwg7cRLBV4N88vmcVE11FXX7EpYyGEQVle3oR5V6h173lWs5shigyOb1_rcL_o2HBs42a5iomz9KcsCzZwWi4S69BhmtH\" alt=\"\"\/><\/figure><\/div><p>From here you can enable cache settings if you wish to use SiteGround&#8217;s built-in cache system.<\/p><p>After that, you can switch to the Media Optimization tab and enable the &#8216;Generate WebP Copies of New Images&#8217; option.<\/p><div class=\"wp-block-image\"><figure class=\"aligncenter\"><img decoding=\"async\" src=\"https:\/\/lh6.googleusercontent.com\/bRh-udXLtrMkchDT0ajPxL4OZXHCC9MpL67d2GB27YjBhPVnU6HIG5nfVUihPlJIoS0WHOkDlXtfWjWrD3NNBQf8ulMuhx2LwjcEK04NjlT-pt2iAX0MrCC4AiDnWrIEzdPZBqV6\" alt=\"\"\/><\/figure><\/div><p>Below that, you will see an option for &#8216;Bulk Generate WebP Files&#8217;. Clicking on it will start generating WebP copies for all image files in your WordPress media library.<\/p><div class=\"wp-block-image\"><figure class=\"aligncenter\"><img decoding=\"async\" src=\"https:\/\/lh5.googleusercontent.com\/vz5embw8nW1TQlfSjv08ZAKe8dS0Z4UPi6F-5kypF0m6_ZQxi2_isRu6pyK2qWKEAV-72jM3hy8e20i-5SUdBg2SfzmyzyFL9KG0AckiF2q0E7aluKzyxg1gvapRXjQSEnNpoXGO\" alt=\"\"\/><\/figure><\/div><p>Once done, your WordPress site will start displaying WebP images.<\/p><p><strong>Testing WebP Images in SG Optimizer<\/strong><\/p><p>To see if your website serves WebP images, you need to open a page on your site with a few images.<\/p><p>After that right click and select Inspect tool. This will open the developer console where you need to switch to the Network tab.<\/p><div class=\"wp-block-image\"><figure class=\"aligncenter\"><img decoding=\"async\" src=\"https:\/\/lh6.googleusercontent.com\/4qtNtJ4fA6QOmCLVqEZmDO3AmlTQ6gYX4iQjZM9mXH9scDgrG44x7_1vjXJq_LoSeeWnDx0oKmsPqutVunGrN1gud-2iynGOb-u6dGbqMMsAdb3s6h-ub2kHflFmH2z8fYjbA9lO\" alt=\"\"\/><\/figure><\/div><p>From here, click on the &#8216;img&#8217; tab then reload the page (CTRL + R on Windows and Command + R on Mac). When your website is reloaded, you will see all the images loaded in the developer console.<\/p>","protected":false},"excerpt":{"rendered":"<p>Do you want to use WebP images in WordPress? WebP Images is a modern image format that offers better image compression by reducing the file size. This makes your website load faster and saves bandwidth. In this article, I will show you how to use WebP images easily in WordPress. What is WebP &amp; Why [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":73993,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_mi_skip_tracking":false,"_jetpack_memberships_contains_paid_content":false,"footnotes":""},"categories":[71,67],"tags":[],"class_list":["post-74443","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-content-marketing","category-search-engine-optimization"],"yoast_head":"<!-- This site is optimized with the Yoast SEO Premium plugin v19.7 (Yoast SEO v20.1) - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>3 How to use WebP Images in Wordpress - Tanya Digital<\/title>\n<meta name=\"description\" content=\"3 how to use WebP images in Wordpress step by step using wordpress plugin. With these method you can optimize speed your website.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/tanyadigital.com\/en\/how-to-use-webp-image-in-wordpress\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"3 How to use WebP Images in Wordpress\" \/>\n<meta property=\"og:description\" content=\"3 how to use WebP images in Wordpress step by step using wordpress plugin. With these method you can optimize speed your website.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/tanyadigital.com\/en\/how-to-use-webp-image-in-wordpress\/\" \/>\n<meta property=\"og:site_name\" content=\"Full Service Digital Marketing\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/tanyadigitaldotcom\" \/>\n<meta property=\"article:author\" content=\"https:\/\/www.facebook.com\/charlesjansens\" \/>\n<meta property=\"article:published_time\" content=\"2021-05-28T04:32:48+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2021-05-28T04:37:51+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/tanyadigital.com\/wp-content\/uploads\/2021\/05\/cara-menggunakan-gambar-webp-wordpress.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"1000\" \/>\n\t<meta property=\"og:image:height\" content=\"667\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"author\" content=\"Yansens Charles\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@charlesjansens\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Yansens Charles\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"8 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":[\"Article\",\"NewsArticle\"],\"@id\":\"https:\/\/tanyadigital.com\/en\/how-to-use-webp-image-in-wordpress\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/tanyadigital.com\/en\/how-to-use-webp-image-in-wordpress\/\"},\"author\":{\"name\":\"Yansens Charles\",\"@id\":\"https:\/\/tanyadigital.com\/#\/schema\/person\/b679f76f30f69501e4b2c3548d3692b3\"},\"headline\":\"3 How to use WebP Images in WordPress\",\"datePublished\":\"2021-05-28T04:32:48+00:00\",\"dateModified\":\"2021-05-28T04:37:51+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/tanyadigital.com\/en\/how-to-use-webp-image-in-wordpress\/\"},\"wordCount\":1616,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\/\/tanyadigital.com\/#organization\"},\"articleSection\":[\"CONTENT\",\"SEO\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/tanyadigital.com\/en\/how-to-use-webp-image-in-wordpress\/#respond\"]}],\"copyrightYear\":\"2021\",\"copyrightHolder\":{\"@id\":\"https:\/\/tanyadigital.com\/#organization\"}},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/tanyadigital.com\/en\/how-to-use-webp-image-in-wordpress\/\",\"url\":\"https:\/\/tanyadigital.com\/en\/how-to-use-webp-image-in-wordpress\/\",\"name\":\"3 How to use WebP Images in Wordpress - Tanya Digital\",\"isPartOf\":{\"@id\":\"https:\/\/tanyadigital.com\/#website\"},\"datePublished\":\"2021-05-28T04:32:48+00:00\",\"dateModified\":\"2021-05-28T04:37:51+00:00\",\"description\":\"3 how to use WebP images in Wordpress step by step using wordpress plugin. With these method you can optimize speed your website.\",\"breadcrumb\":{\"@id\":\"https:\/\/tanyadigital.com\/en\/how-to-use-webp-image-in-wordpress\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/tanyadigital.com\/en\/how-to-use-webp-image-in-wordpress\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/tanyadigital.com\/en\/how-to-use-webp-image-in-wordpress\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/tanyadigital.com\/en\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"3 How to use WebP Images in WordPress\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/tanyadigital.com\/#website\",\"url\":\"https:\/\/tanyadigital.com\/\",\"name\":\"Full Service Digital Marketing\",\"description\":\"Tanya Digital\",\"publisher\":{\"@id\":\"https:\/\/tanyadigital.com\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/tanyadigital.com\/?s={search_term_string}\"},\"query-input\":\"required name=search_term_string\"}],\"inLanguage\":\"en-US\"},{\"@type\":[\"Organization\",\"Place\"],\"@id\":\"https:\/\/tanyadigital.com\/#organization\",\"name\":\"Tanya Digital\",\"url\":\"https:\/\/tanyadigital.com\/\",\"logo\":{\"@id\":\"https:\/\/tanyadigital.com\/en\/how-to-use-webp-image-in-wordpress\/#local-main-organization-logo\"},\"image\":{\"@id\":\"https:\/\/tanyadigital.com\/en\/how-to-use-webp-image-in-wordpress\/#local-main-organization-logo\"},\"sameAs\":[\"https:\/\/www.facebook.com\/tanyadigitaldotcom\",\"https:\/\/www.linkedin.com\/company\/tanyadigital\/\",\"https:\/\/www.youtube.com\/c\/tanyadigital\"],\"openingHoursSpecification\":[{\"@type\":\"OpeningHoursSpecification\",\"dayOfWeek\":[\"Monday\",\"Tuesday\",\"Wednesday\",\"Thursday\",\"Friday\",\"Saturday\",\"Sunday\"],\"opens\":\"09:00\",\"closes\":\"17:00\"}]},{\"@type\":\"Person\",\"@id\":\"https:\/\/tanyadigital.com\/#\/schema\/person\/b679f76f30f69501e4b2c3548d3692b3\",\"name\":\"Yansens Charles\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/tanyadigital.com\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/961f0ddd81058b71a4da930095c105d765baec1e62e2c8db458e30ccb7aaea63?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/961f0ddd81058b71a4da930095c105d765baec1e62e2c8db458e30ccb7aaea63?s=96&d=mm&r=g\",\"caption\":\"Yansens Charles\"},\"description\":\"Digital Marketer: Facebook, Google Ads, Intagram Ads, SEO Specialist, SEO Content Writer, SEO Copywriter, Blogger\",\"sameAs\":[\"https:\/\/tanyadigital.com\",\"https:\/\/www.facebook.com\/charlesjansens\",\"https:\/\/www.instagram.com\/charlesjansens\",\"https:\/\/www.linkedin.com\/in\/charlesjansens\/\",\"https:\/\/twitter.com\/charlesjansens\",\"https:\/\/www.youtube.com\/c\/tanyadigital\"],\"url\":\"https:\/\/tanyadigital.com\/en\/author\/charles\/\"},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/tanyadigital.com\/en\/how-to-use-webp-image-in-wordpress\/#local-main-organization-logo\",\"url\":\"https:\/\/tanyadigital.com\/wp-content\/uploads\/2022\/05\/logo-amp-td-baru.png\",\"contentUrl\":\"https:\/\/tanyadigital.com\/wp-content\/uploads\/2022\/05\/logo-amp-td-baru.png\",\"width\":794,\"height\":158,\"caption\":\"Tanya Digital\"}]}<\/script>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"3 How to use WebP Images in Wordpress - Tanya Digital","description":"3 how to use WebP images in Wordpress step by step using wordpress plugin. With these method you can optimize speed your website.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/tanyadigital.com\/en\/how-to-use-webp-image-in-wordpress\/","og_locale":"en_US","og_type":"article","og_title":"3 How to use WebP Images in Wordpress","og_description":"3 how to use WebP images in Wordpress step by step using wordpress plugin. With these method you can optimize speed your website.","og_url":"https:\/\/tanyadigital.com\/en\/how-to-use-webp-image-in-wordpress\/","og_site_name":"Full Service Digital Marketing","article_publisher":"https:\/\/www.facebook.com\/tanyadigitaldotcom","article_author":"https:\/\/www.facebook.com\/charlesjansens","article_published_time":"2021-05-28T04:32:48+00:00","article_modified_time":"2021-05-28T04:37:51+00:00","og_image":[{"width":1000,"height":667,"url":"https:\/\/tanyadigital.com\/wp-content\/uploads\/2021\/05\/cara-menggunakan-gambar-webp-wordpress.jpg","type":"image\/jpeg"}],"author":"Yansens Charles","twitter_card":"summary_large_image","twitter_creator":"@charlesjansens","twitter_misc":{"Written by":"Yansens Charles","Est. reading time":"8 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":["Article","NewsArticle"],"@id":"https:\/\/tanyadigital.com\/en\/how-to-use-webp-image-in-wordpress\/#article","isPartOf":{"@id":"https:\/\/tanyadigital.com\/en\/how-to-use-webp-image-in-wordpress\/"},"author":{"name":"Yansens Charles","@id":"https:\/\/tanyadigital.com\/#\/schema\/person\/b679f76f30f69501e4b2c3548d3692b3"},"headline":"3 How to use WebP Images in WordPress","datePublished":"2021-05-28T04:32:48+00:00","dateModified":"2021-05-28T04:37:51+00:00","mainEntityOfPage":{"@id":"https:\/\/tanyadigital.com\/en\/how-to-use-webp-image-in-wordpress\/"},"wordCount":1616,"commentCount":0,"publisher":{"@id":"https:\/\/tanyadigital.com\/#organization"},"articleSection":["CONTENT","SEO"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/tanyadigital.com\/en\/how-to-use-webp-image-in-wordpress\/#respond"]}],"copyrightYear":"2021","copyrightHolder":{"@id":"https:\/\/tanyadigital.com\/#organization"}},{"@type":"WebPage","@id":"https:\/\/tanyadigital.com\/en\/how-to-use-webp-image-in-wordpress\/","url":"https:\/\/tanyadigital.com\/en\/how-to-use-webp-image-in-wordpress\/","name":"3 How to use WebP Images in Wordpress - Tanya Digital","isPartOf":{"@id":"https:\/\/tanyadigital.com\/#website"},"datePublished":"2021-05-28T04:32:48+00:00","dateModified":"2021-05-28T04:37:51+00:00","description":"3 how to use WebP images in Wordpress step by step using wordpress plugin. With these method you can optimize speed your website.","breadcrumb":{"@id":"https:\/\/tanyadigital.com\/en\/how-to-use-webp-image-in-wordpress\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/tanyadigital.com\/en\/how-to-use-webp-image-in-wordpress\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/tanyadigital.com\/en\/how-to-use-webp-image-in-wordpress\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/tanyadigital.com\/en\/"},{"@type":"ListItem","position":2,"name":"3 How to use WebP Images in WordPress"}]},{"@type":"WebSite","@id":"https:\/\/tanyadigital.com\/#website","url":"https:\/\/tanyadigital.com\/","name":"Full Service Digital Marketing","description":"Tanya Digital","publisher":{"@id":"https:\/\/tanyadigital.com\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/tanyadigital.com\/?s={search_term_string}"},"query-input":"required name=search_term_string"}],"inLanguage":"en-US"},{"@type":["Organization","Place"],"@id":"https:\/\/tanyadigital.com\/#organization","name":"Tanya Digital","url":"https:\/\/tanyadigital.com\/","logo":{"@id":"https:\/\/tanyadigital.com\/en\/how-to-use-webp-image-in-wordpress\/#local-main-organization-logo"},"image":{"@id":"https:\/\/tanyadigital.com\/en\/how-to-use-webp-image-in-wordpress\/#local-main-organization-logo"},"sameAs":["https:\/\/www.facebook.com\/tanyadigitaldotcom","https:\/\/www.linkedin.com\/company\/tanyadigital\/","https:\/\/www.youtube.com\/c\/tanyadigital"],"openingHoursSpecification":[{"@type":"OpeningHoursSpecification","dayOfWeek":["Monday","Tuesday","Wednesday","Thursday","Friday","Saturday","Sunday"],"opens":"09:00","closes":"17:00"}]},{"@type":"Person","@id":"https:\/\/tanyadigital.com\/#\/schema\/person\/b679f76f30f69501e4b2c3548d3692b3","name":"Yansens Charles","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/tanyadigital.com\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/961f0ddd81058b71a4da930095c105d765baec1e62e2c8db458e30ccb7aaea63?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/961f0ddd81058b71a4da930095c105d765baec1e62e2c8db458e30ccb7aaea63?s=96&d=mm&r=g","caption":"Yansens Charles"},"description":"Digital Marketer: Facebook, Google Ads, Intagram Ads, SEO Specialist, SEO Content Writer, SEO Copywriter, Blogger","sameAs":["https:\/\/tanyadigital.com","https:\/\/www.facebook.com\/charlesjansens","https:\/\/www.instagram.com\/charlesjansens","https:\/\/www.linkedin.com\/in\/charlesjansens\/","https:\/\/twitter.com\/charlesjansens","https:\/\/www.youtube.com\/c\/tanyadigital"],"url":"https:\/\/tanyadigital.com\/en\/author\/charles\/"},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/tanyadigital.com\/en\/how-to-use-webp-image-in-wordpress\/#local-main-organization-logo","url":"https:\/\/tanyadigital.com\/wp-content\/uploads\/2022\/05\/logo-amp-td-baru.png","contentUrl":"https:\/\/tanyadigital.com\/wp-content\/uploads\/2022\/05\/logo-amp-td-baru.png","width":794,"height":158,"caption":"Tanya Digital"}]}},"jetpack_sharing_enabled":true,"jetpack_featured_media_url":"https:\/\/tanyadigital.com\/wp-content\/uploads\/2021\/05\/cara-menggunakan-gambar-webp-wordpress.jpg","_links":{"self":[{"href":"https:\/\/tanyadigital.com\/en\/wp-json\/wp\/v2\/posts\/74443","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/tanyadigital.com\/en\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/tanyadigital.com\/en\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/tanyadigital.com\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/tanyadigital.com\/en\/wp-json\/wp\/v2\/comments?post=74443"}],"version-history":[{"count":0,"href":"https:\/\/tanyadigital.com\/en\/wp-json\/wp\/v2\/posts\/74443\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/tanyadigital.com\/en\/wp-json\/wp\/v2\/media\/73993"}],"wp:attachment":[{"href":"https:\/\/tanyadigital.com\/en\/wp-json\/wp\/v2\/media?parent=74443"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/tanyadigital.com\/en\/wp-json\/wp\/v2\/categories?post=74443"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/tanyadigital.com\/en\/wp-json\/wp\/v2\/tags?post=74443"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}