リンクの設定方法
Webサイト内の別ページや外部サイトへ移動するリンクの設定ができます。この記事では設定できるリンクの種類と設定手順を解説します。
手順
1. リンクを設定する
ボックスを選択し、画面右側のボックス設定パネルを開きます。[＋]をクリックして、ページを選択するか外部リンクを直接入力します。さらに[＋]をクリックするとプロパティを追加することもできます。
2. 動作確認
ライブプレビューURLを開き、リンク設定の動作確認をします。
解除手順
設定したリンクはボックス設定パネルで[ー]をクリックすると解除できます。
リンクの種類
別ページへのリンク
プロジェクト内の別ページへのリンクを設定するには、リンク先のページをリストから選択します。
CMSで管理する記事などを表示する動的ページも選択できます。
アンカーリンク（ページ内リンク）
Tips：アンカーリンクとは？
アンカーリンクは、Webページ内の特定の場所に直接移動するためのリンクです。
アンカーリンクを設定するには、あらかじめボックスにIDを設定します。IDを設定するとリンク設定から次の2種類のリンクが選択できます。
リンクの種類（例） | 詳細 |
#id | ・IDが設定された同一ページ内でのみ使用可能です。 |
/page#id | ・ IDが設定されたページ、および他のページからID設定箇所に移動できます。 |
モーダルを開く・閉じる
モーダルページを選択すると、モーダルウィンドウを開くリンクが作成できます。
モーダルページをエディタで開いている状態では[モーダルを閉じる]が選択できるようになります。
外部サイトへのリンク
外部のWebサイトにリンクさせる場合は、直接URLを入力します。[新規タブで開く]を有効にすると、リンク先が新しいタブで開くようになります。
プロパティの選択
CMSプロパティや$url プロパティは[＋]をクリックすると設定できます。
$urlは現在のページのURLを表しており、現在のページをシェアするときのリンクなどで活用いただけます。後からそのページのパスが変わったとしても、変数箇所は都度更新する必要がありません。
link anchor link button modal
ボタン テキストリンク ページ内リンク