How can I dynamically display the current year in the footer of all my Webflow sites?
TL;DR
- Add a span with a unique ID (e.g.,
current-year) inside your footer text block. - Insert a JavaScript snippet via an Embed element to set the span’s content to the current year using
new Date().getFullYear().
To dynamically display the current year in your Webflow site’s footer, you’ll need to use a small JavaScript snippet embedded via the Embed element.
1. Add a Footer Text Element
- Go to the Footer section of your Webflow project.
- Add a Text Block or Paragraph where you want the year to appear (e.g., "© 2024 Your Company").
- Replace the static year with a span element and give it a unique ID like
current-year.
Example:
Type into the Text Block:
© <span id="current-year"></span> Your Company
2. Add an Embed Element with JavaScript
- Drag an Embed element into the Footer section (preferably just before the
</body>tag if possible). - Paste the following JavaScript:
<script>document.getElementById("current-year").textContent = new Date().getFullYear();</script>
- Save and publish your project.
3. Publish and Test
- Publish your site to staging or live domain.
- View the footer—the current year should now load automatically based on the visitor’s local time.
Summary
Insert a span with an ID (e.g., current-year) in your footer text. Then use a JavaScript snippet inside an Embed element to dynamically insert the current year using new Date().getFullYear().