The Taxonomy List block allows you to display content categorization anywhere on your page to help your readers to navigate to related content.
How To Add The Taxonomy List Block #
- 1.Open a page or a post and click on the plus icon to add a new block and look for the Taxonomy List or you can search for it if it doesn’t pop up quickly for you.
- 2.By default, you’ll get the below design-
How To Configure The Taxonomy List Block #
To configure the Taxonomy List block, switch to the ‘Content’ tab. Under the Content Tab, you’ll see general Settings like Layout, Alignment, Taxonomy type, Heading Tag, Post type, etc.
General #
This panel contains the following settings-
Heading Tag – Select the tag for your Taxonomy Name. The various options available are div, H1, H2, H3, H4, H5, H6.
Layout – Select the layout for your block- The two options available are – Grid and List.
Desktop Columns – If you have selected ‘Grid’ layout, then you’ll get the options to select the number of columns visible in one line on desktop, tablet and mobile devices.
List Style – If you have selected the ‘List’ layout, then you’ll get the options to select the style of list – Bulleted, Numbered, None.
Post Type – Select the post type you want to get taxonomies for – Post, Pages, etc.
Taxonomy – Select the type of taxonomy you want to display in your list- Categories or Tags.
Display Message – If there is no taxonomy available, then you can display a message. This setting provides you with a text field to enter the message you want to display when there is no taxonomy available.
Show Empty Taxonomy – If you want to display a taxonomy that is not added to any post/page, then turn on this option. You’ll get a list of all the taxonomies present on your website.
Show Posts Count – If you want to display the number of posts associated with taxonomy, then turn on this option.
Alignment – You’ll get this option if you select the ‘Grid’ layout. It lets you choose the alignment for your content inside the grid.
How To Style The Taxonomy List Block #
Under the Style Tab, various style settings for Colors, Spacing, Typography, and Border for the taxonomy block are available.
Colors #
This panel has the following options:
- Grid Layout – If you have selected the ‘Grid’ layout, then you’ll get the following options.
- Title Color – Select the color for the title of the taxonomy.
- Count Color – You’ll get this option if you have enabled the ‘Show Post Count’ option. It allows you to select the color for the text showing post count.
- Background Color – Select the background color for your grid.
- List Layout – If you have selected the ‘List’ layout, then you’ll get the following options.
- List Text Color – Select the color for the name of your taxonomy.
- List Style Color – Select the color for the style of the list and count color.
- List Text Color Hover – Select the hover color for the name of your taxonomy.
- List Style Color Hover – Select the hover color for the style of the list and count color.
Spacing #
This panel has the following options:
Grid Layout – If you have selected the ‘Grid’ layout, then you’ll get the following options.
- Row Gap – Set the row gap for your grid for desktop, tablet, and mobile devices.
- Column Gap – Set the column gap for your grid for desktop, tablet, and mobile devices.
- Content Padding – Set the padding for your grid content for desktop, tablet, and mobile devices.
- Title Bottom Spacing – Set the bottom space for the taxonomy name for desktop, tablet, and mobile devices.
List Layout- If you have selected the ‘List’ layout, then you’ll get the following options.
- Top Margin – Set the top margin for list items for desktop, tablet, and mobile devices.
- Bottom Margin – Set the bottom margin for list items for desktop, tablet, and mobile devices.
Typography #
This panel has the options for font family, font size, font weight and line height for the following –
Grid Layout – If you have selected the ‘Grid’ layout, then you’ll get typography options for – Title (Taxonomy list) and Count (if you have enabled the ‘Show Post Count’ option).
List Layout – If you have selected the ‘List’ layout, then you’ll get typography options for list content.
Could not load image
Border #
This panel has the following options-
Grid Layout – If you have selected ‘Grid’ Layout, then you’ll get the following options.
- Box Shadow – Set the box shadow for the grid item.
- Border – Select the border style, width, radius, and color for grid items.
- List Layout – If you have selected ‘List’ Layout, then you will get the options for ‘Separator’ style – Separator style, Separator thickness, and Separator color.