Thanks
Announcement
Collapse
No announcement yet.
Child Channel
Collapse
X
-
I found the code :
HTML Code:/* forum icon for forums with old posts (default) */ #forum61 .cell-forum .icon { background: transparent url("http://republicamd.com/flags/usd.png") no-repeat; } /* forum icon for forums with new posts */ #forum61 .cell-forum .icon { background: transparent url("flags/usd.png") no-repeat; width: 16px; /* icon width */ height: 11px; /* icon height */
I just want to add for each forum each icon ,,,, how can I do it ?
-
Code:.forum-list-container .subforum-list .subforum-item[data-channel-id="xxxxx"] .icon { background: transparent url('path/to/icon.png') no-repeat; }
If subforum has new posts, you can also put a different icon.
Code:.forum-list-container .subforum-list .subforum-item[data-channel-id="xxxxx"] .icon.new { background: transparent url('path/to/icon.png') no-repeat; }
Comment
-
Originally posted by Glenn Vergara View PostCode:.forum-list-container .subforum-list .subforum-item[data-channel-id="xxxxx"] .icon { background: transparent url('path/to/icon.png') no-repeat; }
If subforum has new posts, you can also put a different icon.
Code:.forum-list-container .subforum-list .subforum-item[data-channel-id="xxxxx"] .icon.new { background: transparent url('path/to/icon.png') no-repeat; }
It doesn't work properly , Let me explain , I was added some child channels , (Countries) So for each country I want to add them FLAG , do you understand what do I mean?
I tried to add width and height , and it doesn't work , and the icon is just appear on main forum , but when I press on forum , the icon is standart one,
Comment
-
Ok, do this:
Code:/* Add this to remove grayscale for subforums with new posts. Add this only once */ .forum-list-container .subforum-list .subforum-item .icon.new, .forum-list-container .forum-item.sub.new .cell-forum .icon { -webkit-filter: grayscale(0) !important; filter: grayscale(0) !important; } /* Do these for every subforum specifying appropriate image path and nodeid (29 is used in this sample) */ .forum-list-container .subforum-list .subforum-item[data-channel-id="29"] .icon, #forum29.sub .cell-forum .icon { background: transparent url('/flags/Flag_of_Switzerland.svg.png') no-repeat; width: 16px; height: 11px; -webkit-filter: grayscale(100%); filter: grayscale(100%); }
Last edited by Glenn Vergara; Fri 29th Jan '16, 12:29pm.
Comment
-
Originally posted by Glenn Vergara View PostOk, do this:
Code:/* Add this to remove grayscale for subforums with new posts. Add this only once */ .forum-list-container .subforum-list .subforum-item .icon.new, .forum-list-container .forum-item.sub.new .cell-forum .icon { -webkit-filter: grayscale(0) !important; filter: grayscale(0) !important; } /* Do these for every subforum specifying appropriate image path and nodeid (29 is used in this sample) */ .forum-list-container .subforum-list .subforum-item[data-channel-id="29"] .icon, #forum29.sub .cell-forum .icon { background: transparent url('/flags/Flag_of_Switzerland.svg.png') no-repeat; width: 16px; height: 11px; -webkit-filter: grayscale(100%); filter: grayscale(100%); }
Ok so I which ones I need to add?
Comment
-
I changed something. Here's the updated code. Remove all your old CSS for the subforum icons and then add these:
Code:/* Add this block only once */ .forum-list-container .subforum-list .subforum-item .icon.new, .forum-list-container .forum-item.sub.new .cell-forum .icon { -webkit-filter: grayscale(0); filter: grayscale(0); } .forum-list-container .subforum-list .subforum-item .icon, .forum-list-container .forum-item.sub .cell-forum .icon { width: 16px; height: 11px; -webkit-filter: grayscale(100%); filter: grayscale(100%); } /* Repeat this block for every subforum specifying appropriate image path and nodeid (29 is used in this sample) */ .forum-list-container .subforum-list .subforum-item[data-channel-id="29"] .icon, #forum29.sub .cell-forum .icon { background-image: url('/flags/Flag_of_Switzerland.svg.png'); }
Comment
-
Originally posted by Glenn Vergara View PostI changed something. Here's the updated code. Remove all your old CSS for the subforum icons and then add these:
Code:/* Add this block only once */ .forum-list-container .subforum-list .subforum-item .icon.new, .forum-list-container .forum-item.sub.new .cell-forum .icon { -webkit-filter: grayscale(0); filter: grayscale(0); } .forum-list-container .subforum-list .subforum-item .icon, .forum-list-container .forum-item.sub .cell-forum .icon { width: 16px; height: 11px; -webkit-filter: grayscale(100%); filter: grayscale(100%); } /* Repeat this block for every subforum specifying appropriate image path and nodeid (29 is used in this sample) */ .forum-list-container .subforum-list .subforum-item[data-channel-id="29"] .icon, #forum29.sub .cell-forum .icon { background-image: url('/flags/Flag_of_Switzerland.svg.png'); }
Doesn'w show icon now ,,,
Comment
-
You didn't add this block correctly.
Code:/* Repeat this block for every subforum specifying appropriate image path and nodeid (29 is used in this sample) */ .forum-list-container .subforum-list .subforum-item[data-channel-id="29"] .icon, #forum29.sub .cell-forum .icon { background-image: url('/flags/Flag_of_Switzerland.svg.png'); }
Comment
-
Originally posted by Glenn Vergara View PostYou didn't add this block correctly.
Code:/* Repeat this block for every subforum specifying appropriate image path and nodeid (29 is used in this sample) */ .forum-list-container .subforum-list .subforum-item[data-channel-id="29"] .icon, #forum29.sub .cell-forum .icon { background-image: url('/flags/Flag_of_Switzerland.svg.png'); }
Same issue :
HTML Code:/* Add this block only once */ .forum-list-container .subforum-list .subforum-item .icon.new, .forum-list-container .forum-item.sub.new .cell-forum .icon { -webkit-filter: grayscale(0); filter: grayscale(0); } .forum-list-container .subforum-list .subforum-item .icon, .forum-list-container .forum-item.sub .cell-forum .icon { width: 16px; height: 11px; -webkit-filter: grayscale(100%); filter: grayscale(100%); } /* Repeat this block for every subforum specifying appropriate image path and nodeid (29 is used in this sample) */ .forum-list-container .subforum-list .subforum-item[data-channel-id="29"] .icon, #forum29.sub .cell-forum .icon { background-image: url('/flags/Flag_of_Switzerland.svg.png'); width: 16px; /* icon width */ height: 11px; /* icon height */ }
Comment
-
Change
Code:background-image: url('/flags/Flag_of_Switzerland.svg.png');
Code:background: url('/flags/Flag_of_Switzerland.svg.png');
Comment
Related Topics
Collapse
-
Me again! I'm sure you are all getting tired of me
. We are dangerously close to having our forum all set up though, so the faster I can make these changes the faster I go away.
I got the...-
Channel: vB Cloud Support & Troubleshooting.
Wed 23rd Sep '15, 5:51pm -
-
big thanks to Glenn Vergara for this code...now we dont need to wait for a custom sprite editor to get larger and better forum icons!
wanted to start this in a clean topic because this is...-
Channel: vBulletin 5 Tutorials
Wed 9th Apr '14, 11:55am -
-
I used this tcss to change forum icons, but when I did it did this to channel description. How can i fix?
/* start custom forum icons */
/* Forums */
.forum-list-container .forum-item...-
Channel: vBulletin 5 Site Builder
Wed 30th Aug '17, 11:59am -
-
Tue 25th Mar '14, 7:24am
-
Hello i have an issue like that :
The code which i'm using in css.additional.css is:
PHP Code:/* start custom forum icons */
/* Forums */
.forum-list-container .forum-item
Tue 3rd Nov '15, 2:59pm
Comment