 |
概要 |
 |
プレビュー |
 |
リポジトリリンク |
 |
Discourse テーマが初めての方へ |
このテーマコンポーネントをインストール
機能
このテーマコンポーネントは、以前のバナー機能の進化版です。テーマ設定を活用することで、より手軽で柔軟な運用を実現することを目的としています。
主な機能は以下の通りです：
- ログインユーザーまたは匿名ユーザーのみに表示を制限
- モバイル端末またはデスクトップのみに表示を制限
- 特定のページでのみ表示を制限
- 閉じる、展開、常時表示のオプション
- ブラウザ幅いっぱいの表示オプション
- 色管理
- HTML を使用した見出しとカラムのカスタマイズ（詳細は後述）
- 状態の永続化オプション（詳細は後述）
バナーコンテンツのカスタマイズ
バナーのコンテンツは、主な見出しとカラムに分割されます。バナーには最大 5 つのカラムを設定できますが、幅の制限により、推奨される数は 3 つ以下です。HTML テンプレートが用意されており、個々のニーズに合わせてカスタマイズできます。また、各カラムの幅を制御したり、各カラムの上部に任意の画像や Font Awesome アイコンを追加することも可能です。
状態の永続化オプションの使用
状態の永続化オプションでは、最大 2 つのクッキーを使用します。これらのクッキーにはバナーの名前と、バナーの状態（開閉・展開・折りたたみ）を表す true/false 値が含まれます。サイトでのクッキー使用に懸念がある場合は、この設定の使用を避けることをお勧めします。cookie_lifespan 設定に相対時間を指定すると、ユーザーが適切なボタンを押した後、その時間 동안 バナーが閉じられた状態、展開された状態、または折りたたまれた状態を維持します。この設定がない場合、バナーは完全なページ読み込みごとにリセットされます。バナーに変更を加え、以前にバナーを閉じていたユーザーを含むすべてのユーザーに変更を反映させたい場合は、「cookie name」を変更してください。これにより、永続的な状態が実質的にリセットされ、ユーザーが再度バナーを閉じることができるようになります。
設定
| 名前 | 説明 |
|---|---|
| show for members | フォーラムにログインしているユーザーにバナーを表示 |
| show for anon | 匿名ユーザーにバナーを表示 |
| display on mobile | モバイルデバイスでバナーを表示 |
| display on desktop | デスクトップコンピュータでバナーを表示 |
| display on homepage | ホームページでバナーを表示 |
| url must contain | バナーを表示するパスを入力。パスの末尾に * を追加してワイルドカードとして使用 |
| dismissible | ユーザーがバナーを閉じられるようにする |
| collapsible | ユーザーがバナーを展開・折りたたみできるようにする |
| default collapsed state | 折りたたみ設定が有効な場合のデフォルトの折りたたみ状態 |
| cookie lifespan | バナーが閉じられたか、展開されたか、折りたたまれたかを記憶するためのクッキーの有効期間。「none」に設定すると、このコンポーネントでクッキーは使用されず、バナーに関連する以前に作成されたクッキーは、ユーザーが次の完全なページ読み込みを行った際に削除されます。値は単一の単位で測定され、「year」に設定すると 1 年、「week」に設定すると 1 週間などが適用されます。 |
| cookie name | バナーに重要な変更を加えた場合は、すべてのユーザーに変更を反映させるためにクッキー名を変更する必要があります。 |
| full width banner | ブラウザ幅いっぱいでバナーを表示 |
| swap default positioning | 他のバナー関連コンポーネントがアクティブな場合、Versatile Banner とその位置を入れ替える |
| plugin outlet | below-site-header はサイドバーの上、above-main-container はサイドバー横のコンテンツの上に配置 |
| banner background image | 背景画像のソース URL。ヒント：メインテーマに画像をアップロードし、その URL を使用できますが、このコンポーネントの「Uploads」セクションを使用しないようにしてください。このコンポーネントに追加されたアップロードは、更新時に削除されます。 |
| banner background image dark | システムのダークモードが検出されたときの背景画像のソース URL。 |
| background color | 背景画像の代わりに使用される色 |
| background color dark | システムのダークモードが検出されたときに背景画像の代わりに使用される色 |
| primary text color | バナーのメインテキストの色 |
| primary text color dark | システムのダークモードが検出されたときのバナーのメインテキストの色 |
| secondary text color | アイコンとテキスト見出しのテキスト色、およびボタン背景色 |
| secondary text color dark | システムのダークモードが検出されたときのアイコンとテキスト見出しのテキスト色、およびボタン背景色 |
| link text color | バナー内のリンクのテキスト色 |
| link text color dark | システムのダークモードが検出されたときのバナー内のリンクのテキスト色 |
| 翻訳 | デフォルト |
|---|---|
| close.title | バナーを閉じる |
| close.label | 閉じる |
| toggle.title | バナーを展開/折りたたむ |
| toggle.collapse_label | 折りたたむ |
| toggle.expand_label | 展開 |
私 hosts されていますか？テーマコンポーネントは、Pro、Business、Enterprise プランで利用可能です。