フッターの画像はバナーになりたいので、リンクを付けたいです。
実装方法などあれば教えていただきたいです。
テーマはrefreshになります。
Topic summary
フッターのバナー画像にリンクを設定する方法についての質問と解決プロセス。
問題：
Refreshテーマのフッター画像にリンクを付けたいが、デフォルトではリンク挿入機能がない。
解決手順：
- 「コードをカスタマイズ」から「footer.liquid」ファイルを開く
- 430~450行目付近の
type="image"部分に以下のコードを追加：
{
"type": "url",
"id": "id_url",
"label": "URLを入力"
}
- 140行目付近の
<img>タグを<a>タグで囲む - カスタマイズ画面でURLを入力する欄が表示されるので、リンク先URLを入力
追加機能：
新しいウィンドウで開く場合は、<a>タグ内にtarget="_blank"を追加する。
質問者は当初URLを入力していなかったため動作しなかったが、最終的に問題は解決した。
ご質問拝見いたしました。
refreshはデフォルトの状態ですとフッターに画像を入れることは可能ですが、リンクは挿入できません。
なのでリンクを挿入するにはliquidファイルのコードの編集をする必要があります
以下が手順になります。
-
カスタマイズのメニューからコードをカスタマイズを選択する。
-
セクションファイルの中から「footer.liquid」を選択する。
-
下部の430~450行あたりにtype="image"の部分があるのでリンクを挿入するための以下コードを挿入する（参照画像添付)
{
"type": "url",
"id": "id_url",
"label": "URLを入力"
},
）
4.リンクが挿入できるようになったので、画像と挿入したリンクを連動させるためのコードを編集します。（参照画像添付）
リンクは以下のタグを140行目あたりのimgタグを囲うようにしてコードを追加するとリンク付きの画像として使用できます
以上で画像にリンクを挿入できるようになりますのでお試しください。
なにかご質問があれば、お気軽にご相談ください。
お悩み解決できましたら、ベストアンサー、いいねいただけると励みになります。
何卒よろしくお願いします。
1 Like
クリックできたということはリンクは設定できるようになったのかなと思います。
カスタマイズ画面でリンクを入力する欄を作成することはできていますでしょうか？
リンクを間違ってはいないでしょうか？
以上2点についてはいかがでしょうか？
1 Like
入力欄にURLを入力していなかったようです。問題は解決しました！
また、クリック後に新しいウィンドウで開くようにしたい場合、どのように設定すればよいでしょうか？
以下のようにtarget=“_blank” という記述をaタグ内に入れることで、別タブで開くことが可能になります。
1 Like