テーマを持ったコンポーネントをスタイリングする

日本語翻訳に関する免責事項

このページの翻訳はAIによって自動的に行われました。可能な限り正確な翻訳を心掛けていますが、原文と異なる表現や解釈が含まれる場合があります。正確で公式な情報については、必ず英語の原文をご参照ください。

ComponentビルダーではStylesビルダーでテーマを構築・管理します。Stylesライブラリに保存されたテーマは、ワンクリックでコンポーネント全体のスタイルを付けることができます。

コンポーネントのテーマを選ぶことに加え、テーマに含まれる要素のカテゴリ(例えば、すべてのカードやすべてのイメージブロック)のスタイルを変更することでテーマを カスタマイズ できます。

また、スタイルを変更し たり、コンポーネント内の特定の要素を一つずつ カスタマイズ することも可能です。

コンポーネントのテーマを選びましょう

テーマは、あらかじめ作成された要素とスタイルルールの組み合わせで構成されています。主な目的は、例えばライトセクション、ダークカード、ライトテキストブロック、特定のピルスタイルをワンクリックで適用することで、複数のスタイルを同時に適用することでコンポーネントのスタイリングプロセスを改善することです。

テーマを使ったコンポーネントをスタイリングするには:

  1. Componentビルダーで、スタイルをつけたいコンポーネントをクリックします。

  2. スタイルを付けたいバージョンの右上で「 Current theme 」をクリックします。

    Screenshot of the style picker
  3. 右側のペインのThemesタブで、そのバージョンに割り当てたいテーマをクリックしてください。

コンポーネントは選んだテーマに沿ってスタイリングされています。

テーマをカスタマイズする

要素のカテゴリーごとに別のスタイルを選ぶことでテーマをカスタマイズできます。これは、テーマがデフォルトスタイルに加えて他のスタイルで事前に構築されている場合に限り可能です。テーマピッカーの right arrow クリックで代替スタイルが利用可能です。

特定のバージョンのコンポーネント向けにテーマをカスタマイズするには:

  1. Component builderでカスタマイズしたいバージョンをクリックします。

  2. バージョンの右上でCurrent theme をクリックします。

  3. 右側のペインでCustomize をクリックします。

  4. カスタマイズしたい要素タイプは right arrow をクリックしてください。

  5. Allowed stylesリストで、このコンポーネントのこの要素タイプに使いたいスタイルをクリックします。

Element customizationの概要では、カスタマイズされたスタイルがライトグリーンでハイライトされています。

Theme dialog in the right-hand pane

カスタマイズは特定のコンポーネントに適用されたテーマにのみ適用されます。別のテーマを適用すると、すべてのカスタマイズが失われてしまいます。また、カスタマイズは同じテーマを使う他のコンポーネントやバージョンに移行されることもありません。

何かフィードバックはありますか?

この記事を改善するための提案がある場合は、