Create A Forum - Support Forums
Support => Style Support => Topic started by: aIURbliS on December 30, 2012, 08:16:12 pm
-
This guide will help you step by step on how to change the color of board names. There are pictures here to help you through this guide but if you have any questions, feel free to ask!
Note: This guide is written using Google Chrome!
What we'll want to do first is to highlight the name of the board, in this case it will be General Discussion. Right click and click on Inspect Element and the Developers Tools box will show up. At the bottom right of your screen is a highlight box saying a.subject, this will be the element you want to modify with CSS.
(https://support.createaforum.com/proxy.php?request=http%3A%2F%2Fi47.tinypic.com%2Fo8v1jt.jpg&hash=677ab3018aee01831875582c03e82369abc62d1d)
Now we'll go to your Style Manager in our Admin CP and click on the Create Style tab. First, name your style, it could be anything. To make sure there aren't any conflicting code, press the F3 button on your keyboard and type a.subject. What comes up are these lines of code:
/* the board title! */
.table_list tbody.content td.info a.subject
{
font-weight: bold;
font-size: 110%;
color: #d97b33;
}
What should catch your eye already is color: #d97b33; because it says color but what is the #d97b33? Well it's something called a hex code, there are millions of colors that our eyes can see and simple text like lightlightlightlightblue won't solve the problem so hex codes are used instead. While web browsers accept text like blue and red, they may not be exactly the same color across all web browsers, however hex codes will be the same across all web browsers.
You could use any hex code you want but I'll pick a dark teal color, 008299. So just replace #d97b33 with #008299 and click the Create Style button.
(https://support.createaforum.com/proxy.php?request=http%3A%2F%2Fi45.tinypic.com%2Fr04bp5.jpg&hash=1c3cc19452ac64d99c0f707be0cabdb8a9cf2bee)
Now on the Style Manager page, click on pick style next to your newly made style.
(https://support.createaforum.com/proxy.php?request=http%3A%2F%2Fi45.tinypic.com%2F9hqffc.jpg&hash=2de73613d41157efeb0528d90668b528c8d11255)
Last thing to do is to check what you changed and enjoy!
(https://support.createaforum.com/proxy.php?request=http%3A%2F%2Fi48.tinypic.com%2F2me70bb.jpg&hash=914b5b689d2eb570df4e3bd2aeb15f3673a6385e)
-
For anyone reading this, the first picture may be a bit too wide for your screen so you'll need to scroll over horizontally to the right to see it.
-
i see your forum link :P