How to Remove Decimals (.00) from Squarespace Product Prices
To display product prices without decimals and comma (e.g., change 1,500.00 to 1500 or 1,500), follow the steps below:
Step 1: Access Code Injection:
Navigate to your site’s Admin Panel. Go to Website Pages → Scroll down to Custom Code → Open Code Injection.Step 2: Add the Code:
Copy the entire code block below and paste it into the Header or Footer section of Code Injection. Click Save and refresh the page.
<!-- Reformat Product Price (1,500.00 -> 1500 / 1,500) -->
<!-- Author: Dmytro Kyselov https://dmytrokyselov.com/ I❤️☕️ coff.ee/dmytrokyselov -->
<script src="https://cdn.jsdelivr.net/npm/@ryanmorr/ready@1.4.1/dist/umd/ready.min.js"></script>
<script>
const reformatPriceOptions = {
displayComma: false // Set to true (displayComma: true) to display the comma in the price (e.g. 15,000)
};
(function(){ function reformatPrice(price){ const priceClone=price.cloneNode(true); priceClone.classList.add('product-price-clone'); price.parentNode.insertBefore(priceClone, price.nextElementSibling); price.style.display='none'; function reformat(){ priceClone.innerHTML=format(price.innerHTML);} function format(text){ let reformattedText=reformatPriceOptions.displayComma ? text: text.replace(',', ''); return reformattedText.replace(/\.\d{2}/, '');} function watch(){ const observer=new MutationObserver(reformat); observer.observe(price,{ childList: true});} reformat(); watch();} ready('.product-list-item-price:not(.product-price-clone),.product-price-value:not(.product-price-clone),.product-price:not(#main-product-price):not(.product-price-clone),.original-price:not(.product-price-clone)', reformatPrice)})();
</script>
<!-- end Reformat Product Price -->
ℹ️ Note: This code removes commas and decimal points. To remove only decimal points and keep commas (e.g., 1,500), change displayComma: false to displayComma: true
FAQ
-
Add the JavaScript snippet to your Squarespace site's Code Injection area. It reformats displayed product prices by removing trailing .00 decimals.
-
Yes. Set displayComma to true to display prices such as $15,000 instead of $15000.
-
No. It changes how prices appear on your website. It doesn't modify the underlying product prices or checkout amounts.
