Продолжая обсуждение из темы Background of topic color change: Hello, how can I change the background of a certain topic?

[image] Aizada M: Can I add an image instead of a color? Hello, You can also use the category settings to set up background image to category. [Screenshot 2022-10-29 at 8.13.25]

Yes, it worked :+1:. But when I make the page public the background stays white :point_down: [image] The functionality of the public page is very limited. For example, the YouTube video preview is not shown (only the video banner is shown). You cannot make an image carousel (all images are placed one after another down the page). From here, I have the following questions: Is it possible to improve the function of the public page on my own, or are there already ready-made codes for improving the public page? Maybe I should create a separate post on this issue :thinking:

You would need to style the published page separately from the topic itself, but every published page has its own ID so it is possible to tweak them with some CSS. eg: .published-page { &.testing-published-page.topic-276.foo { /*this is my page ID which is composed of topic-title+topic-ID+category-slug*/ background-color: #c4ddc4; .published-page-header { background-color: #facccc; } blockquote { background-color: #facccc; border: 5px solid #fb7878; } }

Thanks, I really appreciate your answer. Is it possible to make the code so that the published page automatically inherits the design of the original post?

Thanks for your reply! I remembered this feature. This function sets the background for all topics in a particular category. Can I code the background in the post editor, only for a specific post. Without customizing the background of the entire section

[image] JammyDodger: *this is my page ID which is composed of topic-title+topic-ID+category-slug* Can you show me an approximate, more specific text, how it is written, otherwise I can’t? [image] topic-title = kody-css-dlya-nastrojki-oformleniya-temy category slug = staff topic id = [image] Here is my published page :point_down: [image]

Have you looked up the details for the page in your browser inspector?

no, because I don’t understand it. you mean something like this :point_down:? [image]

[image] Aizada M: topic id = [image] I took the id from the browser :point_up_2: [image]

I’m afraid my CSS skills are still limited to just snippets and tweaks, so I’m not the best person to teach even the basics. :slightly_smiling_face: We do have a few guides that may be useful? [image] Designer's Guide to getting started with themes in Discourse Developer Guides So you’re interested in in designing your own theme for Discourse? You’ve arrived at the right topic smile This guide will be more focused on the SCSS/CSS aspects of working with themes in Discourse. If you are also knowledgeable in JS/EmberJs/Handlebars you can go even deeper by looking into this guide. I will describe to you my personal method’s of designing and theming in Discourse. As with most things, there are LOTS of ways to go about implementing your own designs. I enjoy using the … [image] Developing Discourse Themes & Theme Components Developer Guides Discourse Themes and Theme Components can be used to customize the look, feel and functionality of Discourse’s frontend. This section of the developer guides aims to provide all the reference materials you need to develop simple themes for a single site, right up to complex open-source theme components. This introduction aims to provide a map of all the tools and APIs for theme development. If you prefer a step-by-step tutorial for theme development, jump straight to: Themes vs. Theme Compon…

How can I change the background of a certain topic?

Development

pfaffman (Jay Pfaffman) October 30, 2022, 10:58am 19

You can get Discourse-specific help here, but you’ll need to go elsewhere to get css tricks . I just use Google and https://css-tricks.com/

Topic		Replies	Views
Color scheme use prevents category-based background image on topic pages Bug	4	1381	February 13, 2015
#main-outlet bg hides custom category background when making a topic a banner Bug	4	1646	March 26, 2015
Customize CSS so that the published page inherits the background of a certain category (subcategory) and the background (if any) of the post Marketplace	2	561	October 31, 2022
Background of topic color change Product Support	2	973	July 22, 2019
How can I customise CSS for each category? (as in having different design for each category) Development	9	2110	October 4, 2019

How can I change the background of a certain topic?

Related topics