投稿セクションのためのカスタムCSSスタイルを作成する最良の方法は?

前置き

コミュニティのDiscourseインスタンスのセットアップとカスタマイズを進める中で、プラットフォームの計り知れない力を活用して、自分自身とユーザーの幸福度を高める方法を模索してきました。

実現したいことの1つは、プライベートメッセージにカスタム署名を追加し、「署名」することです。画像ではなく、Googleフォントで名前を使いたいと考えています。

これを機能させることで、投稿作成中にコミュニティにスニペットなどを提供する方法を理解するのに役立ちます。そのため、質問は具体的ですが、知識は一般的になります。

質問する理由は、これらのブロックを作成して使用する前に、それが最善の方法かどうかを確認したいからです。巧妙なアイデアを思いついた場合、議論を開始するためにいくつかの例を共有することを考えています。そうすれば、私よりも賢い人々からさらに巧妙なアイデアを得ることができます。 :slight_smile:

質問:投稿内のテキストをCSSでターゲットできるブロックに入れる方法は?

これまでに見つけたこと

以下のトピックを見つけました。

投稿内のカスタムCSS / カスタムクラスの追加

そのトピックから、この回答を得ました。

これは機能するようですが、現在、これが最善の方法/手法として考えられているかどうかに興味があります。

せっかくなので、少しトピックから外れますが、トピックに関連する質問です。

署名のアイデアを機能させるためにカスタマイズを「悪用」していますが、うまくいかず、誰かすぐに洞察があれば知りたいと思っています。

プラグインを使用してカスタムGoogleフォントを読み込んでいますが、フォーラム全体でこれらのフォントが正常に使用されているため、機能することはわかっています。「Playwrite USA Traditional」を強制的に読み込むために使用しました。

テーマに次のCSSがあります。

div[data-theme-ieh] {
    font-family: "Playwrite USA Traditional";
    text-align: right;
}

サンプル投稿のdivは確かに右揃えになっていますが、テーマのフォントでもPlaywriteでもなく、Arialまたは類似のものを使用しています。

設定で何か愚かなことを見落としていますか、それとも他に何か見落としていることはありますか?これはDiscourseの質問ではありません。

また、Googleフォントをサイトで使用するために読み込むより良い方法はありますか?

Generic bbcode wrapper for theme components を参照することをお勧めします。

共有された内容からは何も思いつきません。ライブフォーラムへのリンクを共有できれば、問題を見つけるお手伝いがしやすくなります。

「いいね!」 1

https://fonts.google.com/share?selection.family=Playwrite+US+Trad:wght@100..400/ から埋め込みコードを確認したところ、"Playwrite US Trad" になるはずです。

// <uniquifier>: ユニークで説明的なクラス名を使用してください
// <weight>: 100から400の値を使用してください

.playwrite-us-trad-<uniquifier> {
  font-family: "Playwrite US Trad", cursive;
  font-optical-sizing: auto;
  font-weight: <weight>;
  font-style: normal;
}
「いいね!」 1

おー、これは良さそうですね。教えてくれてありがとうございます!

本当に、それだけが望みでした。時間を無駄にしたくなかったのですが、もし何か本当に明白なことがあれば、と思って。笑。

…おバカなGoogleめ…うーん。コンポーネントの指示に従って、大文字小文字を含めて正しい名前であることを確認することに気を取られすぎて、Googleが実際に使用している名前を確認することすらしていませんでした。ドジだ。

参考までに、正しいフォント名を読み込み、正しいフォント名を参照すると、当初期待していた結果が得られます。

そして今、私の投稿に「署名」できます。


ありがとうございます :slight_smile:

「いいね!」 1

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.