タブの設定方法

基本情報

1つのスペースに複数の内容を表示させたい場合に利用します。テキストのみのタイプまたは画像＋テキストのタイプのどちらかを利用して作成します。

1.タブ設定の手順

以下の手順でタブの設定を行ってください。

1-1.コンテンツを追加するからタブを選択

1-2.タイプ3を選択

タイプ1、２、3とありますが、観音寺市観光協会のウェブサイトでは統一してタイプ3を利用します。

1-3.新しいアイテムを追加するを選択

1-4.コンテンツタイプを選択

テキストのみまたは画像＋テキストを選択します。ぞれぞれ入力方法が違うため、詳しい設定方法は2.コンテンツタイプについてを確認してください。

2.コンテンツタイプについて

2-1.テキストのみの場合

新しいアイテムを追加した後、テキストのみを選択します。追加すると以下の画面になります。必要な数だけ新しいアイテムの項目を追加して作成します。

編集上では、以下の箇所に入力します。

入力したものがウェブサイト上では、以下のような見え方になります。

タブを切り替えると以下のように、テキストのみの名前2が前面にでます。

2-2.画像＋テキストの場合

新しいアイテムを追加した後、画像＋テキストを選択します。選択後は以下の画面になります。

選択後、さらに画面内の新しいアイテムを追加するを選択します。少しややこしいですが、テキストのみの場合と違い、新しいアイテムの項目の中にさらに新しいアイテムを追加するの項目があるので、こちらを必要な数だけ増やして作成します。以下の画面は、新しいアイテムを2つ追加している状態です。

新しいアイテムの項目の名前の箇所にタイトルを入力します。この項目の中で追加した、新しいアイテムに画像も挿入できるようになっているので、画像を選択し追加します。

編集上では、以下の箇所に入力します。画像＋テキストの場合は、見出しの部分が名前の役割を果たします。また、テキストのみの場合と違い、フォントの色と背景の色がデフォルトのままになっているので、フォントの色を黒、背景の色を白に変更します。

入力したものがウェブサイト上では以下のような見え方になります。

タブを切り替えると以下のように、大元のタイトルは変わらずに画像＋テキスト2の見出しが前面にでます。