It may have occurred to you that it would be nice to display a colorful, custom category filter that links to information pages, but on creating it you no doubt discovered that custom vocabularies don't offer anywhere to set a branding color like the Article or Event Category lists do. This write-up will show you how to incorporate it into your own custom taxonomies to get that same effect and presentation.

Please note that a Site Builder role is required in order to complete these steps.

Create your custom vocabulary

1. Navigate to Shortcuts » Taxonomy.
2. Click the + Add vocabulary button.
3. Enter a Name for your vocabulary and click Save.
4. Click on the Manage fields tab.
   
5. Click the + Add field button.
6. From under the Re-use an existing field menu, select the List (text): field_sf_brand_color option.
   
7. Click the Save and continue button.
8. Once it saves, you will be on the Brand Color settings for <your vocabulary> page. Use the breadcrumbs to return to your main vocabulary page:
   
9. Click on the Manage display tab.
   
10. Locate the Brand Color field in the list and, using its pull handle located to the left of the entry, drag it it into the Disabled section below.
11. Click the Save button to finish.
12. Click on the List tab and use the + Add term button to add term entries to your custom vocabulary. You will see that the Add term page now includes an option to add a Branding color selection.

Configure the URL alias pattern

1. Select one of your terms and click its Edit button.
2. Scroll down until you see the checkmark labeled Generate automatic URL alias. In its description text, you will see a link for Configure URL alias patterns. Click the link to continue.
3. On the Patterns screen, click the + Add Pathauto pattern.
   • Pattern type: Taxonomy term
   • Path pattern: <vocab name>/[term:name]
     Example: authors/[term:name]
     Note: there is no preceding / in front of your vocabulary name
   • Vocabulary: check the related custom vocabulary
   • Label: a name that will help you identify your custom pattern in the list
4. Click Save to finish.

Create a View block for your vocabulary

1. Navigate to Manage » Structure » Views.
2. Locate the Articles Category Filter View and use its Duplicate button. Duplicating this existing View means you're getting a View with the majority of the settings and classes already included, leaving you with only a few areas that need to be customized to achieve your goal.
3. Provide a new View name and click the Duplicate button.
4. Delete the Block - Blog and Block - Term displays.
   
5. Save your changes before continuing.
6. Customize the remain Block - News display with your own details:
   • Display name: Block - <vocabulary name>
   • FIELDS » Taxonomy term: Name
     • Expand the REWRITE RESULTS label
     • Update Link path to /vocabularyname/{{ name }}
       Example: /authors/{{ name }}
     • Check the box for Replace spaces with dashes
     • Click Apply.
   • FILTER CRITERIA » Taxonomy term: Vocabulary
     • Click this link, uncheck the unneeded box and then select your custom vocabulary
     • Click Apply.
   • BONUS: If you want to have a weighted sort, include the SORT CRITERIA and use the Add button to include Taxonomy term: Weight (asc).
7. Click Save to finish.

Attach your new View block to a page

1. Locate the page where the block will be displayed.
2. Click the page's Place Block button.
3. Use the dialog box's search filter region to search for your View name.
4. Click its corresponding Place Block button.
5. In the block's Visibility | Pages section consider also adding the pathway to your vocabulary pages if you want this block to display in conjunction with the terms. Example: for my Authors list, I'm using these paths:
   /custom-branding-colors
   /authors/*  <-- wildcard will include all term pages that fall in this pathway.
6. Click the Save block button to finish.
7. Click on the Back to site button in your admin bar to return to the page. You may find it necessary to use Clear Cache if you're not seeing your changes right away.

Page example with the block attached

Taxonomy term page with the block attached