How to add 3 digit comma separator

Is there any way of adding comma separator to the number called from CMS data?

I have set up item database with number field which mean price.
And I want to display it on the page with comma separating 3 digit like below.

1,000,000 JPN

I cannot find the way to do that.

Am I only do that by writing 1,000,000 in text field?

I appreciate any advice.

Thank you.

Hi @Shinsuke_Kubo, the ability to separate the numbers with commas is not built in, but using a little custom script put into the head of the site and a little custom code in an embed widget should do the trick.

Paste this in Site Settings > Header Code:

<script>
function numberWithCommas(x) {
    return x.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
}
</script>

Call the function above, using an Embed Code component, placed on the page you want the value to be shown. I would use some custom code similar to:

Here is a working example where I am displaying a number field in a dynamic list:
http://cms-number-separator.webflow.io

The commas will only appear on the published site.

4 Likes

Hi there cyberdave,

I am so sorry for late return.

I could do what I wanted to do by doing what you instructed me.
Perfect!

Thank you so much.

This topic was automatically closed 60 days after the last reply. New replies are no longer allowed.