Site-wide Interaction?

Is there a way to create an interaction that’ll affect all elements with a certain class on every page your entire site all at once?

One example for this would be a button on a Blog Post template page that’ll switch the text from black text on white to a “night mode” but have that interaction affect the text on every blog post page going forward so the user only has to press that button once instead of every time they go to a new post. Right now I can only find a way to set night mode that affects the classes on the current page instead of all pages on the site.

If there isn’t a way to do it within Webflow’s interface, does anyone know where to start with injecting code in the header tag of the site if that would work?

Thanks so much!

Here is my site Read-Only: LINK
(how to share your site Read-Only link)

1 Like

Good question) I think it impossible in Webflow…

The only solution is to duplicate the pages for a light and dark theme. But, it’s only my opinion.

Sure you can. In the interaction panel there are tabs at the bottom where you can choose to affect the element or class. Choose class.

And after page reload this effect will remain?

Yes, but that only affects the elements with the class on that page. The class does not retain the effect if you refresh the page or go to another page with that class. I need it to affect all elements with that class across all pages of the site so the user doesn’t have to repeat turning it to night mode every time they navigate to a new post.

1 Like

I’m sorry, there isn’t a way to do that. You’ll have to do it manually on each page.