{"id":375209,"date":"2023-04-04T04:28:24","date_gmt":"2023-04-04T04:28:24","guid":{"rendered":"https:\/\/webkul.com\/blog\/?p=375209"},"modified":"2024-10-15T07:53:55","modified_gmt":"2024-10-15T07:53:55","slug":"how-to-use-webp-images-in-woocommerce","status":"publish","type":"post","link":"https:\/\/webkul.com\/blog\/how-to-use-webp-images-in-woocommerce\/","title":{"rendered":"How to use WebP Images in WooCommerce"},"content":{"rendered":"\n<div class=\"wk-index-wrap\"><div class=\"block-wrap\">\n<h3 class=\"wp-block-heading index-title\">Introduction<\/h3>\n<\/div><\/div>\n\n\n\n<p>A cutting-edge image format called WebP offers better lossless and lossy compression for images on the internet. Webmasters and web developers\u00a0can produce smaller, richer images using WebP that speed up the web.<\/p>\n\n\n\n<p>When compared to PNGs, WebP lossless pictures are 26% smaller in size. WebP lossy images at equivalent SSIM quality index are 25\u201334% smaller than comparable JPEG images.<\/p>\n\n\n\n<p>Transparency (also known as the alpha channel) is supported by lossless WebP at a cost of only 22% more data. Lossy WebP also allows transparency for situations where lossy RGB compression is acceptable, usually offering 3 smaller file sizes than PNG.&nbsp;<\/p>\n\n\n\n<p>Animated WebP pictures can offer smaller sizes than GIF and APNG because they can support lossy, lossless, and transparency.<\/p>\n\n\n\n<div class=\"wk-index-wrap\"><div class=\"block-wrap\">\n<h3 class=\"wp-block-heading index-title\">Why choose Webp<\/h3>\n<\/div><\/div>\n\n\n\n<p>WebP images typically have a 25\u201335% reduction in file size compared to their JPEG and PNG peers. This reduces web page sizes and enhances the performance.<\/p>\n\n\n\n<blockquote class=\"wp-block-quote is-layout-flow wp-block-quote-is-layout-flow\">\n<p>According to YouTube, switching to WebP thumbnails speed up website loads by 10%.<\/p>\n\n\n\n<p>When Facebook moved to using WebP, they saw savings of 25\u201335% in file size for JPEGs and 80% in file size for PNGs.<\/p>\n<\/blockquote>\n\n\n\n<div class=\"wk-index-wrap\"><div class=\"block-wrap\">\n<h3 class=\"wp-block-heading index-title\">How WebP Works<\/h3>\n<\/div><\/div>\n\n\n\n<p>Lossy WebP compression uses optimize and predictive coding for encode the images, the same method used by the VP8 video codec to compress keyframes in videos. <\/p>\n\n\n\n<p>In predictive coding, the values of adjacent blocks of pixels are used to forecast the values in a block, and only the difference is encoded.<\/p>\n\n\n\n<div class=\"wk-index-wrap\"><div class=\"block-wrap\">\n<h3 class=\"wp-block-heading index-title\">WebP Support<\/h3>\n<\/div><\/div>\n\n\n\n<p>Now a days WebP is default support on different browser like Chrome, Safari, Firefox, Edge, Opera and many other tools and libraries.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img decoding=\"async\" width=\"800\" height=\"447\" src=\"https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2023\/04\/webp-compatibility-with-browser.png\" alt=\"webp-compatibility-with-browser\" class=\"wp-image-375336\" srcset=\"https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2023\/04\/webp-compatibility-with-browser.png 800w, https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2023\/04\/webp-compatibility-with-browser-300x168.png 300w, https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2023\/04\/webp-compatibility-with-browser-250x140.png 250w, https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2023\/04\/webp-compatibility-with-browser-768x429.png 768w\" sizes=\"(max-width: 800px) 100vw, 800px\" loading=\"lazy\" \/><\/figure>\n\n\n\n<div class=\"wk-index-wrap\"><div class=\"block-wrap\">\n<h3 class=\"wp-block-heading index-title\">Convert images to WebP<\/h3>\n<\/div><\/div>\n\n\n\n<p>Some of the popular tool for converting images to WebP: <a href=\"https:\/\/developers.google.com\/speed\/webp\/docs\/using\" target=\"_blank\" rel=\"noreferrer noopener nofollow\">cwebp<\/a> command line tool, <a href=\"https:\/\/github.com\/imagemin\/imagemin-webp\" target=\"_blank\" rel=\"noreferrer noopener nofollow\">imagemin webp<\/a>.<\/p>\n\n\n\n<p>The Imagemin WebP plugin is generally the best choice if your project uses build scripts or build tools (e.g. Webpack or Gulp), whereas the CLI is a good choice for simple projects or if you&#8217;ll only need to convert images once. You can also find lots of online tool on web. <\/p>\n\n\n\n<h4 class=\"wp-block-heading\">Use Imagemin<\/h4>\n\n\n\n<p>Just setup few line of code and convert:<\/p>\n\n\n\n<pre class=\"EnlighterJSRAW\">const imagemin = require(&#039;imagemin&#039;);\nconst imageminWebp = require(&#039;imagemin-webp&#039;);\n\nimagemin(&#091;&#039;images\/*&#039;], {\n  destination: &#039;compressed_images&#039;,\n  plugins: &#091;imageminWebp({quality: 50})]\n}).then(() =&gt; {\n  console.log(&#039;Done!&#039;);\n})<\/pre>\n\n\n\n<div class=\"wk-index-wrap\"><div class=\"block-wrap\">\n<h3 class=\"wp-block-heading index-title\">Add WebP Images to your page<\/h3>\n<\/div><\/div>\n\n\n\n<h4 class=\"wp-block-heading\">Before<\/h4>\n\n\n\n<pre class=\"EnlighterJSRAW\">&lt;img src=&quot;webkul-logo.png&quot; alt=&quot;&quot;&gt;<\/pre>\n\n\n\n<h4 class=\"wp-block-heading\">After<\/h4>\n\n\n\n<pre class=\"EnlighterJSRAW\">&lt;picture&gt;\n  &lt;source type=&quot;image\/webp&quot; srcset=&quot;webkul-logo.webp&quot;&gt;\n  &lt;source type=&quot;image\/jpeg&quot; srcset=&quot;webkul-logo.png&quot;&gt;\n  &lt;img src=&quot;webkul-logo.png&quot; alt=&quot;&quot;&gt;\n&lt;\/picture&gt;<\/pre>\n\n\n\n<p>The&nbsp;<a href=\"https:\/\/developer.mozilla.org\/docs\/Web\/HTML\/Element\/picture\" target=\"_blank\" rel=\"noreferrer noopener nofollow\"><code>&lt;picture&gt;<\/code><\/a>,&nbsp;<a href=\"https:\/\/developer.mozilla.org\/docs\/Web\/HTML\/Element\/source\" target=\"_blank\" rel=\"noreferrer noopener nofollow\"><code>&lt;source&gt;<\/code><\/a>, and&nbsp;<code>&lt;img&gt;<\/code>&nbsp;tags, including how they are ordered relative to each other, all interact to achieve this end result.<\/p>\n\n\n\n<div class=\"wk-index-wrap\"><div class=\"block-wrap\">\n<h3 class=\"wp-block-heading index-title\">Time to check your performance<\/h3>\n<\/div><\/div>\n\n\n\n<p>You can check your pages are using WebP format of images by Lighthouse. Run the Lighthouse Performance Audit (<strong>Lighthouse &gt; Options &gt; Performance<\/strong>) and look for the results of the&nbsp;<strong>Serve images in next-gen formats<\/strong>&nbsp;audit. Lighthouse will list any images that are not being served in WebP.  You can also verify it by some online tool:  <a href=\"https:\/\/pagespeed.web.dev\/\" target=\"_blank\" rel=\"noreferrer noopener nofollow\">pagespeed<\/a>, <a href=\"https:\/\/gtmetrix.com\/\" target=\"_blank\" rel=\"noreferrer noopener nofollow\">gtmatrix<\/a>, <a href=\"https:\/\/www.webpagetest.org\/\" target=\"_blank\" rel=\"noreferrer noopener nofollow\">webpagetest<\/a><\/p>\n\n\n\n<p>If you need custom <a href=\"https:\/\/webkul.com\/website-development\/\" target=\"_blank\" rel=\"noreferrer noopener\">WordPress Development services<\/a> then feel free to <a href=\"https:\/\/webkul.com\/contacts\" target=\"_blank\" rel=\"noreferrer noopener\">reach us<\/a>&nbsp;and also explore our exclusive range of WordPress&nbsp;<a href=\"https:\/\/store.webkul.com\/woocommerce-plugins.html\">WooCommerce Extensions<\/a>.<\/p>\n\n\n\n<p>Happy coding!!<\/p>\n","protected":false},"excerpt":{"rendered":"<p>A cutting-edge image format called WebP offers better lossless and lossy compression for images on the internet. Webmasters and web developers\u00a0can produce smaller, richer images using WebP that speed up the web. When compared to PNGs, WebP lossless pictures are 26% smaller in size. WebP lossy images at equivalent SSIM quality index are 25\u201334% smaller <a href=\"https:\/\/webkul.com\/blog\/how-to-use-webp-images-in-woocommerce\/\">[&#8230;]<\/a><\/p>\n","protected":false},"author":349,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[6,1260],"tags":[13912,2054,13910,13909],"class_list":["post-375209","post","type-post","status-publish","format-standard","hentry","category-seo","category-wordpress","tag-on-page-seo-2","tag-seo","tag-site-performance","tag-webp-images"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v24.5 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>How to use WebP Images in WooCommerce - Webkul Blog<\/title>\n<meta name=\"description\" content=\"A cutting-edge image format called WebP offers better lossless and lossy compression for images on the internet.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/webkul.com\/blog\/how-to-use-webp-images-in-woocommerce\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Use WebP Images\" \/>\n<meta property=\"og:description\" content=\"A cutting-edge image format called WebP offers better lossless and lossy compression for images on the internet. Webmasters and web developers\u00a0can produce smaller, richer images using WebP that speed up the web.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/webkul.com\/blog\/how-to-use-webp-images-in-woocommerce\/\" \/>\n<meta property=\"og:site_name\" content=\"Webkul Blog\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/webkul\/\" \/>\n<meta property=\"article:published_time\" content=\"2023-04-04T04:28:24+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2024-10-15T07:53:55+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2023\/04\/use-webp-images.png\" \/>\n\t<meta property=\"og:image:width\" content=\"936\" \/>\n\t<meta property=\"og:image:height\" content=\"613\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"author\" content=\"Anikesh Kumar\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:title\" content=\"Use WebP Images\" \/>\n<meta name=\"twitter:description\" content=\"A cutting-edge image format called WebP offers better lossless and lossy compression for images on the internet. Webmasters and web developers\u00a0can produce smaller, richer images using WebP that speed up the web.\" \/>\n<meta name=\"twitter:image\" content=\"https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2023\/04\/use-webp-images.png\" \/>\n<meta name=\"twitter:creator\" content=\"@webkul\" \/>\n<meta name=\"twitter:site\" content=\"@webkul\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Anikesh Kumar\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"3 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/webkul.com\/blog\/how-to-use-webp-images-in-woocommerce\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/webkul.com\/blog\/how-to-use-webp-images-in-woocommerce\/\"},\"author\":{\"name\":\"Anikesh Kumar\",\"@id\":\"https:\/\/webkul.com\/blog\/#\/schema\/person\/4da1b58c2629234761688a8028e1d454\"},\"headline\":\"How to use WebP Images in WooCommerce\",\"datePublished\":\"2023-04-04T04:28:24+00:00\",\"dateModified\":\"2024-10-15T07:53:55+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/webkul.com\/blog\/how-to-use-webp-images-in-woocommerce\/\"},\"wordCount\":471,\"commentCount\":1,\"publisher\":{\"@id\":\"https:\/\/webkul.com\/blog\/#organization\"},\"image\":{\"@id\":\"https:\/\/webkul.com\/blog\/how-to-use-webp-images-in-woocommerce\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/webkul.com\/blog\/wp-content\/uploads\/2023\/04\/webp-compatibility-with-browser.png\",\"keywords\":[\"on-page seo\",\"SEO\",\"site performance\",\"webp images\"],\"articleSection\":[\"SEO\",\"WordPress\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/webkul.com\/blog\/how-to-use-webp-images-in-woocommerce\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/webkul.com\/blog\/how-to-use-webp-images-in-woocommerce\/\",\"url\":\"https:\/\/webkul.com\/blog\/how-to-use-webp-images-in-woocommerce\/\",\"name\":\"How to use WebP Images in WooCommerce - Webkul Blog\",\"isPartOf\":{\"@id\":\"https:\/\/webkul.com\/blog\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/webkul.com\/blog\/how-to-use-webp-images-in-woocommerce\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/webkul.com\/blog\/how-to-use-webp-images-in-woocommerce\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/webkul.com\/blog\/wp-content\/uploads\/2023\/04\/webp-compatibility-with-browser.png\",\"datePublished\":\"2023-04-04T04:28:24+00:00\",\"dateModified\":\"2024-10-15T07:53:55+00:00\",\"description\":\"A cutting-edge image format called WebP offers better lossless and lossy compression for images on the internet.\",\"breadcrumb\":{\"@id\":\"https:\/\/webkul.com\/blog\/how-to-use-webp-images-in-woocommerce\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/webkul.com\/blog\/how-to-use-webp-images-in-woocommerce\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/webkul.com\/blog\/how-to-use-webp-images-in-woocommerce\/#primaryimage\",\"url\":\"https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2023\/04\/webp-compatibility-with-browser.png\",\"contentUrl\":\"https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2023\/04\/webp-compatibility-with-browser.png\",\"width\":800,\"height\":447,\"caption\":\"webp-compatibility-with-browser\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/webkul.com\/blog\/how-to-use-webp-images-in-woocommerce\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/webkul.com\/blog\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"How to use WebP Images in WooCommerce\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/webkul.com\/blog\/#website\",\"url\":\"https:\/\/webkul.com\/blog\/\",\"name\":\"Webkul Blog\",\"description\":\"\",\"publisher\":{\"@id\":\"https:\/\/webkul.com\/blog\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/webkul.com\/blog\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/webkul.com\/blog\/#organization\",\"name\":\"WebKul Software Private Limited\",\"url\":\"https:\/\/webkul.com\/blog\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/webkul.com\/blog\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2021\/08\/webkul-logo-accent-sq.png\",\"contentUrl\":\"https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2021\/08\/webkul-logo-accent-sq.png\",\"width\":380,\"height\":380,\"caption\":\"WebKul Software Private Limited\"},\"image\":{\"@id\":\"https:\/\/webkul.com\/blog\/#\/schema\/logo\/image\/\"},\"sameAs\":[\"https:\/\/www.facebook.com\/webkul\/\",\"https:\/\/x.com\/webkul\",\"https:\/\/www.instagram.com\/webkul\/\",\"https:\/\/www.linkedin.com\/company\/webkul\",\"https:\/\/www.youtube.com\/user\/webkul\/\"]},{\"@type\":\"Person\",\"@id\":\"https:\/\/webkul.com\/blog\/#\/schema\/person\/4da1b58c2629234761688a8028e1d454\",\"name\":\"Anikesh Kumar\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/webkul.com\/blog\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/ee2f1a94eaa8f8ff5ce21477883023b57f58a71189b92d6cd9aa40d9e19ac60d?s=96&d=https%3A%2F%2Fcdnblog.webkul.com%2Fblog%2Fwp-content%2Fuploads%2F2019%2F10%2Fmike.png&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/ee2f1a94eaa8f8ff5ce21477883023b57f58a71189b92d6cd9aa40d9e19ac60d?s=96&d=https%3A%2F%2Fcdnblog.webkul.com%2Fblog%2Fwp-content%2Fuploads%2F2019%2F10%2Fmike.png&r=g\",\"caption\":\"Anikesh Kumar\"},\"description\":\"Anikesh Kumar- Team Lead, excels in WooCommerce integration, Payment Gateway Integration, and Speed Optimization Services. His proficiency in advanced WooCommerce modules and tools ensures seamless payment method development, delivering optimized, high-performance eCommerce solutions tailored to client needs.\",\"url\":\"https:\/\/webkul.com\/blog\/author\/anikesh-kumar204\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"How to use WebP Images in WooCommerce - Webkul Blog","description":"A cutting-edge image format called WebP offers better lossless and lossy compression for images on the internet.","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:\/\/webkul.com\/blog\/how-to-use-webp-images-in-woocommerce\/","og_locale":"en_US","og_type":"article","og_title":"Use WebP Images","og_description":"A cutting-edge image format called WebP offers better lossless and lossy compression for images on the internet. Webmasters and web developers\u00a0can produce smaller, richer images using WebP that speed up the web.","og_url":"https:\/\/webkul.com\/blog\/how-to-use-webp-images-in-woocommerce\/","og_site_name":"Webkul Blog","article_publisher":"https:\/\/www.facebook.com\/webkul\/","article_published_time":"2023-04-04T04:28:24+00:00","article_modified_time":"2024-10-15T07:53:55+00:00","og_image":[{"width":936,"height":613,"url":"https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2023\/04\/use-webp-images.png","type":"image\/png"}],"author":"Anikesh Kumar","twitter_card":"summary_large_image","twitter_title":"Use WebP Images","twitter_description":"A cutting-edge image format called WebP offers better lossless and lossy compression for images on the internet. Webmasters and web developers\u00a0can produce smaller, richer images using WebP that speed up the web.","twitter_image":"https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2023\/04\/use-webp-images.png","twitter_creator":"@webkul","twitter_site":"@webkul","twitter_misc":{"Written by":"Anikesh Kumar","Est. reading time":"3 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/webkul.com\/blog\/how-to-use-webp-images-in-woocommerce\/#article","isPartOf":{"@id":"https:\/\/webkul.com\/blog\/how-to-use-webp-images-in-woocommerce\/"},"author":{"name":"Anikesh Kumar","@id":"https:\/\/webkul.com\/blog\/#\/schema\/person\/4da1b58c2629234761688a8028e1d454"},"headline":"How to use WebP Images in WooCommerce","datePublished":"2023-04-04T04:28:24+00:00","dateModified":"2024-10-15T07:53:55+00:00","mainEntityOfPage":{"@id":"https:\/\/webkul.com\/blog\/how-to-use-webp-images-in-woocommerce\/"},"wordCount":471,"commentCount":1,"publisher":{"@id":"https:\/\/webkul.com\/blog\/#organization"},"image":{"@id":"https:\/\/webkul.com\/blog\/how-to-use-webp-images-in-woocommerce\/#primaryimage"},"thumbnailUrl":"https:\/\/webkul.com\/blog\/wp-content\/uploads\/2023\/04\/webp-compatibility-with-browser.png","keywords":["on-page seo","SEO","site performance","webp images"],"articleSection":["SEO","WordPress"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/webkul.com\/blog\/how-to-use-webp-images-in-woocommerce\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/webkul.com\/blog\/how-to-use-webp-images-in-woocommerce\/","url":"https:\/\/webkul.com\/blog\/how-to-use-webp-images-in-woocommerce\/","name":"How to use WebP Images in WooCommerce - Webkul Blog","isPartOf":{"@id":"https:\/\/webkul.com\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/webkul.com\/blog\/how-to-use-webp-images-in-woocommerce\/#primaryimage"},"image":{"@id":"https:\/\/webkul.com\/blog\/how-to-use-webp-images-in-woocommerce\/#primaryimage"},"thumbnailUrl":"https:\/\/webkul.com\/blog\/wp-content\/uploads\/2023\/04\/webp-compatibility-with-browser.png","datePublished":"2023-04-04T04:28:24+00:00","dateModified":"2024-10-15T07:53:55+00:00","description":"A cutting-edge image format called WebP offers better lossless and lossy compression for images on the internet.","breadcrumb":{"@id":"https:\/\/webkul.com\/blog\/how-to-use-webp-images-in-woocommerce\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/webkul.com\/blog\/how-to-use-webp-images-in-woocommerce\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/webkul.com\/blog\/how-to-use-webp-images-in-woocommerce\/#primaryimage","url":"https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2023\/04\/webp-compatibility-with-browser.png","contentUrl":"https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2023\/04\/webp-compatibility-with-browser.png","width":800,"height":447,"caption":"webp-compatibility-with-browser"},{"@type":"BreadcrumbList","@id":"https:\/\/webkul.com\/blog\/how-to-use-webp-images-in-woocommerce\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/webkul.com\/blog\/"},{"@type":"ListItem","position":2,"name":"How to use WebP Images in WooCommerce"}]},{"@type":"WebSite","@id":"https:\/\/webkul.com\/blog\/#website","url":"https:\/\/webkul.com\/blog\/","name":"Webkul Blog","description":"","publisher":{"@id":"https:\/\/webkul.com\/blog\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/webkul.com\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/webkul.com\/blog\/#organization","name":"WebKul Software Private Limited","url":"https:\/\/webkul.com\/blog\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/webkul.com\/blog\/#\/schema\/logo\/image\/","url":"https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2021\/08\/webkul-logo-accent-sq.png","contentUrl":"https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2021\/08\/webkul-logo-accent-sq.png","width":380,"height":380,"caption":"WebKul Software Private Limited"},"image":{"@id":"https:\/\/webkul.com\/blog\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/webkul\/","https:\/\/x.com\/webkul","https:\/\/www.instagram.com\/webkul\/","https:\/\/www.linkedin.com\/company\/webkul","https:\/\/www.youtube.com\/user\/webkul\/"]},{"@type":"Person","@id":"https:\/\/webkul.com\/blog\/#\/schema\/person\/4da1b58c2629234761688a8028e1d454","name":"Anikesh Kumar","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/webkul.com\/blog\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/ee2f1a94eaa8f8ff5ce21477883023b57f58a71189b92d6cd9aa40d9e19ac60d?s=96&d=https%3A%2F%2Fcdnblog.webkul.com%2Fblog%2Fwp-content%2Fuploads%2F2019%2F10%2Fmike.png&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/ee2f1a94eaa8f8ff5ce21477883023b57f58a71189b92d6cd9aa40d9e19ac60d?s=96&d=https%3A%2F%2Fcdnblog.webkul.com%2Fblog%2Fwp-content%2Fuploads%2F2019%2F10%2Fmike.png&r=g","caption":"Anikesh Kumar"},"description":"Anikesh Kumar- Team Lead, excels in WooCommerce integration, Payment Gateway Integration, and Speed Optimization Services. His proficiency in advanced WooCommerce modules and tools ensures seamless payment method development, delivering optimized, high-performance eCommerce solutions tailored to client needs.","url":"https:\/\/webkul.com\/blog\/author\/anikesh-kumar204\/"}]}},"amp_enabled":true,"_links":{"self":[{"href":"https:\/\/webkul.com\/blog\/wp-json\/wp\/v2\/posts\/375209","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/webkul.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/webkul.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/webkul.com\/blog\/wp-json\/wp\/v2\/users\/349"}],"replies":[{"embeddable":true,"href":"https:\/\/webkul.com\/blog\/wp-json\/wp\/v2\/comments?post=375209"}],"version-history":[{"count":20,"href":"https:\/\/webkul.com\/blog\/wp-json\/wp\/v2\/posts\/375209\/revisions"}],"predecessor-version":[{"id":468876,"href":"https:\/\/webkul.com\/blog\/wp-json\/wp\/v2\/posts\/375209\/revisions\/468876"}],"wp:attachment":[{"href":"https:\/\/webkul.com\/blog\/wp-json\/wp\/v2\/media?parent=375209"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/webkul.com\/blog\/wp-json\/wp\/v2\/categories?post=375209"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/webkul.com\/blog\/wp-json\/wp\/v2\/tags?post=375209"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}