The forum of the forums
Welcome to the Official Support Forum of Forumotion!

To take full advantage of everything offered by our forum, please log in if you are already a member, or join our community if you've not yet.



Create a free forum like this one.

How to change the color of the category headers?

View previous topic View next topic Go down

Solved How to change the color of the category headers?

Post by Abbie T. on March 4th 2016, 3:12 pm

Happy Friday Guys Smile

I was wondering if there is anyway to make the category headers on a forum different colors.



*I want to change the color of "Community" and "Staff and Members"

I know not a lot of CSS, I want to learn though! But would this even be CSS?

Thanks so, very, very much in advance Smile


Last edited by Abbie T. on March 5th 2016, 6:20 pm; edited 1 time in total

Abbie T.
New Member

Posts : 14
Reputation : 1
Language : English

http://k12stemclubforum.forumotion.com

Back to top Go down

Solved Re: How to change the color of the category headers?

Post by KTV2 on March 4th 2016, 3:31 pm

This is an example for you
Code:
a-class-or-an-id-of-your-forum {background-color: #HEX}
You change #HEX to your color

KTV2
Forumember

Male Posts : 29
Reputation : 10
Language : Vietnamese, English
Location : HCM city

http://www.doraemon-vn.cf/

Back to top Go down

Solved Re: How to change the color of the category headers?

Post by Abbie T. on March 4th 2016, 3:39 pm

@KTV2 wrote:This is an example for you
Code:
a-class-or-an-id-of-your-forum {background-color: #HEX}
You change #HEX to your color

How do I get to this code to change the #HEX? And thanks Very Happy

Abbie T.
New Member

Posts : 14
Reputation : 1
Language : English

http://k12stemclubforum.forumotion.com

Back to top Go down

Solved Re: How to change the color of the category headers?

Post by KTV2 on March 4th 2016, 3:46 pm

@Abbie T. wrote:
@KTV2 wrote:This is an example for you
Code:
a-class-or-an-id-of-your-forum {background-color: #HEX}
You change #HEX to your color

How do I get to this code to change the #HEX? And thanks Very Happy
You can get color in http://www.w3schools.com/colors/colors_picker.asp

KTV2
Forumember

Male Posts : 29
Reputation : 10
Language : Vietnamese, English
Location : HCM city

http://www.doraemon-vn.cf/

Back to top Go down

Solved Re: How to change the color of the category headers?

Post by Abbie T. on March 4th 2016, 3:55 pm

@KTV2 wrote:
@Abbie T. wrote:
@KTV2 wrote:This is an example for you
Code:
a-class-or-an-id-of-your-forum {background-color: #HEX}
You change #HEX to your color

How do I get to this code to change the #HEX? And thanks Very Happy
You can get color in http://www.w3schools.com/colors/colors_picker.asp

Thanks for the link KTV2! I should clarify my question, I meant how do I change it, like how do I access this part of my forum to change the code for the header? Do I need to go to colors in the CSS Style Sheet?

Abbie T.
New Member

Posts : 14
Reputation : 1
Language : English

http://k12stemclubforum.forumotion.com

Back to top Go down

Solved Re: How to change the color of the category headers?

Post by SLGray on March 4th 2016, 8:31 pm

Do you want different colors for each header?


When your topic has been solved, ensure you mark the topic solved.
Never post your email in public.


SLGray
Administrator
Administrator

Male Posts : 36619
Reputation : 2439
Language : English
Location : United States

http://ztwds.forumotion.com/

Back to top Go down

Solved Re: How to change the color of the category headers?

Post by Abbie T. on March 5th 2016, 5:10 am

@SLGray wrote:Do you want different colors for each header?

Yes! The bar that is like the header for categories. Not the font but the actual box. Hopefully that is understandable.

Abbie T.
New Member

Posts : 14
Reputation : 1
Language : English

http://k12stemclubforum.forumotion.com

Back to top Go down

Solved Re: How to change the color of the category headers?

Post by Genesis on March 5th 2016, 5:14 am


Genesis
Helper
Helper

Male Posts : 2331
Reputation : 322
Language : English
Location : Forumountain

http://forumpromocean.com

Back to top Go down

Solved Re: How to change the color of the category headers?

Post by Abbie T. on March 5th 2016, 6:17 am


The script is not working for me. Should I post this is script problems?

Abbie T.
New Member

Posts : 14
Reputation : 1
Language : English

http://k12stemclubforum.forumotion.com

Back to top Go down

Solved Re: How to change the color of the category headers?

Post by Genesis on March 5th 2016, 7:36 am

No.

What is your forum link and version?

Genesis
Helper
Helper

Male Posts : 2331
Reputation : 322
Language : English
Location : Forumountain

http://forumpromocean.com

Back to top Go down

Solved Re: How to change the color of the category headers?

Post by Abbie T. on March 5th 2016, 2:07 pm

@Forumedic wrote:No.

What is your forum link and version?
My forum version is phpbb3.
My forum link is http://k12stemclubforum.forumotion.com/

Abbie T.
New Member

Posts : 14
Reputation : 1
Language : English

http://k12stemclubforum.forumotion.com

Back to top Go down

Solved Re: How to change the color of the category headers?

Post by YoshiGM on March 5th 2016, 5:53 pm

Hello,
Try using JavaScript:

Code:
$(function() {
$("li.header:eq(0)").css("background-color","BG COLOR HERE");
});


To add more different colors, just paste this:

Code:
$("li.header:eq(1)").css("background-color","BG COLOR HERE");

eq(1) corresponds the second cattegory that you have. You should change that number for the next cattegory, like eq(2), eq(3),etc

And the BG COLOR using Hex color or in english in the caps text Wink


YoshiGM
Forumember

Male Posts : 533
Reputation : 80
Language : Spanish & English
Location : Mexico

http://asistencia.foroactivo.com/u21373

Back to top Go down

Solved Re: How to change the color of the category headers?

Post by Abbie T. on March 5th 2016, 6:19 pm

@YoshiGM wrote:Hello,
Try using JavaScript:

Code:
$(function() {
$("li.header:eq(0)").css("background-color","BG COLOR HERE");
});


To add more different colors, just paste this:

Code:
$("li.header:eq(1)").css("background-color","BG COLOR HERE");

eq(1) corresponds the second cattegory that you have. You should change that number for the next cattegory, like eq(2), eq(3),etc

And the BG COLOR using Hex color or in english in the caps text Wink




Yay, It worked. Thanks a million your explanation was so helpful! Smile And thanks to everyone else who responded too Smile

Abbie T.
New Member

Posts : 14
Reputation : 1
Language : English

http://k12stemclubforum.forumotion.com

Back to top Go down

Solved Re: How to change the color of the category headers?

Post by SLGray on March 5th 2016, 8:16 pm

Topic solved and archived


When your topic has been solved, ensure you mark the topic solved.
Never post your email in public.


SLGray
Administrator
Administrator

Male Posts : 36619
Reputation : 2439
Language : English
Location : United States

http://ztwds.forumotion.com/

Back to top Go down

View previous topic View next topic Back to top


 
Permissions in this forum:
You cannot reply to topics in this forum