XF 2.3 How do I put a background image in a select Category Node ?

[CoolDude2025]

Hi I was going to see if there was a way to upload a background image to a certain category node?
mine is default white because i just bought the license but i tried searching and nothing

 

[fords8]

Hi I was going to see if there was a way to upload a background image to a certain category node?
mine is default white because i just bought the license but i tried searching and nothing

• Upload your image somewhere web-accessible (e.g. /styles/yourstyle/category-bg/cat12.jpg).
• Add this to Appearance → Templates → extra.less (in the style you’re using):

/* Category node ID 12 background */
.node--id12 .node-body {
  background-image: url('/styles/yourstyle/category-bg/cat12.jpg');
  background-size: cover;
  background-position: center;
  border-radius: @xf-borderRadiusLarge; /* optional nicety */
}

/* Optional: contrast overlay + readable text */
.node--id12 .node-body::before {
  content: '';
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,.25); /* tweak darkness */
  pointer-events: none;
}
.node--id12 .node-title a,
.node--id12 .node-meta,
.node--id12 .node-description { color: #fff; } /* if needed for contrast */

Notes:

• Replace 12 with the actual node ID (hover the node title in ACP → Forums; the edit link shows the ID).
• If your theme’s node markup stacks elements differently, you might prefer .node--id12 .node-main or .node--id12 .node-body .node-main.
• For multiple categories, duplicate the block (e.g., .node--id34, .node--id56, etc.).

Maybe this will help.

 

[CoolDude2025]

• Upload your image somewhere web-accessible (e.g. /styles/yourstyle/category-bg/cat12.jpg).

Can i get an example of where to upload the desired image? i tried looking for this example and i couldnt find a category bg

 

[fords8]

category bg

You won't find this folder. It is just an example. Replace this folder with whatever folder name you want. So you have to make a folder.