Community Forums › Forums › Archived Forums › General Discussion › How do I style Categories list in sidebar differently?
Tagged: categories, css
- This topic has 4 replies, 2 voices, and was last updated 11 years, 2 months ago by djw2.
-
AuthorPosts
-
February 6, 2013 at 3:53 pm #18519djw2Member
I am developing a site right now for a client with the list of categories in the left hand sidebar. The categories also have subcategories. She would like the parent categories to be bolded and the subcategories to not be bold.
How can I do this?
I just learned of the Genesis Simple Sidebars plugin a minute ago, reading someone else's post. I've read the description, but still don't know if it will help me with this problem.
Thanks
February 6, 2013 at 10:48 pm #18578OzzyMemberFebruary 7, 2013 at 3:13 pm #18748djw2MemberYes, here is a link to a page where I have posted a sample of what I'm asking about. In the sidebar is a list of categories. The names of States are subcategories of the category 'United States', but I need the Parent categories 'United States' and 'Continents' bolded while the child categories remain unbolded.
sitescapestudio.com/testerxly/home/
The only css I could find that related to categories is here below:
/* Post Meta
------------------------------------------------------------ */.post-meta {
background: url(images/dashed-line.gif) repeat-x top;
clear: both;
color: #595959;
font-family: Arial, Helvetica, sans-serif;
font-size: 11px;
font-style: normal;
text-transform: uppercase;
padding: 15px 0 0;
margin: 10px 0 0;
}.post-meta .categories {
background: url(images/icon-categories.png) no-repeat 3px 0px;
display: block;
margin: 0 0 10px;
padding: 0 0 0 40px;
}.post-meta .tags {
background: url(images/icon-tags.png) no-repeat 1px 3px;
display: block;
padding: 0 0 0 40px;
}.post-meta .tags a {
background: #efefef;
border-radius: 5px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
font-size: 10px;
padding: 4px 7px;
}.post-meta .tags a:hover {
background: #f5f5f5;
}Thank you for your help.
February 8, 2013 at 2:40 pm #19049djw2MemberI'm still hoping someone can help me out with this. I just don't know css enough yet to understand how to make some category names bold and others not.
Any help is really appreciated.
Thanks.
February 8, 2013 at 10:08 pm #19162djw2MemberI've continued to hunt for a solution to this problem and what I have found thus far is this:
In the menu panel I selected 'CSS classes' in the Screen Options dropdown menu. For each PARENT in the Categories menu I gave it a name. In my example above (on a page with the categories menu in the sidebar - not the homepage), the Parent is 'Continents' and 'United States'.
sitescapestudio.com/testerxly/services/
I gave CSS classes 'continent-parent' and 'united-states-parent'.
In the stylesheet I added;
.continents-parent {
font-weight: bold;
}.united-states-parent {
text-decoration: bold;
}Unfortunately this bolds everything in the list, not just the parent category.
It would be really helpful if someone could help me figure out this last detail, so that only the Parent name in the category list is bold.
Thanks.
-
AuthorPosts
- The forum ‘General Discussion’ is closed to new topics and replies.