Hierarchical Taxonomy Menu
A Drupal module that creates hierarchical navigation menus from taxonomy vocabulary terms with support for images, collapsible behavior, and entity reference counting.
hierarchical_taxonomy_menu
インストール
composer require 'drupal/hierarchical_taxonomy_menu:^2.0'
composer require 'drupal/hierarchical_taxonomy_menu:8.x-1.43'
概要
Hierarchical Taxonomy Menuは、TaxonomyボキャブラリーをフルコントロールできるBlock配置可能な階層型ナビゲーションメニューに変換する強力なDrupalモジュールです。選択したボキャブラリー内のタームから親子階層を維持しながらメニュー項目を自動生成する設定可能なBlockを提供します。
主な機能として、メニュー項目の横に画像を表示する機能（Taxonomyタームに画像FieldまたはMediaの画像参照がある場合）、JavaScriptによる折りたたみ・展開可能なメニュー動作、現在のTaxonomyタームページに基づいて動的に更新されるBlockタイトルがあります。メニューの深さ制限、ベースタームによるフィルタリング、各タームを参照するNodeやCommerce製品の数を表示する機能もサポートしています。
このモジュールは完全に翻訳可能で、言語ごとのターム公開状態を尊重します。HTML構造を完全に制御できるカスタマイズ可能なTwigテンプレートが含まれており、あらゆるデザイン要件に合わせてメニューをスタイリングできます。キャッシュオプションにより、メニューコンテンツを最新に保ちながら最適なパフォーマンスを確保します。
Features
- 任意のTaxonomyボキャブラリーから親子構造を自動的に維持した階層型ナビゲーションメニューを作成
- Taxonomyタームの画像Fieldまたはメディア画像参照を使用してメニュー項目の横に画像を表示
- ピクセル寸法または画像スタイルによる設定可能な画像サイズ
- JavaScriptによる展開・折りたたみアニメーション付きの折りたたみ可能なメニュー動作
- 親項目をクリック可能なリンクとサブメニューのトグルスイッチの両方として機能させるインタラクティブ親モード
- Taxonomyタームページ表示時に現在のターム名に自動的に一致する動的Blockタイトル
- 0〜10レベルまたは無制限サブレベルのメニュー深さ制御
- ベースターム（IDまたは名前）を指定してその子孫のみを表示するメニュー項目フィルタリング
- 現在のTaxonomyタームページからベースタームを自動設定する動的ベースタームモード
- 各タームの横に参照しているNodeまたはCommerce製品の数を表示
- すべての子タームからのカウントを含む再帰的Entityカウント計算
- 参照コンテンツ（Node/Commerce製品）がないタームを非表示にするオプション
- キャッシュなしから永続キャッシュまでの設定可能なキャッシュ
- ボキャブラリーが空の場合にBlock全体を非表示にするオプション
- 翻訳対応のターム名とURLによる完全な多言語サポート
- 言語ごとの公開・非公開状態を尊重するターム状態認識
- ボキャブラリーごとのテーマサジェスション付きカスタマイズ可能なTwigテンプレート
- 簡単なテーマ設定のためのBEMスタイルCSSクラス
- メニュー内の現在のタームのアクティブ状態ハイライト
- アクティブなタームへのメニューパスを展開したまま維持する機能
Use Cases
Category Navigation Sidebar
Create a sidebar menu showing product or article categories from a taxonomy vocabulary. Users can browse content by clicking category terms, and child categories are shown in a hierarchical tree structure. Enable collapsible mode to conserve space while allowing users to expand categories of interest.
E-commerce Product Filtering
Display a product category menu with the count of available products next to each category. Enable 'Show count of referencing commerce products' and select the appropriate taxonomy reference field. Enable 'Exclude empty terms' to hide categories with no products. Users can see at a glance how many products are in each category.
Visual Category Menu with Icons
Add an image field to your taxonomy vocabulary and upload category icons or images for each term. Configure the block to display images using an image style like 'thumbnail'. The menu will show each category with its associated icon, creating a visually appealing navigation experience.
Contextual Subcategory Menu
Enable 'Dynamic Base term' to create a menu that automatically shows only the children of the current taxonomy term. When viewing a parent category page, the menu shows its subcategories. This is useful for deep category structures where you want to focus on the current location in the hierarchy.
Collapsible Documentation Navigation
For a documentation site organized by taxonomy, enable collapsible mode with 'Stay open at current taxonomy term'. The menu starts collapsed but automatically expands to show the path to the current page, helping users understand their location while keeping unrelated sections collapsed.
Multilingual Site Navigation
On a multilingual site with translated taxonomy terms, the menu automatically displays term names in the current language. The module respects per-language term status, so you can have terms published in some languages but not others, and the menu adapts accordingly.
Tips
- Use theme suggestions (hierarchical-taxonomy-menu--VOCABULARY.html.twig) to create vocabulary-specific templates with custom markup
- The block uses the 'taxonomy_term_list' cache tag, so the menu automatically updates when terms are added, edited, or deleted
- For better performance on sites with many taxonomy terms, use the cache settings to reduce database queries
- When using dynamic block title, the title only changes on taxonomy term pages - on other pages it shows the configured block title
- The 'Interactive parent' option adds a separate arrow toggle so parent items can be both links and expand/collapse triggers
- Image fields and Media image references are both supported for displaying images next to menu items
- Use 'Base term' to create multiple blocks from the same vocabulary showing different branches of the hierarchy
- The CSS classes follow BEM naming (block-taxonomymenu__*) for predictable styling
- Unpublished terms are automatically hidden from the menu based on the current language
Technical Details
Hooks 4
hook_help
Implements hook_help() to provide help text on the module's help page. Displays the contents of README.md, optionally rendered as Markdown if the Markdown module is enabled.
hook_theme
Implements hook_theme() to register the hierarchical_taxonomy_menu theme hook with its available variables.
template_preprocess_block
Implements template_preprocess_block() to dynamically set the block title to the current taxonomy term name when the dynamic_block_title option is enabled.
hook_theme_suggestions_HOOK
Implements hook_theme_suggestions_hierarchical_taxonomy_menu() to provide vocabulary-specific template suggestions.
Troubleshooting 6
Verify that the selected vocabulary contains published terms. Check if 'Hide block if output is empty' is enabled and if so, ensure there are terms to display. Also verify the base term setting is not filtering out all terms.
Ensure you selected the vocabulary option that includes the image field (e.g., 'Categories (with image: field_image)'). Verify that the image field on taxonomy terms has images uploaded. Check if image style settings are correct if using image styles.
Check browser console for JavaScript errors. Ensure the hierarchical_taxonomy_menu library is loading correctly. Verify jQuery is available on the page. The expand/collapse requires JavaScript to be enabled.
Ensure you have content (nodes or commerce products) that references the taxonomy terms. For commerce products, verify you selected the correct 'Referencing field' in block settings. Check that the referencing field exists and contains values.
The dynamic block title only works on taxonomy term pages (/taxonomy/term/ID). Ensure 'Make the block title match the current taxonomy term name' is enabled and 'Display title' is set to visible in block settings.
Verify that taxonomy terms have translations for the current language. Check that translated terms are published (status can differ per translation). Ensure the locale module is enabled and language detection is working.
Security Notes 3
- The module properly escapes term names and URLs in the template to prevent XSS vulnerabilities
- Term access is respected - unpublished terms are not shown to users without appropriate permissions
- The module uses Drupal's standard caching system with proper cache tags for security and performance