Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search
  • 1

[FreeShare] Date display format options on all pages


bangank36

Question

Site URL: https://forum.squarespace.com/topic/158057-date-display-format-options/?fbclid=IwAR3c-LN_AFmqlTWG6uPvXzXLV9TqUKihXMjjvyrHfLgn-0NEqg2yXnztUys#comment-447653

Hi guys,

Understanding the requirement to set consistently format date on all pages of website , I would like to share my solution to you .

1. Add the following codes to Home > Settings > Advanced > Code Injection

<!-- Fix inconsistent blog date format on Squarespace 7.1 template -->
<!-- Squarespace Forum Update 06-11-2021 -->
<script src="https://stevenlevithan.com/assets/misc/date.format.js"></script>
<script>
	    (function(){
        document.addEventListener('DOMContentLoaded', function() {
            const dateformat = "dd-mm-yyyy";
            const pubdates = document.querySelectorAll("time[datetime]:not([class*=event-time]), time[pubdate], time.blog-meta-item--date");
            pubdates.forEach(pubDate => {
                let d = new Date(pubDate.getAttribute("datetime") || pubDate.innerText);
                if (pubDate.classList.contains('blog-meta-item--date') ) {
                    d = new Date(document.querySelector('[itemprop="datePublished"]').getAttribute('content').split("T")[0]);
                }
                pubDate.innerHTML = d.format(dateformat); 
            });
        });
    })();
</script>

2. Change the 'dateformat' in my previous code with the date format you want to apply. Ex: dd-mm-yyy, mmm-dd-yyyy,...

image.png.5dc5a5868977c057c11220c00840a4a2.png

Hope that it can help your sites properly

Let me know if you have any issue that needs to be solved.

Support me by pressing 👍 if this useful for you

Edited by bangank36
Better result

Greeting, it's BaNgan from BeyondSpace, I am Squarespace dev focus on provide solutions to enhance feature that squarespace.com can't provide.
Feel free to check my current Squarespace Plugins Developement: Enable Pinch/Zoom on lightbox, Delivery Date Picker, Youtube Gallery for Squarespace
If you find my answer fit your need, let's leave a like or upvote so others with the same issue can find their solution. Thank you

Link to comment

13 answers to this question

Recommended Posts

  • 0
On 11/26/2021 at 10:55 PM, Yadi said:

Hi, it is not working on my page. would love to change the blog list page date format on my site. but after injecting the code above, nothing changed. Can you please help me?

You share link to blog list page, we can help easier

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

How to: Setup password & share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

Link to comment
  • 0
On 11/26/2021 at 10:55 PM, Yadi said:

Hi, it is not working on my page. would love to change the blog list page date format on my site. but after injecting the code above, nothing changed. Can you please help me?

Hi @Yadi,

Can you share your site with the protected password for us to take a look?

Greeting, it's BaNgan from BeyondSpace, I am Squarespace dev focus on provide solutions to enhance feature that squarespace.com can't provide.
Feel free to check my current Squarespace Plugins Developement: Enable Pinch/Zoom on lightbox, Delivery Date Picker, Youtube Gallery for Squarespace
If you find my answer fit your need, let's leave a like or upvote so others with the same issue can find their solution. Thank you

Link to comment
  • 0
On 12/16/2021 at 12:30 AM, Yadi said:

Problem solved

Greeting, it's BaNgan from BeyondSpace, I am Squarespace dev focus on provide solutions to enhance feature that squarespace.com can't provide.
Feel free to check my current Squarespace Plugins Developement: Enable Pinch/Zoom on lightbox, Delivery Date Picker, Youtube Gallery for Squarespace
If you find my answer fit your need, let's leave a like or upvote so others with the same issue can find their solution. Thank you

Link to comment
  • 0
3 hours ago, Glenn Hubbers said:

I tried this on my site.
While it does change the format (I prefer yyyy-mm-dd) the date on the index is one day off of the date on the blog post.
Example: on the blog index I have a post with the date 2019-12-31 and when you click that post it comes up with the day 2019-12-30

Can you share your site with the protected password so we can take a look?

Greeting, it's BaNgan from BeyondSpace, I am Squarespace dev focus on provide solutions to enhance feature that squarespace.com can't provide.
Feel free to check my current Squarespace Plugins Developement: Enable Pinch/Zoom on lightbox, Delivery Date Picker, Youtube Gallery for Squarespace
If you find my answer fit your need, let's leave a like or upvote so others with the same issue can find their solution. Thank you

Link to comment
  • 0

@Glenn Hubbers

Please post the URL for a page on your site where we can see your issue.

If your site is not public please set up a site-wide password, if you've not already done so.

Post the password here.

Adding a site-wide password does not allow anyone to alter your site. It only allows those with the password to see your site. Please read the documentation at the link provided to understand how it works.

Please read the documentation at the link provided on how to share a link to your site to understand how it works. A link to the backend of the your site won’t work for us, i.e. a url that contains /config/.

We can then take a look at your issue.

Find my contributions useful? Please like, upvote, mark my answer as best , and see my profile. Thanks for your support!

Link to comment
  • 0
Posted (edited)
On 1/2/2022 at 11:00 PM, Glenn Hubbers said:

I don't understand how I could share my site and password such that the world can't see it. Please advise.

Have you solved it yet? Do you still need help?

Edited by bangank36

Greeting, it's BaNgan from BeyondSpace, I am Squarespace dev focus on provide solutions to enhance feature that squarespace.com can't provide.
Feel free to check my current Squarespace Plugins Developement: Enable Pinch/Zoom on lightbox, Delivery Date Picker, Youtube Gallery for Squarespace
If you find my answer fit your need, let's leave a like or upvote so others with the same issue can find their solution. Thank you

Link to comment
  • 0
11 hours ago, staceykaitlin said:

I'm working on a website for a client who would like the dates on her blog page and each individual blog post to show as DD Month YYYY (i.e. 15th January 2022), is this possible with this code injection? 

Yes, this code can be applied to the blog page and individual blog post.

Kindly change the format in my blog with

const dateformat = "dd-mmm-yyyy";

Let me know how it works on your site

Edited by bangank36

Greeting, it's BaNgan from BeyondSpace, I am Squarespace dev focus on provide solutions to enhance feature that squarespace.com can't provide.
Feel free to check my current Squarespace Plugins Developement: Enable Pinch/Zoom on lightbox, Delivery Date Picker, Youtube Gallery for Squarespace
If you find my answer fit your need, let's leave a like or upvote so others with the same issue can find their solution. Thank you

Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment

×
×
  • Create New...