Some of the Default category display options will display articles with their descriptions. Some folks like to hide these descriptions to save space or reduce distractions on the page.
If you want to hide article descriptions, you can use some custom CSS to do so. You can approach in one of two ways:
- Customize > Style solution: Hide the article description from all category landing pages. Follow the Hide article descriptions from all category landing pages instructions.
- Snippet solution: Hide the article descriptions from specific category landing pages. Follow the Hide the article descriptions from specific category landing pages instructions.
Hide article descriptions from all category landing pages
To hide article descriptions from all category landing pages:
- Go to Customize > Style (HTML & CSS). The Style Settings page opens.
- In the Customize HTML, CSS, and JS section, select Custom CSS.
- Copy the code below and paste it into the bottom of your Custom CSS pane.
/* Hide the article description div on default category landing pages */ .hg-category-page .article-block > div { display: none; } - Be sure to Save your changes.
Article descriptions should now be hidden from all category landing pages.
Hide article descriptions from specific category landing pages
If you want to hide article descriptions from specific category landing pages rather than all category landing pages, create a snippet to hold the CSS and then add that snippet to the Category Description of the categories where you want the descriptions hidden.
Create the snippet to hide article descriptions
First, create a snippet that contains the CSS to hide article descriptions:
- In the left navigation, go to Snippets.
- Select + Create New Snippet to create a new snippet. If you're new to working with snippets, refer to Create a snippet for more detailed instructions.
- Enter a Snippet Name, like Hide Article Descriptions.
- Enter a Snippet Description, like Hide article descriptions on category landing pages. Add the Merge Code Value to the Category Description of categories where you want to hide article descriptions.
- In the Snippet Content dropdown, select Code Editor:
- Copy the code below and paste it into the editor:
<style>/* Hide the article description div on default category landing pages */ .hg-category-page .article-block > div {display: none;} </style> - Select Create to create and save your new snippet.
With your snippet created, follow the next set of instructions to Add snippet to categories.
Add snippet to categories
To apply this snippet to categories:
- Copy the snippet's Merge Code Value.
- Open the category you want to hide article descriptions from for editing.
- Paste the snippet's Merge Code Value at the end of your category description.
- Be sure to Save your changes.