リッチコンテンツエディターでのボタンの追加

  • リリースバージョン: Washingtondc
  • 更新日 2024年02月01日
  • 読む7読むのに数分
  • アクションをトリガーしたり、ユーザーを別のコンテンツにリダイレクトしたりするボタンを追加します。

    始める前に

    必要なロール:sn_cd.content_manager

    [新しいコンテンツ] フォームのフィールドに入力します。「リッチコンテンツの作成」を参照してください。

    モジュールまたは列を使用してページレイアウトを作成します。

    手順

    1. [新しいコンテンツ] フォームの [デザイン] タブから [エディターを開く] ボタンを選択して、キャンバスに移動します。
    2. リッチコンテンツエディターのキャンバスから、ドラッグアンドドロップ方式でボタンを追加できます。
    3. [設定] タブに移動します。
    4. 次のいずれかのスタイル設定を使用します。
      設定フィールド 説明
      スタイリング
      ボタンタイプ 追加するボタンのタイプを定義します。選択肢は次のとおりです。
      • プライマリ (デフォルト)
      • セカンダリ
      • リンクのみ

      ボタンタイプを選択すると、それに同期するために、ポータルテーマの設定からプルされます。詳細については、「ポータルの設定」を参照してください。

      ボタンサイズ ボタンのサイズを定義します。

      ボタンサイズを選択すると、それに同期するために、ポータルテーマの設定からプルされます。詳細については、「ポータルの設定」を参照してください。

      選択肢は次のとおりです。
      • X-Small
      • 中 (デフォルト)
      表示 画像コンポーネントやテキストコンポーネントなど、同じ列内の複数のコンポーネントの外観を構成します。次のオプションのいずれかを選択します。
      • 上と下 (デフォルト):画像は他のコンポーネントの上に表示されます。
      • 並べて表示:画像が表示され、その横に他のコンポーネントが表示されます。
      注:
      最良の結果を得るには、コンポーネントに同じ表示を設定します。たとえば、列に画像とテキストのコンポーネントがあり、画像を左側に表示し、テキストを右側に表示する場合は、両方のコンポーネント の表示 設定を [並べて表示] に変更します。
      水平配置 ボタンの配置を設定します。左、中央、または右から選択します。
      詳細なスタイリング
      ボタンの色 ボタンの色を変更します。
      1. 表示する背景色を表すカラーコードを入力します。
        注:
        すべての HTML カラーがサポートされています。詳細については、「HTML カラー名」を参照してください。
      2. または、[背景色 ] フィールドの右側にあるカラーピッカー (灰色の正方形) を選択することもできます。
      3. 表示されるカラーパレットをクリックします。
      4. カラーパレットから色を選択した後、右側のスライドバーを使用して色を微調整します。
      5. バーを上下にスライドさせます。
      6. 下部のスライドバーを使用して、色を明るくしたり暗くしたりします。
      Width

      Height

      ボタンを選択し、[幅] および [高さ] ドロップダウンを使用して数値を入力するか、上向き矢印と下向き矢印を使用して、各ボタンの幅と高さを調整できます。
      また、上向き矢印と下向き矢印の左側にある単一の下向き矢印キーを選択して、希望する測定単位を選択できます。以下から選択可能です。
      • 自動:サイズはタブ内のコンテンツに基づきます。タブに追加のテキストを入力すると、幅が自動的に大きくなります。
      • px:測定単位としてピクセルを使用します。
      • %:測定単位としてパーセンテージを使用します。
      委託証拠金 ボタンの外側と周囲のマージンまたはスペースを調整します。

      [マージン] セクションの下のドロップダウンを使用して、上下左右のマージンを調整することができます。幅と高さの場合と同じように、上向き矢印と下向き矢印の左側にある単一の下向き矢印キーを選択して、希望する測定単位を選択できます。

      ボーダー ボタンの外側の境界を編集します。
      注:
      境界はボタンの周囲の輪郭です。

      幅:上向き矢印と下向き矢印を使用して、境界線の幅を調整します。幅と高さの場合と同じように、上向き矢印と下向き矢印の左側にある単一の下向き矢印キーを選択して、希望する測定単位を選択できます。

      スタイル:ボタンの周囲の境界線の形式。ドロップダウンを選択して、ボタンの周囲の境界線のタイプを選択します。

      色:ボタンの周囲の境界線の色。背景色の選択と同様に、カラーパレットとスライドバーを使用して、ボタンの色を選択します。

      境界半径 上向き矢印と下向き矢印を使用して、境界線の半径を調整します。幅と高さの場合と同じように、上向き矢印と下向き矢印の左側にある単一の下向き矢印キーを選択して、希望する測定単位を選択できます。
      フォント名 文字の表示に使用するフォントを定義します。

      ドロップダウン矢印をクリックして、別のフォントを選択します。

      フォントサイズ フォントのサイズを設定します。
      フォントの太さ テキストをどのぐらい太くまたは細く表示するかを決定します。

      ドロップダウン矢印をクリックして、別のウェイトを選択します。

      行の高さ 2 行のテキスト間の垂直距離を設定します。
      フォントの色 ポータルテーマのフォントの色を上書きします。

      色を選択するには、16 進数コードを入力するか、カラーピッカー (フォント色の右側にある灰色の四角形) をクリックしてカラーパレットから色を選択します。

      プロパティ
      ボタンラベル ボタンの上に表示されるテキスト。
      タイトル ユーザーがボタンにカーソルを合わせたときに表示されるテキスト。
      URL Web ページまたはコンテンツの場所。ユーザーがボタンを選択したときにターゲットとする完全な URL アドレスを入力します。
      ターゲット ボタンがユーザーを誘導する場所を示します。選択肢は次のとおりです。
      • このウィンドウ:ボタンを選択すると、表示されているのと同じウィンドウでコンテンツが開きます。
      • 新規ウィンドウ:ボタンを選択すると、新しいウィンドウでコンテンツが開きます。
    5. [保存] または、[保存して終了] を選択します。
      [保存] を選択するとコンテンツが保存され、リッチコンテンツエディターのキャンバスに留まります。[保存して終了] を選択すると、レコードが保存され、[新規コンテンツ] フォームに戻ります。

    次のタスク

    • [新規コンテンツ] フォームからコンテンツをプレビューします。
      注:
      コンテンツのプレビューは、コンテンツの表示に関する一般的なアイデアを提供するように設計されています。コンテンツの公開後は、デバイスの解像度、テーマの違い、モバイルアプリのスタイル構成の違いにより、見た目が異なる場合があります。
    • (オプション)コンテンツを翻訳します。

      別の言語を選択してセッションを表示するか、作成しているコンテンツの言語翻訳を要求します。詳細については、「コンテンツエクスペリエンスおよびコンテンツ公開の言語サポート」を参照してください。

      [言語設定] ドロップダウンメニューを使用して、別の言語を選択してセッションを表示したり、作成しているコンテンツの言語翻訳を要求したりします。
      • 言語の切り替え:これにより、システム設定の言語を別の言語に切り替えることができます。これは、ログイン時の言語の変更と同様の操作です。詳細については、「コンテンツ公開 の言語の切り替え」を参照してください。
      • コンテンツを翻訳:sn_cd.enable_localization_framework_integration システムプロパティを有効にすると、コンテンツライブラリから作成されたコンテンツの [言語設定] ドロップダウンに [コンテンツを翻訳] 選択肢が表示されます。これにより、選択した言語へのコンテンツの翻訳を要求できます。詳細については、「統合: ローカリゼーションフレームワーク」を参照してください。
        注:
        コンテンツの変更が完了した後にのみ、コンテンツを翻訳してください。最良の結果を得るために、翻訳後にコンポーネントを追加または削除したり、書式設定を変更したりすることはお勧めしません。

        異なる言語で異なる書式設定のリッチコンテンツを作成するには、コンテンツを複製し、必要に応じて書式設定を変更します。次に、[対象者] を使用して、言語別にコンテンツの対象をユーザーに絞ります。「対象者」を参照してください。

    • 公開計画を構成して、コンテンツの配信先、対象者、およびコンテンツの利用可能期間を制御します。 コンテンツの公開計画の作成