ビルディングブロックを使用してガイドコンテンツを追加する

最終更新日:

ビルディングブロックは、ガイドにコンテンツを追加するためのものです。テキスト、ボタン、画像、投票とアンケート調査、埋め込み動画を追加したりフォーマットするためのビルディングブロックが複数用意されています。各ビルディングブロックの詳細については、「ビルディングブロック」をご確認ください。

利用可能なテーマを使用して、テキストとボタンのビルディングブロックのスタイルを事前に設定できます。詳細については、「テーマを使用してガイドのスタイルを管理する」を参照してください。一連のビルディングブロックを一貫して使用する場合は、レイアウトとして保存します。詳細については、「ガイドレイアウトを使用する」をご覧ください。

要件

  • ビジュアルデザインスタジオ(Visual Design Studio)
  • ガイドコンテンツ編集者またはガイドコンテンツ作成者のユーザーの役割、またはガイドの作成/編集のカスタム権限
  • いくつかのビルディングブロックには、エージェントバージョンの要件があります

ビルディングブロックを追加する

ヒント:MacではOptionキーを長押し、WindowsではAltキーを長押しすると、現在のすべてのビルディングブロックとその境界ボックスが表示されます。

1. ビジュアルデザインスタジオでガイドを開き、ガイドステップを表示します。

2. 空白のステップがある場合は、選択してコンテンツを追加します。

BlankGuideStep.png

すでにステップにコンテンツがある場合:

  • 既存のビルディングブロックの上または下にカーソルを合わせて、新しい行を追加します。
  • テキスト、ボタン、または画像のビルディングブロックの左または右にカーソルを合わせて、新しい列を追加します。

SidebySide2.gif

 

3. メニューからビルディングブロックの種類を選択します。

Buildingblocks.png

 

4. 既存のビルディングブロックを選択して編集メニューを開き、変更を加えます。

BBClicktoEdit.png

 

行とブロックのフォーマットを設定する

ビルディングブロックは、新しい行を追加することで垂直方向に、または新しい列を追加することで水平方向にガイドに追加できます。ガイドステップでビルディングブロックを配置および編集するために、いくつかのフォーマットオプションが用意されています。

行のフォーマット設定

RowEditBB.png

BBEditRow.png[行を編集(Edit Row)]をクリックすると[行を編集]メニューが開き、背景色、パディング、マージン、および配置を設定できます。配置は、コンテンツを行全体で横方向に、または同じ行のコンテンツに対して垂直方向に配置します。

BBEditRowMenu.png

BBDuplicate.png[複製(Duplicate)]は行全体のクローンを作成し、同じ内容の新しい隣接行を作成します。これは、ブロック内のコンテンツに変更を加えている場合でも、ビルディングブロックで使用されているスタイル設定を複製する場合に便利です。

BBRowPosition.png[行の配置(Row positioning)]により、行全体を上下に移動させ、現在あるコンテンツと入れ替えます。ビルディングブロックの順序を簡単に調整できるため、さまざまなレイアウトを試して最適なデザインを見つけることができます。

ブロックのフォーマット設定

ColumnEditBB.png

EditRow.png[ビルディングブロックを編集(Edit Building Block)]では、ビルディングブロックの編集メニューを開き、コンテンツとスタイルの設定を編集できます。ほとんどの場合、ビルディングブロックを選択することでこのメニューに直接アクセスできますが、動画などの一部のビルディングブロックでは、選択しても編集メニューが開かず、コンテンツを再生したり、他のネイティブな動作をしたりする場合があります。

BBDuplicate.png[複製(Duplicate)]では、行の上限にまだ達していない場合に、テキスト、ボタン、および画像のビルディングブロックを同じ行に複製できます。これにより、そのビルディングブロックの種類の列を追加するのと同様に、選択したコンテンツが同じ行に複製されます。

BBDelete.png[削除(Delete)]は、そのビルディングブロックを完全に削除します。ビルディングブロックを削除する際には注意してください。警告モーダルは表示されず、元に戻すボタンもありません。

BBColumnPosition.png[列の配置(Column positioning)]によりビルディングブロックが左右に移動し、同じ行の隣のコンテンツと入れ替えることができます。ビルディングブロックを移動できない場合は、矢印がグレーアウトし、選択できません。列の配置は、テキスト、ボタン、画像のブロックでのみ設定可能です。

ビルディングブロックを並べて配置する

すべてのビルディングブロックの種類を並べて配置できるわけではありません。並べて配置できるのは、テキスト、ボタン、画像のビルディングブロックのみです。1行に配置できるビルディングブロックの数には制限があり、ボタンは最大4つ、ビルディングブロックは最大2つです。ビルディングブロックは、テキスト、ボタン、画像から任意で組み合わせることができます。たとえば、2つのテキストブロックを並べて配置したり、ボタンとテキストブロックを並べて配置したりできます。

新しい「並べて配置」機能では、既存のボタンやマルチボタンのビルディングブロックは動作しますが、テキストと画像のビルディングブロックに関しては、新しいビルディングブロックのみ並べて配置できます。2021年5月26日に「並べて配置」のビルディングブロックがリリースされる前に作成されたテキストと画像のビルディングブロックは、列の追加に対応していません。ビルディングブロックを複製すると、並べて配置せずにレガシー機能のクローンが作成されます。並べて配置するためには、新しいテキストや画像のビルディングブロックを新しい行に追加する必要があります。旧ビルディングブロックのコンテンツを新ビルディングブロックにコピー&ペーストしたあと、旧ビルディングブロックを削除することで、既存のコンテンツで新機能を利用できます。

 

 

この記事は役に立ちましたか?
24人中8人がこの記事が役に立ったと言っています