Do you want to show today’s date in Shopify?
Many Shopify eCommerce, service provider websites, online journals, and frequently updated blogs may want to display the current date and time. This gives website visitors an idea about the current date and how long ago the content was published.
In this post, We will show you how to easily display today’s date or current time on your Shopify Store.
Showing Current Date in Shopify
Let’s take a look at how to easily display today’s date with day, month, and year on your Shopify website.
You can add this simple code in your Shopify store theme’s files where you want to display the current time.
{{ "now" | date: "%Y-%m-%d %H:%M" }}
Output
2022-04-14 16:10
Using the date
filter in Liquid and Shopify
In Shopify’s Liquid language, the date
filter converts a timestamp to another date format. For example, a blog article will have a published_at
attribute, a Liquid object on which we can apply the date
filter. I’ve specified the output inside the comment below:
{{ article.published_at | date: "%a, %b %d, %Y" }}
<-- Tues, Apr 30, 2019 -->
The date
filter accepts the same parameters for formatting as Ruby’s strftime
method. For creating custom formatting, try using a site like strfti.me to create the parameters that fit the output that you want.
It’s important to note that the output of date
isn’t translated into other languages. To ensure dates are universal, consider using a numbered format like 2019-09-14
.
The date filter also accepts some default format
options:
{{ article.published_at | date: format: 'default' }}
<-- Tue, Apr 30, 2019, 6:55 am -0400 -->
{{ article.published_at | date: format: 'short' }}
<-- 30 Apr 06:55 -->
{{ article.published_at | date: format: 'long' }}
<-- April 30, 2019 06:55 -->
You’ll notice that the output of the date
filter is just the date itself, without a element. This can be useful if you need to output just the date into a tag so you can control the markup around it.
Using the time_tag
filter
The time_tag
filter converts a timestamp to another date format and outputs an HTML element. For example, for the same published_at
date above, if we used the time_tag
filter it would look like this:
{{ article.published_at | time_tag }}
<-- Tue, Apr 30, 2019, 6:55 am -0400 -->
The output inside the HTML element can be customized the same way as we did previously with the date
filter. It can take date parameters, and doesn’t affect the value of the datetime
attribute set on the tag. For example:
{{ article.published_at | time_tag: '%a, %b %d, %Y' }}
<-- Tue, Apr 30, 2019 -->
You can also alter the datetime
attribute for the time_tag
by passing a datetime
parameter using a custom format:
{{ article.published_at | time_tag: '%a, %b %d, %Y', datetime:'%Y-%m-%d' }}
<-- Tue, Apr 30, 2019 -->
Date formatting galore
That’s everything you need to know about date formats in Shopify themes! You might not think it, but there are a lot of places in an online store where you can specify and take advantage of templated date formats. Here are just a few:
- Blog posts publication dates
- Email templates
- Order confirmation
- User login pages
- Products (Back in stock on _____ , or In stock after _____ )
- Footer and Copyright
We hope this post helped you learn how to easily display today’s date in Shopify. You may also want to see our guides on Shopify Plus Pricing - Setup, Apps, Migration, Credit Card Cost - and How To Find And Customize Shopify Page Templates?
If you liked this post, then please share it on social media sites like Facebook, LinkedIn, Twitter etc.
You must be logged in to post a comment.