Thread background doesn't show on other themes

[25or6to4]

Forum URL: (private)

Hi,

I have a CSS code that gives a thread its own background for special days, but it doesn't show on other themes when I apply the code to the theme's CSS. It only shows on the default theme. Some members use a different theme when they sign in, so they can't see it. How do I fix it so that it appears on other themes too?

The code is: .body-thread-*thread #*{
background-image: url("https://www.gifcen.com/wp-content/uploads/2022/11/confetti-gif-2.gif")!important;}, and it looks like this in the thread:




Thanks.

[Kami]

Mar 23, 2024 11:15:22 GMT -8 25or6to4 said:

Forum URL: (private)

Hi,

I have a CSS code that gives a thread its own background for special days, but it doesn't show on other themes when I apply the code to the theme's CSS. It only shows on the default theme. Some members use a different theme when they sign in, so they can't see it. How do I fix it so that it appears on other themes too?

The code is: .body-thread-*thread #*{
background-image: url("https://www.gifcen.com/wp-content/uploads/2022/11/confetti-gif-2.gif")!important;}, and it looks like this in the thread:


View Attachment

Thanks.

Hiya! This may be a silly question, but have you added this CSS to the other themes? Each theme has a dedicated stylesheet, so if you change a stylesheet to include something new, you'll have to repeat it for all themes manually. This will also allow you to match the style of the themes, should that be of interest.

Alternatively, you can take that CSS out of that theme's stylesheet, wrap it in <style></style> tags, and put it in your global headers, the CSS will apply to all themes simultaneously.

As a note, while I offered option number 2, I don't super recommend it as the headers load after the CSS and delays may be noticeable. Browsers also cache your CSS so it doesn't have to reload all the styles as you move from page to page, but it will reload the headers every time. Lastly, this does mean if you decide to change the image, it will change for all themes which may have some unintended outcomes if the image clashes somehow with other themes. It's not a "bad" option, just a suboptimal one from my perspective.

Hope this helps!

[25or6to4]

Mar 23, 2024 11:53:25 GMT -8 Kami said:

Mar 23, 2024 11:15:22 GMT -8 25or6to4 said:

Forum URL: (private)

Hi,

I have a CSS code that gives a thread its own background for special days, but it doesn't show on other themes when I apply the code to the theme's CSS. It only shows on the default theme. Some members use a different theme when they sign in, so they can't see it. How do I fix it so that it appears on other themes too?

The code is: .body-thread-*thread #*{
background-image: url("https://www.gifcen.com/wp-content/uploads/2022/11/confetti-gif-2.gif")!important;}, and it looks like this in the thread:


View Attachment

Thanks.

Hiya! This may be a silly question, but have you added this CSS to the other themes? Each theme has a dedicated stylesheet, so if you change a stylesheet to include something new, you'll have to repeat it for all themes manually. This will also allow you to match the style of the themes, should that be of interest.

Alternatively, you can take that CSS out of that theme's stylesheet, wrap it in <style></style> tags, and put it in your global headers, the CSS will apply to all themes simultaneously.

As a note, while I offered option number 2, I don't super recommend it as the headers load after the CSS and delays may be noticeable. Browsers also cache your CSS so it doesn't have to reload all the styles as you move from page to page, but it will reload the headers every time. Lastly, this does mean if you decide to change the image, it will change for all themes which may have some unintended outcomes if the image clashes somehow with other themes. It's not a "bad" option, just a suboptimal one from my perspective.

Hope this helps!

Hi Kami, yes, I applied it to each theme's CSS sheet.

Only about two or three members use a different theme other than the default, so I'd rather not try the other option if there might be a glitch.

But thank you for your suggestion.

[Kami]

Mar 23, 2024 13:12:35 GMT -8 25or6to4 said:

Mar 23, 2024 11:53:25 GMT -8 Kami said:

[snip]

Hi Kami, yes, I applied it to each theme's CSS sheet.

Only about two or three members use a different theme other than the default, so I'd rather not try the other option if there might be a glitch.

But thank you for your suggestion.

For clarity: did you previously add the CSS to each theme's stylesheet and it is still not appearing as expected, or have you now added the CSS and things are appearing as intended?

Re: the second suggestion, of course, any time. But to be clear, there is no "glitch", just a potential for a slight delay in loading the CSS. It will likely not be noticeable for most people, only folks who may be using a subpar internet connection.

[25or6to4]

Mar 23, 2024 13:22:03 GMT -8 Kami said:

Mar 23, 2024 13:12:35 GMT -8 25or6to4 said:

Hi Kami, yes, I applied it to each theme's CSS sheet.

Only about two or three members use a different theme other than the default, so I'd rather not try the other option if there might be a glitch.

But thank you for your suggestion.

For clarity: did you previously add the CSS to each theme's stylesheet and it is still not appearing as expected, or have you now added the CSS and things are appearing as intended?

Re: the second suggestion, of course, any time. But to be clear, there is no "glitch", just a potential for a slight delay in loading the CSS. It will likely not be noticeable for most people, only folks who may be using a subpar internet connection.

Kami, no, I had only used that code on my default theme. The majority of my members are using the default theme, but a few aren't. It occurred to me that when a birthday came up (what I use the background for), if it's someone using a different theme, they can't see it on the theme they're using. So I put the code on the CSS sheet of the other themes, but the background doesn't show on them.

I'll try your suggestion. 

[25or6to4]

Kami, it seems to only work with the default theme.

[Kami]

Mar 23, 2024 14:12:05 GMT -8 25or6to4 said:

Kami , it seems to only work with the default theme.

Unfortunately, I am on my phone until next week so I can't do much else to diagnose as I am not able to run any of my usual tests and such. I'll have to bow out for now, but if someone knows the answer before Monday, they'll chime in. Otherwise, I'll have a peek again when I am back on my PC.

[25or6to4]

Mar 23, 2024 15:27:25 GMT -8 Kami said:

Mar 23, 2024 14:12:05 GMT -8 25or6to4 said:

Kami , it seems to only work with the default theme.

Unfortunately, I am on my phone until next week so I can't do much else to diagnose as I am not able to run any of my usual tests and such. I'll have to bow out for now, but if someone knows the answer before Monday, they'll chime in. Otherwise, I'll have a peek again when I am back on my PC.

Okay. Thank you!

[Chris]

From the looks of things, the default theme receives a class of body-thread-xxx on pages where threads exist, which allows you to create a CSS rule using the selector .body-thread-18452 to target a specific thread for example.

SPOILER: Click to show

There are no codes or plugins that I immediately see that would add that class to the body tag, and given that you say it works only on a single theme, I am inclined to suspect a modification to the forum wrapper template of that default theme is where that class originates.

If you post the forum wrapper template for that default theme between [code] and [/code] tags, that might shed further light on the issue.

[Craig]

To follow from Chris' post above, this thread may help. If you want it to happen on all themes, you just need to replicate the process to all the themes

support.proboards.com/thread/672382/different-background

[Scott]

25or6to4 -

In your Forum Wrapper layout template for the default theme you have this:
<body{if $[thread.id]} class="body-thread-$[thread.id]"{/if}>which is not present in the other themes.

[25or6to4]

Craig, Scott, I had forgotten to put the code in the other themes as well *slaps forehead*.

Thanks guys.