Liquid、JavaScriptなどに関する質問
はじめまして。
完全に初心者のため、コード編集に関する知識はまったくないため、
Dawn商品情報の商品説明箇所のフォントサイズをデバイス別に変更する方法を教えてください。
商品タイトルについては、main-product.liquidの27〜32行目に追記したコードでフォントサイズを変更できたので、
同様に以下のコードをその後に追記したのですが、商品説明のフォントサイズの変更はできませんでした。
<style>
product__description {font-size: calc(var(--font-heading-scale) * 1.5rem)}
@media only screen and (min-width: 750px){
product__description {font-size: calc(var(--font-heading-scale) * 2.0rem)}
}
</style>
以下の方法も確認済みですが、商品管理から商品説明箇所に以下のようにコードを追記しても反映させれませんでした。
どのファイルのどの箇所にどのコードを入れれば、商品説明のフォントをデバイス別に変更できるのか、ご教示頂けると幸いです。
よろしくお願いします。
解決済! ベストソリューションを見る。
成功
セレクターの指定の仕方に少しだけ不足があるだけですので、
下記のようにされれば、指定のフォントサイズにできるかと思います。
<style>
.product__description {font-size: calc(var(--font-heading-scale) * 1.5rem)}
@media only screen and (min-width: 750px){
.product__description {font-size: calc(var(--font-heading-scale) * 2.0rem)}
}
</style>
CSSクラス名をセレクターとして指定する際は、
product__description
ではなく
.product__description
のようにします。
ご参考まで。
(キュー田辺)
成功
セレクターの指定の仕方に少しだけ不足があるだけですので、
下記のようにされれば、指定のフォントサイズにできるかと思います。
<style>
.product__description {font-size: calc(var(--font-heading-scale) * 1.5rem)}
@media only screen and (min-width: 750px){
.product__description {font-size: calc(var(--font-heading-scale) * 2.0rem)}
}
</style>
CSSクラス名をセレクターとして指定する際は、
product__description
ではなく
.product__description
のようにします。
ご参考まで。
(キュー田辺)
フォントサイズ調整できました。
ありがとうございます。大変助かりました。
いつもShopifyをご利用いただき、ありがとうございます。 Shopifyは、皆様の日本語での利用体験の向上に努めております。さらなる改善のために皆様のご意見をお寄せい...
By JasonH May 9, 2025Shopify アカデミーの学習パスと認定スキルバッジExpanding Your Shopify Business Internationallyを活用して、国際的にビジネ...
By Shopify Feb 7, 2025Shopify アカデミーの学習パスB2B on Shopify:立ち上げとカスタマイズで卸売販売に進出しましょう。これら3つの無料コースは、ShopifyストアでB2B機能...
By Shopify Jan 31, 2025