Editor X:アンカー追加・使用する
読了時間:3分
Editor X は、代理店とフリーランサー向けの新しいプラットフォームである Wix Studio に移行します。Wix Studio について
要素にアンカーを追加することで、直接リンクできるようにします。アンカーは 2通りの方法で使用できます:
- パーツをリンクする:ボタンやメニューアイテムなどのパーツをアンカーにリンクします。つまり、沢山の情報を1箇所に表示する代わりに、追加情報が掲載された他の場所に訪問者を誘導することができます。
- アンカーメニューとして表示する:訪問者がサイト内を移動しやすいように、アンカーをすべてアンカーメニューに表示します。
こちらをご参照ください:
アンカーを追加する
ページセクション、コンテナ、画像など、サイト上の要素にアンカーを追加します。アンカーを追加したら、リンクしたいときに簡単に認識できるように名前を付けます。
アンカーを追加する方法:
- アンカーを追加するパーツをクリックします。
- エディタ右側の「要素設定パネル」で「アンカー」セクションをクリックします。
- 「アンカーを追加」トグルを有効にします。
- アンカー名を入力します。
マスターもしくはマスターに紐付く要素にアンカーを追加することはできません。
アンカーメニューを追加する
訪問者がサイトをスクロールダウンした際に常に表示されるフローティングアンカーメニューを追加しましょう。訪問者は、メニューのアンカー名をクリックすることで、サイトのさまざまな部分にアクセスできます。
ヒント:
アンカーメニューは、複数のセクションから構成される非常に長い 1ページサイトで特に便利です。
アンカーメニューを追加する方法:
- Editor X 上部にある「要素を追加」 をクリックします。
- 「メニュー・検索」をクリックします。
- 「アンカーメニュー」をクリックします。
- メニューをクリックし追加するか、希望の位置までドラッグします。
アンカーにリンクする
アンカーを追加したら、画像、ボタン、テキストなどの要素をアンカーにリンクします。これらの要素をクリックすると、訪問者は関連するアンカーに誘導されます。
要素をアンカーにリンクする方法:
- リンク元のパーツをクリックします。
- 「リンク」アイコン をクリックします。
- 「アンカー」をクリックします。
- 「ページを選択」をクリックし、ドロップダウンメニューからアンカーを含むページを選択します。
- 「ページに表示するアンカー」をクリックし、ドロップダウンメニューから該当するアンカーを選択します。
- 「完了」をクリックします。
ブレイクポイントでアンカーを使用する
サイトをデザインする際、ブレイクポイントによって要素の位置が異なる可能性があることにご注意ください。よってアンカーのリンクが影響を受け、ブレイクポイントによっては訪問者をサイト上の異なる場所に誘導する場合があります。
要素は、すべてのブレイクポイントにおいて 1つのアンカーにのみリンクされます。つまり、たとえばボタンがアンカー「1」にリンクされている場合、すべてのブレイクポイントでアンカー「1」にリンクされます。 1つのブレイクポイントのみからアンカーリンクを削除することはできません。
サイトをプレビューしましょう:
すべてのブレイクポイントでアンカーへのリンクをテストし、希望通りに機能していることを確認します。
お役に立ちましたか?
|