Sean_M Posted December 1, 2020 Share Posted December 1, 2020 I couldn't decide on a single background for a page theme, so here's some simple code that'll allow random backgrounds on different page visits. (or refresh). Thought it might be useful for someone, improve and adapt it to your needs :-) <script type="text/javascript"> <!--Find the path to your images under site assets by using the Inspect feature on a browser. /file/asset/...--> var images = ['image_1_path', 'image_2_path']; <!--Find class name for the div that holds your background, may differ template to template. Put in below brackets--> document.getElementsByClassName('ui-theme-basicnavigation-container theme-container os-background-fill-important')[0].style.backgroundImage = 'url(' + images[Math.floor(Math.random() * images.length)] + ')'; </script> One thing to note, the HTML widget only runs once, at page load, so if you navigate around the menu and go back to a page you've already visited, it will go back to the default theme image you've chosen in the editor. But it's good for single pages etc. And you can add the code to all pages in your menu. Demo attached (refreshing triggers a new background) 2020-12-01 16-18-12.mp4 3 Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now