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

CSS for matching the Date Format for the Blog


dlthdus0817

Question

  • Answers 10
  • Created
  • Last Reply

Top Posters For This Question

Top Posters For This Question

Popular Posts

Site URL: http://revelucent.com Hi, I want to match the Date Format with the Blog list page and the Blog page. Blog list page has the date with MM/DD/YY. But on the blog page, the date is

Hi, the date format has been updated successfully by using your css. But, for some reason, the date on blog list and the blog post is different.  There is one date gap between two pages.

Your script is slightly different, could you try this <!-- Squarespace Forum 03-08-2021 --> <script src="https://stevenlevithan.com/assets/misc/date.format.js"></script> <scri

Posted Images

10 answers to this question

Recommended Posts

  • 0
On 4/30/2021 at 3:19 AM, dlthdus0817 said:

Site URL: http://revelucent.com

Hi,

I want to match the Date Format with the Blog list page and the Blog page.

Blog list page has the date with MM/DD/YY. But on the blog page, the date is showing as April DD. 

Is there any Custom Code for matching the date format as MM/DD/YY for both pages?

Thank you so much!

738136006_ScreenShot2021-04-29at4_17_08PM.thumb.png.120fd53481ad9c491185e2f2bfb6b552.png

 

 

2042794979_ScreenShot2021-04-29at4_17_14PM.png.98f259dc2bfb43741175031bcd8bbbf2.png

You will need custom javascript for that, check the solution I already provided

Blog collection page - move metadata to bottom + reformat date (7.1) - Coding and Customization - Squarespace Forum

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, Portfolio hover Replace Link Style
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 post
  • 0
On 4/30/2021 at 8:07 PM, bangank36 said:

You will need custom javascript for that, check the solution I already provided

Blog collection page - move metadata to bottom + reformat date (7.1) - Coding and Customization - Squarespace Forum

Hi, the date format has been updated successfully by using your css.

But, for some reason, the date on blog list and the blog post is different. 

There is one date gap between two pages.

Do you know why it happens?

Thank you so much for your help!

885144513_ScreenShot2021-05-03at10_38_47AM.thumb.png.0e719aa1d65036a8e961266795682254.png

 

 

1240516962_ScreenShot2021-05-03at10_38_37AM.thumb.png.ac155eabdb0156128e2fb0c39318aecb.png

Link to post
  • 0
46 minutes ago, dlthdus0817 said:

Hi, the date format has been updated successfully by using your css.

But, for some reason, the date on blog list and the blog post is different. 

There is one date gap between two pages.

Do you know why it happens?

Thank you so much for your help!

885144513_ScreenShot2021-05-03at10_38_47AM.thumb.png.0e719aa1d65036a8e961266795682254.png

 

 

1240516962_ScreenShot2021-05-03at10_38_37AM.thumb.png.ac155eabdb0156128e2fb0c39318aecb.png

that's time zone issue, I thought I fixed it already, let me check again

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, Portfolio hover Replace Link Style
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 post
  • 0
1 hour ago, dlthdus0817 said:

Hi, the date format has been updated successfully by using your css.

But, for some reason, the date on blog list and the blog post is different. 

There is one date gap between two pages.

Do you know why it happens?

Thank you so much for your help!

885144513_ScreenShot2021-05-03at10_38_47AM.thumb.png.0e719aa1d65036a8e961266795682254.png

 

 

1240516962_ScreenShot2021-05-03at10_38_37AM.thumb.png.ac155eabdb0156128e2fb0c39318aecb.png

Your script is slightly different, could you try this

<!-- Squarespace Forum 03-08-2021 -->
<script src="https://stevenlevithan.com/assets/misc/date.format.js"></script>
<script>
	document.addEventListener('DOMContentLoaded', function() {
      var dateformat = "mmm/dd/yyyy";
      var pubdate = document.querySelectorAll("time[datetime], time[pubdate], time.blog-meta-item--date");
      for (var i = 0; i < pubdate.length; i++) {
          var d = new Date(pubdate[i].getAttribute("datetime") || pubdate[i].innerText);
          if ( pubdate[i].classList.contains('blog-meta-item--date') ) {
              d = new Date(document.querySelector('[itemprop="datePublished"]').getAttribute("content").split("T")[0]);
          }
          pubdate[i].innerHTML = d.format(dateformat); 
      }
  });


</script>

 

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, Portfolio hover Replace Link Style
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 post
  • 0
1 hour ago, bangank36 said:

Your script is slightly different, could you try this


<!-- Squarespace Forum 03-08-2021 -->
<script src="https://stevenlevithan.com/assets/misc/date.format.js"></script>
<script>
	document.addEventListener('DOMContentLoaded', function() {
      var dateformat = "mmm/dd/yyyy";
      var pubdate = document.querySelectorAll("time[datetime], time[pubdate], time.blog-meta-item--date");
      for (var i = 0; i < pubdate.length; i++) {
          var d = new Date(pubdate[i].getAttribute("datetime") || pubdate[i].innerText);
          if ( pubdate[i].classList.contains('blog-meta-item--date') ) {
              d = new Date(document.querySelector('[itemprop="datePublished"]').getAttribute("content").split("T")[0]);
          }
          pubdate[i].innerHTML = d.format(dateformat); 
      }
  });


</script>

 

Hi, thanks for the quick reply.

I changed the code, but still has the same issue.

Do you think it's because of the time zone? But how it has the different time date for the same blog post?

Link to post
  • 0
On 5/4/2021 at 12:44 AM, dlthdus0817 said:

Hi, thanks for the quick reply.

I changed the code, but still has the same issue.

Do you think it's because of the time zone? But how it has the different time date for the same blog post?

Timezone is root cause, that why I tried to remove the time in the date string before parsing it

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, Portfolio hover Replace Link Style
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 post
  • 0

 

image.png.9220c4a0b8c7a8ea0d5d73998d6a711d.pngimage.png.f8421dd60533c2882400f91ea0f57033.png

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, Portfolio hover Replace Link Style
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 post
  • 0
2 minutes ago, dlthdus0817 said:

How it can happen?

From my end, it still has the one date gap.

Is it the same post?

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, Portfolio hover Replace Link Style
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 post

Create an account or sign in to comment

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


×
×
  • Create New...