テーマビルダーを使用したテーマの管理または編集

  • リリースバージョン: Yokohama
  • 更新日 2025年01月30日
  • 所要時間：4分

    • テーマとスタイルを時間とコスト効率の高い方法でカスタマイズおよび管理します。カスタマイズ後、インスタンスの Web またはモバイル実装に新しいテーマを公開します。

    始める前に

    必要なロール：アドミン

    手順

    1. 移動先 すべて > Now Experience フレームワーク > テーマ > テーマビルダー.
      テーマビルダー ランディングページが新しいタブで開き、ホームページビューに表示されます。
    2. ホームページビューから [マネージャー] ページビューを選択して、利用可能なすべてのテーマを表示します。
      図 : 1. ページメニュー
      ページメニュー。
      [マネージャー] ページビューでは、既存のテーマを 2 つの方法で表示できます。グリッドビューまたはリストビューを選択できます。
      注:
      グリッドビューとリストビューの両方で、公開済みテーマと未公開テーマは別々にグループ化されます。公開されたテーマは、ユーザーのテーマ設定に表示されるテーマです。[ Web ] または [ モバイル ] ボタンを選択して、Web テーマとモバイルテーマを表示します。
      図 : 2. グリッドビュー
      グリッドビュー。
      図 : 3. リストビュー
      リストビュー。
      公開されたテーマのその他のアクション ( その他のアクションアイコン)には、次のオプションが含まれています。
      • 複製
      • 削除
      • 代替カラーパレットを追加
      • 非公開
      • デフォルトとしてマークする
        注:
        このオプションは、テーマが現在のデフォルトテーマでない場合に表示されます。
      代替カラーパレットが定義された公開済みテーマの [その他のアクション] アイコンには、次のオプションが含まれています。
      • グループ名を編集
      • 複製
      • 削除
      • 非公開
      • デフォルトとしてマークする
        注:
        このオプションは、テーマが現在のデフォルトテーマでない場合に表示されます。
      未公開のテーマの [その他のアクション] ([その他のアクション] アイコン) には、次のオプションが含まれています。
      • 複製
      • 削除
      • 代替カラーパレットを追加
      • 公開
    3. [エディター] ページビューを選択し、[テーマ] ドロップダウンリストから編集するテーマを選択します。
      図 : 4. [テーマ] ドロップダウンリストからテーマを選択します
      [テーマ] ドロップダウンリストからテーマを選択します。
      注:
      作業するテーマを選択するときは、アプリケーションスコープピッカーからテーマの正しいスコープを選択したことを確認します。
      図 : 5. アプリケーションスコープピッカー
      アプリケーションスコープピッカー。
    4. 必要に応じて、グローバルスタイルを確認して更新します。
      図 : 6. グローバルスタイルのレビュー
      グローバルスタイルを確認します。
      注:
      テーマで次のスタイルレコードが生成されます。
      • ブランドパレット:ブランドのインターフェイスの色を更新します。
      • ロゴ:ロゴを更新します。テーマの適用中に画像または概要ページからロゴをアップロードできます。詳細については、「テーマビルダーを使用したテーマの公開中にロゴをアップロードする」を参照してください。
      • フォントファミリー:エクスペリエンスにグローバルに適用されたフォントを更新します。フォントは、見出し、タイトル、サブタイトル、本文テキスト、キャプションに使用されます。
        注:
        フォントをカスタマイズする場合は、「 ネクストエクスペリエンススタイルを作成」を参照してください。カスタマイズしたフォントタイプを保存してページを更新すると、新しいフォントが カスタムフォントとして表示されます。テーマレコードからカスタムフォントを削除すると、フォントはデフォルトとして Source Sans Pro に戻ります。
      • 形状:画面上のコンポーネントの角の形状を更新します。
        注:
        形状をカスタマイズする場合は、「 ネクストエクスペリエンススタイルを作成」を参照してください。カスタマイズした図形を保存してページを更新すると、新しい図形が [混合] として表示されます。このカスタム値は [コンポーネントスタイル ] タブにも表示され、カスタム値を編集できます。
      1. オプション: より詳細な編集のために自動生成された UI の色を変更するには、[グローバルスタイルの色] パネルから [カラーパレット] アイコン を選択します。各 UI 要素の横にあるドロップダウンリストを使用して、色オプションにアクセスします。
        注:
        いずれかのカラーフックへの変更を保存すると、[上書きを削除] 記号が表示されます。[上書きを削除] 記号を選択すると、変更内容が元の自動生成色に戻されます。
        上書き記号を削除します。
    5. オプション: インスタンスに公開する前にテーマをプレビューするには、[ エクスペリエンスのプレビュー ] タブを選択します。
      [エクスペリエンスのプレビュー] タブ。
      [エクスペリエンス] ドロップダウンリストからプレビューするエクスペリエンスを選択します。
      [エクスペリエンス] ドロップダウン。
      すべてのテーマ選択が適用された実際のライブインスタンスが表示されます。選択したテーマを実際のインスタンスに実装する前にプレビューできます。
      注:
      [新しいタブで開く] アイコン を選択して、エクスペリエンスを新しいタブで開きます。未公開のテーマが選択したエクスペリエンスとどのように相互作用するかを確認できます。
      図 : 7. テーマが適用されたエクスペリエンスのプレビュー
      テーマが適用されたエクスペリエンスのプレビュー。
      注:
      公開済みのテーマの場合、エクスペリエンスプレビューのデータはライブデータです。プレビューで行った変更は、インスタンスに反映されます。
    6. テーマを公開します。
      詳細については、「テーマビルダーでテーマを公開する」を参照してください。