Format the date and time fields

Use the date and time fields

In .cshtml views the date field is automatically formatted. To take advantage of the automatic date format, in Sitefinity .NET Core Renderer, you must reference the date in the views, using the FormatDate HTML helper.

To do this, in the .cshtml files, render the date object in the following way:

Date and time calculation

On the frontend, the .NET Core Renderer supports the following ways for calculating date and time:

  • Calculate the date server-side
    This is the default behavior of the .NET Core Renderer.
    All the dates are rendered according to the current culture of the page and the time zone of the current site in Sitefinity CMS.
  • Calculate the date client-side
    The date and time can also be calculated on the client, using the client browsers time zone information.

Modify the server-side date and time format

The default format for these dates is “d MMM, hh:mm tt”. You can change this, by modifying the ServerDateFormat property in the appSettings.json file of the Renderer in the following way:

Customize the default formatting logic

You can replace the formatting logic entirely, by providing a custom implementation of the Progress.Sitefinity.AspNetCore.Mvc.Rendering.IDateTimeFormatter interface in the following way:

Enable client-side date and time calculation

To switch to client-side date and time calculation, you must modify the DateFormatSource property in the appSettings.json file of the Renderer in the following way:

This automatically adds a script on the frontend of each widget that has a call to @Html.FormatDate. This script traverses the entire page and looks for a specific marker to convert the dates.

Customize the client-side date and time format

To replace the default formatting logic on the client, you must include a script tag like the following:

RECOMMENDATION: We recommend placing the <script> tag in the <head> tag of your root layout file.

NOTE: The language for the formatting is read from the html tag. Therefore, it is important to set the lang attribute. The Renderer pages have a dynamically generated lang attribute, based on the requested language of the page.

Want to learn more?

Sign up for our free beginner training. Boost your credentials through advanced courses and certification.
Register for Sitefinity training and certification.

Was this article helpful?