バナー要素をブロック選択・編集する際、画像やテキストだけでなく、クリックした際に遷移する先のページURLも変更したいケースは多いです。
本記事では、バナーをブロック選択しているのに遷移先リンクを変更できない際の解決方法をご紹介します。
サイト・ページ構造によっては、本記事でご案内する方法では十分に解決しない場合があります。
その際はチャットサポート窓口までご相談ください。
遷移先リンクを編集できない原因
一般的なサイトにおけるバナー部分は、簡略化すると以下のような構造になっています。
サンプルコードです。ご利用のサイト構造をお確かめください。
<div>
<a href="遷移先ページURL">
<img src="バナー画像リンク">
</a>
</div>
遷移先リンクを編集できない状態になっている場合、多くのケースでKARTE Blocksで画像要素(imgタグ)をブロックとして選択・編集しています。
画像自体は変更できますが、遷移先ページURLを設定しているaタグはブロックの選択範囲に含まれていないため、編集できません。
遷移先リンクを編集できるようにする
上記の状態からバナーの遷移先リンクも編集できるようにするためには、aタグも含んだ形でブロック選択し直す必要があります。
具体的な流れは以下の通りです。
- ブロックの編集状態を解除 (※すでにブロックの編集内容を保存済みであれば、一度変更をリセット)
- ページエディタ画面右上のツリーパネルも利用しながら、aタグも含めてブロック選択する
- ブロックを編集し、リンク、画像をそれぞれ変更する
なお、各要素を編集する際には、ページエディタ画面左上から開けるレイヤーパネルから、ブロックの各要素を確認・選択すると便利です。