Dynamically display the current year anywhere on your site

[parkerwest (Eli)]

Hey everyone,

As a freelancer managing multiple client sites I was looking for an easy way to dynamically display the current year in the footer of all my sites. There are other forum posts about how to do this, but some don’t work if there are multiple instances of the current year span on the same page, and some were just overly complicated for my needs so I wanted to share this new simple method I’m using.

Step 1: Paste this code before the body tag in your project settings

<script>
$(function() {
  $('.current-year').text(new Date().getFullYear());
});
</script>

Step 2: Create a text span on any text you want to display the current year.

Step 3: Add a class to the span labeled current year or current-year (either works)

Step 4: Publish your site and view the live site to see the results

Cheers!

[okmicah (Micah Woods)]

This is so helpful! Do you know how to display a month in advance? For example, if it’s currently February, I’d like to have the span text on the site say March.

[parkerwest (Eli)]

Try This:

<script>
$(function() {
  $('.current-year').text(new Intl.DateTimeFormat('en-US', { month: 'long'}).format(new Date().setMonth(new Date().getMonth()+1)));
});
</script>

[okmicah (Micah Woods)]

@parkerwest

<script>
$(function() {
  $('.current-year').text(new Intl.DateTimeFormat('en-US', { month: 'long'}).format(new Date().setMonth(new Date().getMonth()+1)));
});
</script>

It worked perfectly! Thank you so much

[rpradosilva (Rafael Prado)]

Hi!

To contribute to this topic i suggest use vanilla javascript:

<script>  
    
const systemDate = new Date(); // Current date
let currentYearText = document.querySelector(".current-year") // Select class
currentYearText.innerHTML = systemDate.getFullYear(); // Apply current date (only year) into select class

 </script>

IMPORTANT: Add custom code in site settings (in dashboard - settings icon) > Custom code > Footer Code