{"id":627,"date":"2023-09-07T08:26:25","date_gmt":"2023-09-07T08:26:25","guid":{"rendered":"https:\/\/blog.hostinger.io\/support\/2023\/09\/07\/8343753-hostinger-website-builder-how-to-change-the-price-format-in-the-online-store\/"},"modified":"2026-07-23T11:26:16","modified_gmt":"2026-07-23T11:26:16","slug":"8343753-hostinger-website-builder-how-to-change-the-price-format-in-the-online-store","status":"publish","type":"post","link":"https:\/\/www.hostinger.com\/support\/8343753-hostinger-website-builder-how-to-change-the-price-format-in-the-online-store\/","title":{"rendered":"Hostinger Website Builder: How to change the price format in the online store"},"content":{"rendered":"

This article explains how to change the format of product prices<\/b> in the online store created with Hostinger Website Builder<\/b>.<\/p>

\n

The changes will be visible in product list sections<\/b>, on product pages<\/b>, and in the shopping bag<\/b>. The default prices will still be shown in the checkout, invoices, and store management area 💡<\/p>\n<\/div>

Copy the code<\/h2>
<script>\r\n  const currency = \"€\";\r\n  const thousandsSeparator = \".\";\r\n  const removeCents = false;\r\n  const priceInTheEnd = false;\r\n  let fullPrice;\r\n\r\n  const addCommaToPrice = (price, currency) => {\r\n    \/* currency at the end *\/\r\n    if (price.innerText.slice(0, currency.length) !== currency) {\r\n      fullPrice = price.innerText.substring(\r\n        0,\r\n        price.innerText.indexOf(currency)\r\n      );\r\n    } else {\r\n      \/* currency in front *\/\r\n      fullPrice = price.innerText.slice(currency.length);\r\n    }\r\n\r\n    \/* if cents exist *\/\r\n    if (removeCents) {\r\n      fullPrice = fullPrice.slice(0, -3);\r\n    }\r\n    fullPrice = fullPrice\r\n      .toString()\r\n      .replace(\/B(?=(d{3})+(?!d))\/g, thousandsSeparator);\r\n\r\n    if (priceInTheEnd) {\r\n      fullPrice = `${fullPrice} ${currency}n`;\r\n    } else {\r\n      fullPrice = `${currency} ${fullPrice}n`;\r\n    }\r\n\r\n    price.innerText = fullPrice;\r\n  };\r\n\r\n  const priceChanged = (price) => {\r\n    if (price.innerHTML.indexOf(\"<br>\") > -1) {\r\n      return true;\r\n    } else {\r\n      return false;\r\n    }\r\n  };\r\n\r\n  setInterval(() => {\r\n    \/*Product pages*\/\r\n    if (\r\n      document.querySelector(\".block-product__price\") &&\r\n      !priceChanged(document.querySelector(\".block-product__price\"))\r\n    ) {\r\n      document.querySelectorAll(\".block-product__price\").forEach((price) => {\r\n        addCommaToPrice(price, currency);\r\n      });\r\n    }\r\n\r\n    \/*Cart*\/\r\n    if (\r\n      document.querySelector(\".cart__price\") &&\r\n      !priceChanged(document.querySelector(\".cart__price\"))\r\n    ) {\r\n      document.querySelectorAll(\"li.cart__list-item\").forEach((product) => {\r\n        if (product.contains(product.querySelector(\".cart__sale-price\"))) {\r\n          addCommaToPrice(product.querySelector(\".cart__price\"), currency);\r\n          addCommaToPrice(product.querySelector(\".cart__sale-price\"), currency);\r\n        } else {\r\n          addCommaToPrice(product.querySelector(\".cart__price\"), currency);\r\n        }\r\n      });\r\n\r\n      if (!priceChanged(document.querySelector(\".cart__title span\"))) {\r\n        addCommaToPrice(document.querySelector(\".cart__title span\"), currency);\r\n      }\r\n    }\r\n\r\n    const priceSelector =\r\n      \".product-list-item__price-wrapper span:not(.product-list-item__price-range)\";\r\n\r\n    \/*Section*\/\r\n    if (\r\n      document.querySelector(priceSelector) &&\r\n      !priceChanged(document.querySelector(priceSelector))\r\n    ) {\r\n      document.querySelectorAll(\".product-list-item\").forEach((product) => {\r\n        if (product.querySelector(\"p.product-list-item__price-content\")) {\r\n          addCommaToPrice(product.querySelector(priceSelector), currency);\r\n          addCommaToPrice(\r\n            product.querySelector(\"p.product-list-item__price-content\"),\r\n            currency\r\n          );\r\n        } else {\r\n          addCommaToPrice(product.querySelector(priceSelector), currency);\r\n        }\r\n      });\r\n    }\r\n  }, 500);\r\n<\/script><\/code><\/pre>
Customize the code<\/h2>
Make the preferred edits in the code depending on what you’d like to change. For example, change the currency symbol.<\/p>
Paste the code<\/h2>
Within the builder, go to your website’s Settings<\/b> → Integrations<\/b>, and paste the code in the Custom code<\/a><\/b> field. Then, save the changes<\/b> and update your website<\/b>.<\/p>\n","protected":false},"excerpt":{"rendered":"
Learn how to change the format of product prices in your online store created with Hostinger AI Builder<\/p>\n","protected":false},"author":581,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"include_on_kodee":true,"footnotes":""},"categories":[286],"tags":[],"class_list":["post-627","post","type-post","status-publish","format-standard","hentry","category-online-store"],"hreflangs":[{"locale":"en-US","link":"https:\/\/www.hostinger.com\/support\/8343753-hostinger-website-builder-how-to-change-the-price-format-in-the-online-store\/","default":1},{"locale":"es-ES","link":"https:\/\/www.hostinger.com\/es\/support\/8343753-hostinger-creador-de-sitios-web-como-cambiar-el-formato-del-precio-en-la-tienda-online\/","default":0}],"include_on_kodee":true,"_links":{"self":[{"href":"https:\/\/www.hostinger.com\/support\/wp-json\/wp\/v2\/posts\/627","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.hostinger.com\/support\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.hostinger.com\/support\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.hostinger.com\/support\/wp-json\/wp\/v2\/users\/581"}],"replies":[{"embeddable":true,"href":"https:\/\/www.hostinger.com\/support\/wp-json\/wp\/v2\/comments?post=627"}],"version-history":[{"count":1,"href":"https:\/\/www.hostinger.com\/support\/wp-json\/wp\/v2\/posts\/627\/revisions"}],"predecessor-version":[{"id":13221,"href":"https:\/\/www.hostinger.com\/support\/wp-json\/wp\/v2\/posts\/627\/revisions\/13221"}],"wp:attachment":[{"href":"https:\/\/www.hostinger.com\/support\/wp-json\/wp\/v2\/media?parent=627"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.hostinger.com\/support\/wp-json\/wp\/v2\/categories?post=627"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.hostinger.com\/support\/wp-json\/wp\/v2\/tags?post=627"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}