dawnにて販売ページを作成していますが、売り切れ商品の画像左下に表示される売り切れの記載が小さくかつ色が黒で視認性が悪いです。
大きさと色の変更はどのように行えばよいか教えていただけますでしょうか。
Tomonyanさま
はじめまして、フルバランスの園畑です。
ご質問を確認いたしました。
売り切れの記載部分をピンポイントで変更できたら嬉しいですよね。。
一例ですが、dawnの場合、売り切れ部分の変更は基本的にコードの修正が必要かと思います。
■手順① - 売り切れ表記のコード部分にクラスを追加
セールの表記と分けるために追加します。
おそらくcard-product.liquidの添付箇所があるかと思いますので、クラスを追記してください。
(140行目あたりにも同様の記述があったため、そちらにも追記しておいた方が良いかと思います。)
■手順② - cssで装飾
以下コードを独自cssファイル、もしくは「card-product.liquid」を読み込むファイル(main-collection-product-grid.liquid、featured-collection.liquid等)に読み込んでください。
※font-sizeは任意の大きさで、background-color、border-colorは同一の色を選択されると良いかと思います。
ご参考になりましたでしょうか。
私たちの励みにもなりますので、
お役に立てていればBest Answerボタンを押して頂ければ嬉しいです。
分からない点があれば、またいつでもご連絡ください。
フルバランス 園畑
2 Likes