Hi, so I'm using Xenforo Cloud and for my site styling I like to use the grid layout with wallpapers on for my different nodes, however I want to make it so in different styles the nodes have a different wallpaper attached, however in the grid layout styling options it only directs to the folder with the current node wallpapers in when I'd like to direct it elsewhere so the images change depending on what style is used, is this possible? Thanks.
You are using an out of date browser. It may not display this or other websites correctly.
You should upgrade or use an alternative browser.
You should upgrade or use an alternative browser.
Different node wallpapers for different styles
- Thread starter Kaj
- Start date
-
- Tags
- help nodes styles wallpapers
Solution
Hello,
You can add the following to your extra.less file to change the background-images of certain nodes.
For example, to change the image on "Announcements and forum updates", which has a node ID of 7, use this:
Repeat that code for multiple nodes, changing the 7 to the correct ID. You can get the ID by checking the URL of the forum, eg:
I hope that helps!
You can add the following to your extra.less file to change the background-images of certain nodes.
For example, to change the image on "Announcements and forum updates", which has a node ID of 7, use this:
Less:
.focus-grid .block--category .node--id7 .node-body{
background-image: url('https://site.com/image.jpg');
}
Repeat that code for multiple nodes, changing the 7 to the correct ID. You can get the ID by checking the URL of the forum, eg:
Code:
https://forum.marianabay.com/forums/announcements-forum-updates.7/
I hope that helps!
Here.Hi @Kaj
If you can send me a URL to your site (once you've added all of your grid images to one of your styles), I'll take a look at the output and will get back to you![]()
Mariana Bay
A Humble Underground Music Forum. Discuss music, mysteries, gaming, art, movies, anime, books, and more!
forum.marianabay.com
- Messages
- 5,062
- Website
- www.xenfocus.com
Hello,
You can add the following to your extra.less file to change the background-images of certain nodes.
For example, to change the image on "Announcements and forum updates", which has a node ID of 7, use this:
Repeat that code for multiple nodes, changing the 7 to the correct ID. You can get the ID by checking the URL of the forum, eg:
I hope that helps!
You can add the following to your extra.less file to change the background-images of certain nodes.
For example, to change the image on "Announcements and forum updates", which has a node ID of 7, use this:
Less:
.focus-grid .block--category .node--id7 .node-body{
background-image: url('https://site.com/image.jpg');
}
Repeat that code for multiple nodes, changing the 7 to the correct ID. You can get the ID by checking the URL of the forum, eg:
Code:
https://forum.marianabay.com/forums/announcements-forum-updates.7/
I hope that helps!
Lovely stuff thank you, hopefully this works. Not ready to update yet but when I do I'll get back to you on results.Hello,
You can add the following to your extra.less file to change the background-images of certain nodes.
For example, to change the image on "Announcements and forum updates", which has a node ID of 7, use this:
Less:.focus-grid .block--category .node--id7 .node-body{ background-image: url('https://site.com/image.jpg'); }
Repeat that code for multiple nodes, changing the 7 to the correct ID. You can get the ID by checking the URL of the forum, eg:
Code:https://forum.marianabay.com/forums/announcements-forum-updates.7/
I hope that helps!