 |
概要 | サイドバーのトグルアイコンを動的かつカスタマイズ可能にします |
 |
リポジトリ | https://github.com/Lillinator/dynamic-sidebar-icon |
 |
プレビュー | https://discourse.theme-creator.io/theme/Lilly/discourse-sidebar-icon |
 |
インストールガイド | テーマまたはテーマコンポーネントのインストール方法 |
このテーマコンポーネントをインストール
概要
サイドバーが開いているか閉じているかに応じて、ヘッダーのサイドバートグルアイコンを動的に変更する、軽量な Discourse テーマコンポーネントです。
デフォルトでは、サイドバーが閉じている間に標準的なハンバーガーメニューアイコン (bars) を表示し、サイドバーが開いている間に閉じる「X」アイコン (xmark) に切り替わります。
管理者は必要に応じて独自のアイコンを指定でき、モバイルビューでも有効にすることもできます（このコンポーネントの動的な機能はモバイル以外のビューポートサイズにのみ適用されますが、オープンアイコンを変更した管理者はモバイルUXとの一貫性を保ちたい場合があります）。
機能
- ユーザーにサイドバーとの操作方法について明確な視覚的なフィードバックを提供します。
- 管理者はテーマ設定から FontAwesome アイコンのいずれかにデフォルトアイコンを簡単に置き換えることができます。
- モバイルビューポートのUXの一貫性のために、置き換えられたサイドバーアイコンを有効にすることを許可します。
ビデオスクリーンショット
コンポーネントのデフォルト:
dog と cat アイコンを使用:
設定
コンポーネントの設定を編集して、サイドバーを開く・閉じるために使用されるアイコンをカスタマイズします:
| 設定 | 説明 |
|---|---|
Icon_to_open_the_sidebar |
サイドバーが折りたたまれているときに表示されるアイコン (デフォルト: bars) |
Icon_to_close_the_sidebar |
サイドバーが展開されているときに表示されるアイコン (デフォルト: xmark) |
Apply_open_icon_on_mobile |
モバイルビューポートでカスタム「オープン」アイコンを適用 (デフォルト: false) |
注意
- コアDiscourseに含まれていないカスタムアイコンを使用している場合、空白として表示されます。これを修正するには、Discourse管理設定の**
SVG icon subset**サイト設定にカスタムアイコン（例:rocket,cat）を追加する必要があります（All Site Settings→SVG icon subsetを参照）。 - このコンポーネントはヘッダードロップダウンモードでは動作しません。
私の他のDiscourse関連コンテンツをチェック
