Hello - Is there anyway to use my own custom background image for all pages?
Thanks
Hello - Is there anyway to use my own custom background image for all pages?
Thanks
Is there any theme component which shows normal background instead on Blur background?
No, but you can create a new theme component with something like this
#main {
background-image: url(image-URL);
background-size: cover;
background-attachment: fixed;
background-repeat: no-repeat;
background-position: center;
}
I tried this and it had a weird interaction with category background images. I changed it to from #main
to body
and this worked ok.
However in both cases I noticed that the UI elements were easily obscured by the background image and set to making various css classes used by the interface to have a solid white background, but this is cumbersome as there’s no clear single class that will handle all of the containers.
Am I doing this wrong? Is there a better way to set a general background image that doesn’t obscure the text and interface?
Here is how I am setting the background:
body {
background-image: url(my-url);
background-size: cover;
background-attachment: fixed;
background-repeat: no-repeat;
background-position: center;
}
and here is how I am “fixing” the UI:
.container, .search-container, .reviewable, .discourse-post-event-upcoming-events, .tag-sort-options, .page-not-found, .page-not-found-topics {
background-color: #FFFFFF;
border: 4px;
border-style: solid;
border-color: #FFFFFF;
}
while the category backgrounds are set simply using the category UI