Templating the Timestamp field

The Timestamp field allows content writers to add a date and time.

Default Format

Here’s an example of how to retrieve the value of a Timestamp field. In this case, the Timestamp field has the API ID event_date.

Copy

var PrismicDOM = require('prismic-dom');

var eventTime = PrismicDOM.Date(document.data.event_date);

Custom Format

By saving the Timestamp value as a Date object, you can format it using the built-in locale format function.

Copy

var timestamp = PrismicDOM.Date(document.data.event_date);

var formattedTimestamp = Intl.DateTimeFormat('en-US',{
  year: "numeric",
  month: "short",
  day: "2-digit",
  hour: "numeric",
  minute: "2-digit",
  second: "2-digit"
}).format(timestamp);
// Outputs the date and time in Mon dd, YYYY, H:MM:SS AM/PM format

You can also use library such as date-fns-tz to format a timestamp.

Copy

var PrismicDOM = require('prismic-dom');
var DateFnsTZ = require('date-fns-tz');

var timestamp = PrismicDOM.Date(document.data.event_date);
var formattedTimestamp = DateFnsTZ.format(timestamp,'MMMM dd, yyyy H:mm a');
// Outputs as "December 12, 2020 12:00 PM