在庫切れの商品が商品一覧に価格表示されてしまい困ってしまいます。
似た質問で、base.cssの最後に以下を追加して対応する旨がありましたが表示されたままとなりました。
#CollectionSection .product-item–price { display: none;}
Topic summary
ユーザーが商品一覧ページで在庫切れ商品の価格を非表示にしたいと相談。最初に試したCSS（#CollectionSection .product-item--price { display: none;}）では効果がなかった。
解決プロセス：
- サポート担当者がプレビューリンクを要求し、
!importantを使ったCSS優先度の向上を提案 - プレビューリンク確認後、正しいCSSコードを提供：
.card-information{
display: none;
}
結果：
問題は解決し、価格の非表示に成功。サポート担当者はCSS優先度（!important）の仕組みについても説明を提供した。
1 Like
質問拝見いたしました。
こちらプレビューリンクいただけましたら詳細のcssを出せるかと思いますのでリンクと非表示の部分教えていただけたらと思います！
class名は分かりかねますが、以下のようにcssの優先度を上げてみても非表示にならないでしょうか？
display:none!important;
ご確認いただけますと幸いです。
なにかご質問があれば、お気軽にご相談ください。
お悩み解決できましたら、ベストアンサー、いいねいただけると励みになります。
何卒よろしくお願いします。
株式会社フルバランス
1 Like
ありがとうございます！
プレビューリンクこちらになります。
https://10odleli8nuejsk9-59756085404.shopifypreview.com
非表示の部分とはどういうことでしょうか？
すみません、CSSの優先度をあげるとは具体的にどういうことになりますでしょうか？
すみません、初心者のため教えていただけますと幸いです。
1 Like
ご返信ありがとうございます！
下記cssで非表示にできましたのでご参考にしてください。
.card-information{
display: none;
}
非表示の部分とはどういうことでしょうか？
→非表示にしたい箇所を教えていただきたかったです。
CSSの優先度をあげるとは具体的にどういうことになりますでしょうか？
→cssが2つ重複などしている場合に**!important**を使うと優先できます。
リンクを見て値段の部分を非表示にするcssを添付したので参考にしていただけますと幸いです。
確認お願いします！
1 Like
ご返信ありがとうございます！
再現できました！
ご丁寧にご説明いただきありがとうございました。
1 Like
再現できたようで安心しました！
また何かありましたらご相談ください！