Add

Lorem ipsum

Lorem ipsum

Easter egg

3 views

2 min

How do you show a message by day of the week in Webflow?

Learn how to display a different message based on the day of the week in Webflow with JavaScript.

In this tutorial, Sandro, co-founder of Gemeos Webflow agency, shows you how to display a different message depending on the day of the week in Webflow.

Example

Message based on the current day

Loading...

DayExample message
Monday'💪 The week is starting, let’s go!'
Friday'🎉 Happy Friday!'
Weekend'☀️ Enjoy your Saturday'

1. Add the ID to your text

On your Text Block: custom attribute id = day-message.

2. Add the script in Footer code

(function() {
var messages = [
'🌙 Enjoy your Sunday', '💪 The week is starting, let’s go!',
'🚀 Happy Tuesday', '⚡ Midweek, keep going',
'🙌 Almost the weekend!', '🎉 Happy Friday!', '☀️ Enjoy your Saturday'
];
var el = document.getElementById('day-message');
if (el) el.textContent = messages[new Date().getDay()];
})();

good to know

See also our tutorial text that changes based on the time of day to combine both approaches.

Conclusion

A small detail that shows your site is alive. Especially effective on SaaS homepages and portfolios.

Published on

You might be interested in these tutorials

Similar tutorials

Let’s f*****G GO !!

Ready to launch
Your business?

Alexandre

Max

Enora

Bryan

Cannelle

Tiphaine

You'll :heart: our collaboration...