Datetime Design Area

Last Updated: 03 Jan 2018

design_area_datetime|asset|5.4.4.0

This design area allows you to display either the date and/or time when the page was last updated or the current date and/or time.

Bookmarks to the headings on this page:

  1. Set Variables
  2. Example

An example of the Datetime design area is shown below.

<MySource_AREA id_name="page_modified" design_area="datetime">
  <MySource_SET name="format" value="F j, Y, g:i a" />
  <MySource_SET name="datetime" value="updated" />
</MySource>

Set Variables

The set variables available for the Datetime design area are as follows:

  • format: this variable allows you to format the date and time that is displayed in the design. The format of the date is in PHP date format (ref: PHP: Date Manual) and by default, it is set to h:ia d/m/Y, which is hour:minute[am/pm] day/month/year. The example shown below sets the format to F j, Y, which is month (in words) day, year.
    <MySource_AREA id_name="date_time_area" design_area="datetime">
    <MySource_SET name="format" value="F j, Y" />
    </MySource> 
  • datetime: this variable allows you to set which date and/or time to show. The values that are available are as follows:
    • now: this will show the current date and/or time.
      <MySource_AREA id_name="date_time_area" design_area="datetime">
      <MySource_SET name="datetime" value="now" />
      </MySource> 
    • updated: this will show the date and/or time when the page was last modified (i.e. the last time the Commit button was clicked).
      <MySource_AREA id_name="date_time_area" design_area="datetime">
        <MySource_SET name="datetime" value="updated" />
      </MySource> 
    • created: this will show the date and/or time when the page was created.
      <MySource_AREA id_name="date_time_area" design_area="datetime">
      <MySource_SET name="datetime" value="created" />
      </MySource> 
    • published: this will show the date and/or time when the page was last published (i.e. the Status of the page was changed to Live).
      <MySource_AREA id_name="date_time_area" design_area="datetime">
      <MySource_SET name="datetime" value="published" />
      </MySource> 
    By default, this variable is set to now.

Example

Below is the HTML code that was added to the static HTML file to show where the datetime design area should go in the design.

<div id="footer">
  <p class="right">
    Last Updated: <!-- Last updated design area to go here-->
  </p>
</div> 

The required code for the Datetime design area is added, as shown below.

<div id="footer">
<p class="right">
 Last Updated:
<MySource_AREA id_name="page_modified" design_area="datetime">
<MySource_SET name="format" value="F j, Y, g:i a" />
<MySource_SET name="datetime" value="updated" />
</MySource_AREA>
<p>
</div>

The date and time of when the page was last updated will now appear in the design.

The Datetime in the Design of a Site
The date and time in the Design of a Site

The Latest

Let Us Know What You Think

Let us know if you spot any errors or if you have any ideas on how we can improve the Matrix Community Website.

Contact Squiz for Demo

Let us show you the true power of Squiz Matrix by giving you a personalised demonstration.