The number field is used to manage numerical data such as prices, quantities, rankings, and orders.
Unlike text fields, it restricts input to numerical values, making it suitable for accurate calculations on the frontend and sorting based on numerical values.

How to Upload Data

Click on the input field and enter half-width numbers.

For information on uploading using the API and CSV, please refer to the documentation below.

Limitations / Notes

• The range of input values is from 9007199254740991 to -9007199254740991.

Advanced Settings

Response Format of GET API

Please refer to the documentation below for details.

How to Use in Frontend

The number field returns data in numeric format, so it is displayed not only as is but also processed for calculations and format conversions.
Below is an implementation example in Next.js that displays the price.

export default async function Page({ params }) {
  const { slug } = await params;

  // Fetch data using the microCMS JavaScript SDK (https://github.com/microcmsio/microcms-js-sdk)
  const data = await client.getListDetail({
    endpoint: "products",
    contentId: slug,
  });

  return (
    <main>
      {/* price is the field ID. Please replace it with the actual field ID */}
      <p>Price: {data.price.toLocaleString()} yen (including tax)</p>
    </main>
  );
}