This one loads random background images because it has the front matter variables set.
Another version of this page is peaceful and it will load just the one bg-image from the tailwind.config.js
type = 'hidden-home'
randomizeBackground = true
It is a truly peaceful moment. This is it, just place an image in your sites static/images
directory called hidden-home-cover.webp
and it will be used for the default background image.
In your site assets
directory add a file - /assets/js/extended.js
and add something this to load your own images, either local or external.
// Check if the changeBackgroundImage function exists before calling it
if (typeof changeBackgroundImage === 'function') {
changeBackgroundImage([
'https://lh3.googleusercontent.com/pw/ABLVV84PckiqmIJNE5iB3BI_vV-grDSeDQfjyyLolAE1_t_No1Z_IlzgI9UJ5rvabL5U-gnT_v7_S07qkzF-ucjzEJT5kLFwtUaLwfebH-2R4GiUDEIukIfOHaEVi_JECfmXOyDDAsb3zwNfaZN78b2lXbwxgg=w613-h1088-s-no-gm?authuser=0',
'https://lh3.googleusercontent.com/pw/ABLVV854B1XWYwZtzSIxhizEmGnrW1jgdyI0P9gQ942oI715M_4mGXWUIniRb5p5xedTx9WS4_nGIB_IOdK9ypRNDDPStmqwpwMA_RdC6NwtolzRe1uN0d6_NIISimDXWuiuM91pzNh4RMtpyUkybPcg3hWHxw=w613-h1088-s-no-gm?authuser=0',
]);
}
Since there are no links on this page, just click back to exampleSite.