テーマ「Dawn」を使用しております。
①ヘッダーメニューにリンクの下線が出ないようにしたいです。
もしくは、マウスオーバーした際にだけ下線が出ると嬉しいです。
CSSで、text-decoration: none; を入れると思うのですが、どの場所に入れたら良いかがわかりません。
②コレクションリストを設置しましたが、それぞれのコレクション名の後に「→（矢印）」がついています。
こちらの矢印を消し、コレクション名のみの表示にしたいです。
恐れ入りますが、ご教授いただけますと幸いです。
Topic summary
Shopifyの「Dawn」テーマに関する2つのカスタマイズ質問とその解決方法について議論されています。
主な質問内容：
- ヘッダーメニューのリンク下線を消したい（またはマウスオーバー時のみ表示）
- コレクションタイトルに付く矢印（→）を非表示にしたい
提供された解決策：
管理画面のカスタムCSS欄に以下を追加：
- ヘッダーメニュー下線削除：
.header__menu-item span { text-decoration: none; } - コレクション矢印削除：
.card-wrapper .icon-wrap { display: none; }
追加の質問：
- 告知バナーの矢印も同様に非表示にしたい →
.slider-button { display: none; }で対応可能 - バージョンDawn 13.0.1で矢印が消えない事例が報告されたが、未解決のまま
- CSS変更後に「オンラインストアセッションを公開できません」エラーが発生 → Copyボタンでのコピペ時に末尾に不要な文字が入っていたことが原因と判明し、自己解決
初回の質問者は解決に成功し、感謝を表明しています。
@miya4 様
ご質問いただいている、ヘッダーメニューに下線を出ないようにする、コレクションページで「→」を非表示にする件ですが、
簡単に調整する方法としては、管理画面からcssを追加する方法がございます。
①ヘッダーメニューにリンクの下線非表示
1.管理画面のオンラインストア > テーマ > カスタマイズボタンをクリック
2.左メニューの『ヘッダー』をクリック
3.カスタムcss欄に下記CSSを追加
.header__menu-item span {
text-decoration: none;
}
4.保存するボタンをクリック
②コレクションリストの「→（矢印）」を非表示
1.管理画面のオンラインストア > テーマ > カスタマイズボタンをクリック
2.上部ホームページ部分をクリックし『コレクションリスト』を選択
3.左メニューの『コレクションリストのページ』をクリック
4.カスタムcss欄に下記CSSを追加
.card .icon-wrap {
display: none;
}
5.保存するボタンをクリック
ご参考まで。
（キュー小坂）
1 Like
Qcoltd様
無事にすべて望み通りの見た目にすることができました！わかりやすいご説明、本当にありがとうございました！！
質問失礼いたします。矢印を非表示にする件ですが、告知バナーも複数告知を入れると矢印が付いてしまいます。こちらをCSS欄で非表示にする方法をお教え頂けますでしょうか。
また、出来ればこの告知バナーをヘッダー部分ではなく下セクション内のどこかに移動できるようにさせたいのですが可能でしょうか？
@rk21 様
ご質問いただいている、告知バナーの左右の矢印を非表示にする件ですが、
簡単に調整する方法としては、管理画面からcssを追加する方法がございます。
1.管理画面のオンラインストア > テーマ > カスタマイズボタンをクリック
2.左メニューの『告知バナー』をクリック
3.カスタムcss欄に下記CSSを追加
.slider-button {
display: none;
}
4.保存するボタンをクリック
また、告知バナーをヘッダー以外に移動させるには、テーマファイルのliquidを編集する事で対応することは可能です。
ご参考まで。
（キュー小坂）
1 Like
Qcoltd様
ご回答ありがとうございます。早速試してみたのですが矢印が消えないままでして、、バージョンがdown13.0.1なのですがこちらは関係していますでしょうか？
また、移動させる事も可能とのこと
liquid初心者でして細かな調整に不安があるためこちらもお教え頂く事は可能でしょうか？
お手数ですがご確認よろしくお願いいたします。
追加で質問失礼致します。
コレクションの矢印を私も消去したく、こちらを参考にCSSを変更し、矢印が消えて変更はうまくいっているのですが、保存ができず、”オンラインストアのエディタセッションを公開できません”と出てしまいます。
他にもCSSを触っていて問題なくできているのですが、原因が分かりましたらご教授いただけると助かります。
すみません、解決しました！
Copyボタンを利用してのコピペをしていたのですが、最後になぜか.が入ってしまっていたのが原因でしたm(_ _)m