Is there any way to change the background of the my website in Discourse

Development

AI-generated summary

Changing the Background of a Discourse Website

Lord_Praise is seeking advice on how to upload a background picture to their Discourse site, similar to the current forum. merefield suggests using the browser inspector to examine the HTML and CSS, and provides a simple CSS solution to achieve this:

body {
  background-image: url($myimageurl);
  background-repeat: no-repeat;
  background-position: center;
}

merefield also recommends reading relevant articles on themes and CSS in the Discourse Meta forum.

After implementing the solution, Lord_Praise encounters an issue with transparent blocks and seeks further assistance. merefield advises looking at existing CSS themes with background images, such as the Geometric A Dark theme, to learn how to add opaqueness.

1

image
image1896×826 124 KB

just like this forum, how it is possible to upload a background picture on my site? Any answers are welcomed

2

The first thing I would do is use the browser inspector. That will allow you to see the HTML and the CSS they are employing.

Without getting too much into the weeds here which is mostly generalised CSS, a simple solution is to do something like:

body {
  background-image: url($myimageurl);
  background-repeat: no-repeat;
  background-position: center;
}

They seem to be doing something similar.

Make sure you’ve read through all the relevant articles in here: https://meta.discourse.org/tags/c/howto/devs/56/themes

3

Thanks that is very helpful, and it did works but there is one issue, that every block is like transparent glass

111
111444×446 287 KB

the EVE has not such issue, do you have any suggestion for that.

image
image813×563 103 KB

4

Yes, look around the CSS themes in https://meta.discourse.org/tags/c/theme/61/theme-full for ones with background images and take a look at how they add opaqueness. Always good to draw on prior art. Eg Geometric, a dark theme for Discourse