メタバナーのリンクを再現するには?

「カスタマイズ」、「ガイド」、「注目のトピック」、「ホスティング」の4つのボタンを作成するにはどうすればよいですか?

「いいね!」 2

Search Banner テーマコンポーネントには、独自のカスタムコンポーネントでターゲットにできる2つのプラグインアウトレットがあります。

「いいね!」 4

search_banner.search_button_textとは何ですか
写真と同じボタンを作成するにはどうすればよいですか?

ありがとうございます。カスタマイズでこのコードを挿入するオプションが見つかりませんでした。
ご案内いただけますでしょうか :pray:

テーマコンポーネントを作成します。:+1:

「いいね!」 8

まあ、大丈夫ですよ、ドン。すべては学びと共有のためです。次回は最初から意図を伝えるのが良いアイデアだと思います。共有ありがとうございます。:+1:

実は、昨日から取り組んでいます[1]。似たようなことをしましたが、まだ投稿していません。絵文字、Font Awesomeアイコン、または画像URLを選択できるような、より多くのカスタマイズオプションを追加したいのですが、ボタンごとのCSSや条件付きレンダリングなどもです。そのため、JSONスキーマ形式をたくさん探求・テストしてきました(そしてそれはかなりの頭痛の種です — 余談ですが、スタイリングを改善するためのこのPRは素晴らしいでしょう!)。後で私のバージョンをGithubにひっそりと投稿します。


  1. ↩︎

「いいね!」 9

何か成功しましたか?一つ作ってみましたが、行き詰まってしまいました。

「いいね!」 3

@Arkshineさん、このコンポーネントについて何かアップデートはありますか? 私にとっても非常に役立ちます :innocent:

「いいね!」 2

完全に忘れていました、すみません。 :smile:

残念ながら、設定のJSONスキーマ形式はまもなく非推奨になるため、私が元々やりたかったことはもう機能しなくなります(正直なところ、カスタマイズも非常にトリッキーでした)。

ドンのバージョンを投稿したかったのですが、彼のレポジトリが見つかりません。 :thinking:

できるだけ早く動作するバージョンを投稿するために、何ができるか見てみます。 :+1:

「いいね!」 3

ありがとうございます!:pray:t2:

「いいね!」 2

@Helga_Razinkova

試していただけますか? @Don@manuel のアイデアを参考にしました。

新しい Objects type for theme setting を利用しているため、最近の Discourse バージョン (3.3) が必要です。

画像

一般設定:

リンク設定:

デフォルトの外観 – テーマの色を使用しています。
image

ボタンは個別にスタイル設定できます:
image

特定の Сettings が必要な場合はお知らせください。
モバイルでは調整が必要な場合があります。デフォルトでは、ボタンは折り返され、モバイルでは 1 列に表示されます。フィードバックをお待ちしています。

すべて問題なければ、後でリリースします。 :+1:

「いいね!」 7

@Arkshine 遅れてしまい大変申し訳ありません。このアイデアをようやく実行に移すことができました :slight_smile:

ボタンを追加することができました。このプラグインには本当に感謝しています!! 今後の課題は、検索バーの直後にボタンを配置することですが、解決策が見つかることを願っています。

質問が1つあります。絵文字フィールドを必須ではなく任意にすることは可能ですか?

改めて感謝いたします!

「いいね!」 2

コンポーネントのテスト、ありがとうございます!

絵文字を任意項目に変更しました。:+1:

バナー検索コンポーネントを使用しており、ボタンを下に表示したいということでしょうか?
もしそうであれば、plugin outlets設定で below-site-header に設定できます。
ただし、CSSでスペーシングを調整する必要があるかもしれません。

追加のヘルプが必要な場合はお知らせください。 :slight_smile:

「いいね!」 1

こんにちは、ヘルガはこのプラグインアウトレットを探していると思います。:slightly_smiling_face:

「いいね!」 4

その通りです!

なぜか、プラグインアウトレットコンポーネントが表示してくれると思い込んでいました(コンポーネントがどのように生成するか忘れていました)。訂正していただきありがとうございます。:+1:


コンポーネントアウトレットで動作するように、またスペーシングのカスタマイズを容易にするために、設定を調整する必要があります。すぐにヘルガさんに更新します。

「いいね!」 3

ありがとうございます、@Arkshine @Don:fire: :fire:

「いいね!」 2

お待たせしました!コンポーネントを更新しました。いくつかの新しい設定を追加しました。

お客様の場合は、plugin_outlet 設定で search-banner-below-input を使用したいと考えています。
これにより、入力欄のすぐ下に表示されるようになります。

ご希望に応じて、コンテナの最大幅を設定できるようになりました。


`
使用した設定は以下の通りです。


画像は、「buttons wrapper max width」というラベルが付いたユーザーインターフェイス要素を示しており、スライダーコントロールと数値入力フィールドがあり、ユーザーは最大幅を600ピクセルに設定できます。また、「リセット」ボタンもあります。(AIによるキャプション)

その他、モバイルビュー用の設定もいくつかあります。

うまく機能するかどうかお知らせください。:+1:

「いいね!」 2

@Arkshineさん、ありがとうございます!すべて素晴らしいです!:heart_eyes:

「いいね!」 2

このテーマコンポーネントの設定の配置は非常にスマートですね、@Arkshineさん! いつものように、コミュニティの初心者コンポーネントビルダーにとって、素晴らしい出発点とテンプレートを提供してくださっています!

本当にありがとうございます、友よ!

「いいね!」 4

素晴らしいテーマコンポーネントです。ぜひ、このトピックで取り上げる価値があります。

このトピックのために、このコンポーネントを再フォーマットしましょうか?それとも新しいトピックを作成しましょうか?

「いいね!」 2