How To Update The Year Automatically in Squarespace
This tutorial was recorded in Squarespace 7.1 but also applies to legacy sites built on version 7. For more information, visit insidethesquare.co/themes
In this Squarespace tutorial, you’ll learn how to use some simple HTML & javascript to have the year in the footer of your website update automatically. It’s a simple line of code, and in this video, you’ll see how to add it to your site step by super simple step!
All the code from this tutorial is below, but before you get started, it’s important to know that at the time of posting this, only subscribers with a business or commerce plan can use Javascript inside a code block in Squarespace. Personal plans will need to upgrade.
Here is the code from this tutorial.
<center><p> All Rights Reserved © <script>document.write(new Date().getFullYear())</script> by Your Business Name </p></center>
The <center> and </center> in this code will align the text in the center of your footer. Remove that from the beginning and end if you want it to be aligned to the left.
The <p> and </p> in this code is for paragraph text. If you want to use a heading font style like your heading 3, change the letter p to h3.
The script part of this tells the browser to write the full year by saying right here in this text (document) I want you to write (write) the year (new Date().getFullYear())
Pro tip: If the code block is too big and you can’t resize it inside Squarespace, you can use the max-height to resize it like this:
#block-123456 {max-height:1rem}
You’ll need to target the individual block id; here is a tutorial with more info on how to do that: insidethesquare.co/squarespace-tutorials/css-targeting-tricks
My tutorials usually focus on CSS, and not Javascript, but for a simple snippet like this I decided to make an exception. If you want to learn more about the basics of Javascript and why I focus on CSS for Squarespace, check out this reel I published on Instagram:
