Bleubird
Stitch Rabbit

Quick Tip: Customize The Categories Module Header

Did you ever want to change the heading for the Categories module in the sidebar? Well you can with Custom CSS. (Custom CSS is a feature available with the Unlimited and higher plans.)

If you are using the Category Cloud module in your sidebar, you can use the below CSS:

.module-category-cloud .module-header { font-size: 0px; letter-spacing: 0.1em; } /* Do not edit this line */

.module-category-cloud .module-header:before {
font-size: 10px;
content: "View Posts By Category";
letter-spacing: 0.1em;
}

If you are using the standard Category List module in your sidebar, you can use the below CSS:

.module-categories .module-header { font-size: 0px; letter-spacing: 0.1em; } /* Do not edit this line */

.module-categories .module-header:before {
font-size: 10px;
content: "Topics";
letter-spacing: 0.1em;
}

Within the CSS, you can edit 3 of the attributes:

  • The content attribute is where you will include the text you want to display as the header of the module instead of Categories.
  • Adjust the font-size to match the font size of the sidebar module headers set for your design.
  • Adjust the letter-spacing to match the spacing between characters of the sidebar module headers set for your design.

After you customize the CSS specific to your Category module, go to Design > Custom CSS, enter the CSS code in the text field, and click Save Changes to update your site.

comments powered by Disqus