Welcome Link Banner

Discourse · 2022 年 2 月 18 日午後 10:21


	概要	Welcome Link Banner は、カスタムテキストと1〜4つのリンクを追加できるシンプルなバナーです。
	プレビュー	Discourse Theme Creatorでのプレビュー
	リポジトリリンク	https://github.com/discourse/discourse-welcome-link-banner
	Discourseテーマが初めての方へ	Discourseテーマの使用に関する初心者ガイド

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

機能

設定

このコンポーネントにはさまざまな設定があります！

名前	説明
show on	ホームページ、トピックリスト、またはすべてのページにバナーを表示するか選択
banner links	font awesomeアイコンとテキストを使用して1〜4つのリンクを追加します（Discourseにデフォルトで含まれていないアイコンを追加する必要がある場合は、`svg_icons`設定に追加する必要があります）
max trust level	特定の信頼レベルのユーザーにのみバナーを表示
hide for staff	スタッフに非表示
hide on mobile	モバイルで非表示
layout	テキスト左（デフォルト）またはテキスト上
plugin outlet	バナーのレンダリング場所を変更できます。サイドバーを使用している場合は `above-main-container` を試してください
hide for anon	ログアウトしたユーザーからバナーを非表示にする
can be dismissed	ユーザーが `x` をクリックしてバナーを非表示にできるようにする
banner background image	バナーの背景に表示する画像を選択
banner background repeat	背景画像の繰り返し動作を設定
banner background size	CSSを使用して背景画像のサイズを調整します（詳細情報）
banner background color	背景画像がない場合、単色を使用してください！
banner box background color	バナーボックスの背景色
banner text color	バナーのテキスト色
banner icon color	バナーのアイコン色
banner link color	バナーのリンク色

翻訳	デフォルト
meta_banner.welcome	コミュニティへようこそ！
meta_banner.subtitle	会話に参加し、優しさを忘れないでください。

当社がホストしていますか？テーマコンポーネントは、Pro、Business、Enterpriseプランで使用可能です。

awesomerobot · 2022 年 10 月 11 日午後 9:32

実験的なサイドバーを使用している場合、ウェルカムバナーがサイドバーではなくコンテンツの上に表示される設定（plugin outlet）を追加しました。この設定を above-main-container に変更してください。

この設定を変更すると、バナーがサイドバーの右側に表示されます。Meta のバナーがここに表示されているように：

JammyDodger · 2023 年 9 月 16 日午前 4:56

10件の投稿が新しいトピックに分割されました：ウェルカムリンクバナーがサイトに表示されなくなりましたか？

jaileleu · 2023 年 12 月 5 日午後 10:06

質問：ユーザー（私 ^^）がバナーを閉じた場合、どのようにして元に戻すことができますか？
Ctrl+F5を押しても戻ってきません。テストのために閉じただけです。

Arkshine · 2023 年 12 月 5 日午後 10:19

デスクトップでは、discourse_dismissedWelcomeLinkBanner という localstorage アイテムをここでクリアできます。

ブラウザコンソールを開くには F12 を押します → Application タブに移動します → 左側のパネルで Local Storage をクリックし、次にあなたのウェブサイトをクリックします → discourse_dismissedWelcomeLinkBanner キーを探して削除します。

これで完了です！リフレッシュすると、バナーが再び表示されるはずです。

martyn_thomas · 2023 年 12 月 7 日午前 1:12

ユーザーがグループに属しているか、または属していないかに基づいてバナーを表示する方法はありますか？信頼レベルではなく。

Lilly · 2023 年 12 月 7 日午前 1:28

こんにちは @martyn_thomas さんこのテーマコンポーネントをインストールすれば、CSS を使用して目的を達成できるはずです。

Aizada_M · 2023 年 12 月 10 日午後 3:30

私の質問は愚かに見えるかもしれませんが、私はプログラマーではありません。 CSS Classes for Current User's Groups コンポーネントをインストールしました。3つの異なるグループに対して3つのバナーオプションを表示したい場合、Welcome Link Banner コンポーネントを3つインストールする必要がありますか？その後、次のようにCSSをスタイル設定するにはどうすればよいですか？
グループAにはバナーAを表示し、グループBにはバナーBを表示し、グループCにはバナーCを表示するにはどうすればよいですか？例を教えていただけますか？
お返事お待ちしております

Lilly · 2023 年 12 月 10 日午後 4:05

コンポーネントは1つだけインストールしてください。使用方法についてはこちらをご覧ください。

body.group-(ここにグループ名) .welcome-link-banner-wrapper {
    display: none;
}

「(ここにグループ名)」をバナーを非表示にしたいグループに置き換えてください。

Aizada_M · 2023 年 12 月 10 日午後 4:20

ありがとうございます。これは特定のグループのバナーを非表示にしたい場合に機能しますが、グループごとに異なるコンテンツを持つ異なるバナーを表示する方法がわかりません。

Lilly · 2023 年 12 月 10 日午後 4:23

異なるバナーが必要な場合は、ウェルカムリンクバナーコンポーネント（CSSグループコンポーネントではない）を複数コピーする必要があります。表示/非表示を切り替えるために、異なるCSSを使用することもできます。

Aizada_M · 2023 年 12 月 10 日午後 4:41

これは理解できますが、そのようなCSSを実装する方法がわかりません。大まかなCSSの例が必要です。

Lilly · 2023 年 12 月 10 日午後 4:54

まず全員に対して非表示にしてから、特定のグループに対して display: block を使用することをお勧めします。やりたいことは、全員に対して非表示にしてから一部を表示するか、一部を非表示にするかのどちらかの方法で達成できる可能性が高いです。

Aizada_M · 2023 年 12 月 10 日午後 7:18

いくつか明確にしておきます。

コンポーネントのコピーが複数ある場合、クラス名はどのように記述すればよいでしょうか。例えば、

body.group-name1 .welcome-link-banner-wrapper 1{
display: none;
}
body.group- name1 .welcome-link-banner-wrapper 2 {
display: none
}
body.group-name2 .welcome-link-banner-wrapper 1{
display: block;
}
body.group-name2 .welcome-link-banner-wrapper 2{
display: none
}
body.group-name3 .welcome-link-banner-wrapper 2{
display: block
}

のような感じでしょうか？
各コンポーネントインスタンスの .welcome-link-banner-wrapper が何と呼ばれるのか分かりません。

Lilly · 2023 年 12 月 10 日午後 8:20

バナーコンポーネントを各用途のためにフォークする必要があるかもしれません。このような範囲外のユースケースには、基本的なCSSとテーマコンポーネント開発を学ぶのが最善でしょう。

nujabes · 2023 年 12 月 18 日午後 1:14

このバナーはシンプルでクリーンなので使用したいのですが、ウェルカムバナーとしてではなく、会社アプリのプロモーションに使用してもよろしいでしょうか。

リンクはApp StoreからダウンロードできるURLに設定しようと考えているのですが、こちらも問題ないでしょうか。

「Welcome to our community!」の部分は変更可能でしょうか。

Moin · 2023 年 12 月 18 日午後 1:25

はい、すべてのテキストをカスタマイズし、アイコンを選択し、好きなリンクを追加できます。
theme creatorでテーマを試すこともできます。

nujabes · 2023 年 12 月 18 日午後 1:40

@Moin

ありがとうございます！

JammyDodger · 2024 年 2 月 10 日午後 5:38

3件の投稿が新しいトピックに分割されました：「Welcome Link Banner に追加できるアイコンは何ですか？」(/t/what-icons-can-i-add-the-welcome-link-banner/294955)

Lilly · 2024 年 5 月 24 日午前 1:00

3件の投稿が新しいトピックに分割されました：特定のカテゴリにウェルカムリンクバナーを表示する

トピック		返信	表示
Versatile Banner Theme component official , versatile-banner	103	45904	2026 年 7 月 3 日
Banner Featured Links Theme component	32	1414	2026 年 4 月 14 日
Category Banners Theme component official , category-banners	85	49941	2025 年 11 月 11 日
Notification Banners Theme component	50	2546	2025 年 11 月 19 日
Setup custom Welcome banner on the homepage Support	1	997	2023 年 8 月 31 日

Welcome Link Banner

機能

設定

関連トピック