Although we have tried to make theme customization quite simple by keeping most of the colors in a single file(colors.less), it can still be daunting for people to edit other aspects of the theme without having a good knowledge of CSS and codoforum theme structure.
So, this guide will give a step-by-step procedure to edit the most common parts of codoforum. This is a work-in-progress page and we will keep on adding/updating the information mentioned here to keep up with the latest version of codoforum.
We will be using the constant ACTIVE_THEME
whenever we mention any path to a file which is present in the current active theme. You can find the name of your active theme by visiting the Admin panel -> UI Elements -> Themes.
sites/default/themes/ACTIVE_THEME/less/colors.less
@bodyBg: @bodyBgColor;
with @bodyBg: url('your_img_path.png') repeat;
There is more documentation in comments there to help you.
sites/default/themes/ACTIVE_THEME/less/colors.less
@globalNavLink
and/or @globalNavIconColor
to desired colorEditing the topic/post body text color
– Open sites/default/themes/ACTIVE_THEME/less/colors.less
– Change the value of the variable @articleMessageColor
to desired color.
Editing the topic title color
– Open sites/default/themes/ACTIVE_THEME/less/colors.less
– Change values of @article_A_Color
and @article_A_HoverColor
. There are two colors because it is a link as the color changes when you hover over it
Changing icon color
– Open sites/default/themes/ACTIVE_THEME/less/colors.less
– Change values of @articleIconColor
@articleIconNumViewsColor
@articleIconNumRepliesColor
as required
Not mentioning each and every color as they are clearly grouped in colors.less so with a few tries you should be able to change all the colors inside the topic/post container.
This is applicable to two pages: topics displayed in “All topics” page and topics displayed in a “category” page. Since, we only show an excerpt/preview of the topic in these pages, the maximum height is limited to a fixed number so that all topics appear uniform for easier navigation.
To increase the default height in All topics page, open sites/default/themes/ACTIVE_THEME/less/topics.less
Search for .codo_topics_topic_message
for css property max-height: 260px;
Change the number 260 as per required.
Similarly, do it in the file sites/default/themes/ACTIVE_THEME/less/category.less
This alone might not be enough for you as the text itself is cut after a specific number of words. So to increase that, open sys/CODOF/Format.php
, and change the value in the line $maxNoCharacters = 400; //Util::get_opt('max_excerpt_chars');
as per your requirement.