Discourse サイドバーメニューの並べ替え

このテーマコンポーネントをインストール

:bulb: はじめに

Discourse管理者がサイドバーメニューセクション、グローバルカスタムセクションを含むものを並べ替えたいという要望をいくつか見かけました。現在、CSSでこれを行うのはほとんどの人にとって直感的でも簡単でもなく、管理や変更が難しいため、管理UIでこれをはるかに簡単に実行できるテーマコンポーネントを作成しました。

:woman_technologist:t2: 概要

このDiscourseテーマコンポーネントを使用すると、管理者はフォーラムのサイドバーメニューセクションを管理ユーザーインターフェイスで並べ替えることができます。これには、すべてのデフォルトセクションと、グローバルに表示されるすべてのカスタムセクションが含まれます。

このコンポーネントは、デスクトップとモバイルのサイドバービュー、およびヘッダーのドロップダウンモードで機能します(ただし、理想的にはサイドバーモード向けに作られています)。


:wrench: インストールと設定

  • Discourseテーマを使用するための初心者ガイドに従って、このテーマコンポーネントをインストールします。
  • communityセクションは、サイドバーのデフォルトの最上位セクション、つまりトピックヘッダーを持つメニューとその他のドロップダウンサブメニューを指します。communityセクションの上に移動するセクション(デフォルトまたはカスタム)は1つか2つまでにとどめることをお勧めします。
  • 設定でデフォルトのセクションを削除しないでください。順序が狂ってしまいます(いつでも追加し直したり、設定をリセットしたりできます)。
  • このコンポーネントを設定する最良の方法は、コンポーネント管理画面(並べ替えリスト設定がある)を1つのブラウザウィンドウに、フォーラムのサイドバービューをもう1つのウィンドウに並べて表示することです。リスト内のメニューセクションの順序を変更するたびに、ページを再読み込みしてください。

:gear: 設定

設定 説明
Sidebar_menu_order デフォルトのメニューセクションを含むリスト設定です。community(サイドバーのデフォルトの最上位セクションで、Moreドロップダウンサブメニューが含まれます)。メニューセクションを横の上下矢印で並べ替えます。グローバルに表示されるカスタムセクションも追加できます。メニュー名のスラッグを使用します(例:Test Menuというタイトルのカスタムメニューの場合、設定にtest-menuを追加します)。

テーマコンポーネントには、初期設定が適用されています。管理者は、並べ替えリストに含めたいグローバルカスタムメニューセクションを追加し、デフォルトセクションと一緒に並べ替える必要があります。

コンポーネントのデフォルト設定のスクリーンショット


:camera_flash: スクリーンショット

以下のスクリーンショットは、コンポーネント管理パネルの左側と、通常のユーザーから見た右側にあるcommunityセクションと、2つのカスタムメニューセクション(「Dev Links」(dev-links)と「Toolbox」(toolbox))を示しています。コンポーネント管理設定でメニューセクションを上下に移動するための矢印は、小さな赤いボックス内に示されています。


ここでは、設定によりデフォルトのcategoriesセクションがcommunityセクションの上に表示されるように構成されています(折りたたまれた状態と展開された状態):

ここでは、2つのカスタムセクションを使用した例を示します。1つはdev-linksで、デフォルトのcommunityセクションの上にあり、もう1つはtoolboxで、デフォルトのtagsセクションの下にあります。

また、上記の管理スクリーンショットのinbox-sectionというセクションに注目してください。これは、Messages section for sidebarコンポーネントがサイドバーに挿入するMessagesセクションです(上記のtoolboxカスタムメニューの下に表示されており、このコンポーネントを使用して移動できることを示しています)。

さらに、このテーマコンポーネントは、Group sidebar menu sectionsおよびIndented subcategoriesコンポーネントと併用できます(上記のスクリーンショットを参照)。


:backhand_index_pointing_right: 注意事項

  • 新しいグローバルカスタムセクションをsidebar_menu_order設定に追加した後、フォーラムユーザーはブラウザを再読み込みするか、サイドバーを折りたたんだり展開したりすると、新しい正しいメニュー順序を確認できます。
  • このコンポーネントが有効な状態で新しいグローバルカスタムメニューセクションを作成すると、サイドバーが再レンダリングされるまで(ページ更新または折りたたんだり展開したりすることによる)、管理者に対して一時的に重複したセクションが表示されることがあります。
  • ユーザーが作成したカスタムメニューセクションは、そのユーザーに対して常にサイドバーの下部に表示されますが、それ以外は影響を受けません。
  • Admin -> All Site Settings -> Chat Separate Sidebar Mode設定がAlwaysに設定されている場合、チャットボタンは通常どおり下部に表示され、コンポーネントはデフォルトのチャットメニューセクション(chat-dmschat-channels、およびchat-search)を無視します。
「いいね!」 3