リンクメニュー (Link Menu)
リンクメニューパーツは、カスタムリンクのリストを作成して表示するためのパーツです。特集ページ内の特定セクションへのナビゲーションや、関連する外部ページへのリンク集として使用できます。
設定タブ
リンクメニューパーツを選択すると、設定エリアに以下のタブが表示されます。
- コンテンツ: メニューに表示するリンクリストを管理します。
- スタイル: メニューのレイアウト(縦/横)、各リンクの見た目、背景、余白などを設定します。
- メニュー: このパーツ自体をモバイルメニューや追従メニューに含めるかどうかを設定します。
コンテンツ設定
「コンテンツ」タブでは、メニュー項目(各リンク)を追加・編集・管理します。
(コンテンツタブ全体のスクリーンショット - リンクリスト管理UI)
- リンク項目の追加: 「+ リンクを追加」ボタンをクリックすると、新しいリンク項目がリストに追加されます。
- 表示テキスト: 各リンク項目に、メニュー上で表示されるテキスト(例: 「トップページへ」「商品一覧」)を入力します。
- リンク URL: 対応するリンク先のURLを入力します。内部リンク(同じサイト内のページ)も外部リンクも設定可能です。
- ターゲット (Target): (※もしあれば) リンクをクリックした際に、ページを新しいタブ (
_blank
) で開くか、同じタブ (_self
) で開くかを選択します。 - アイコン (Icon): (※もしあれば) 各リンクテキストの前に表示するアイコンを選択します。
- 並び替え: リスト内のリンク項目は、ドラッグ&ドロップで表示順序を変更できます。
- 削除: 不要になったリンク項目は、右端の「×」ボタンなどで削除します。
スタイル設定
「スタイル」タブでは、リンクメニュー全体の見た目やレイアウトを調整します。
(スタイルタブ全体のスクリーンショット)
- レイアウト (Layout) / 方向 (Direction): メニュー項目の並び方(縦方向リスト / 横方向リスト)を選択します。
- 配置 (Alignment): メニュー項目全体の配置(左揃え、中央揃え、右揃え、均等割り付け)を設定します。
- 区切り線 (Divider): (※もしあれば) 各メニュー項目の間に区切り線を表示するかどうか、線の種類や色を設定します。
- リンクスタイル: ナビゲーションリンクの通常時・ホバー時・アクティブ時の文字色、背景色、装飾(下線など)を設定します。
- 背景 (Background): パーツ全体の背景色や背景画像を設定します。
- パディング・マージン (Padding/Margin): パーツの内側・外側の余白を調整します。
- 枠線 (Border): パーツに枠線を追加します。
- … その他、フォントサイズなどのスタイルオプションがあれば記載。
メニュー設定
「メニュー」タブでは、このリンクメニューパーツをモバイルメニューや追従メニューに含めるかどうかを設定します。
設定方法の詳細は「6. メニュー設定(モバイル・追従)」ガイドを参照してください。
これでリンクメニューパーツの設定は完了です。