Dawn商品情報の商品説明フォントサイズ変更方法

AI-generated summary

テーマDawnの商品説明テキストのフォントサイズをデバイス別に変更する方法が主題。投稿者はmain-product.liquidで商品タイトルは変更成功したが、商品説明は変更できず、管理画面の商品説明欄へのコード追記も反映されなかった。

最新のポイントは、CSSのセレクター指定の誤りの指摘。CSSクラス名を指定する場合は先頭にドット(.)が必要で、product__descriptionではなく.product__descriptionと記述する。これにより、メディアクエリ(例: min-width: 750px)を使ったデバイス別のフォントサイズ指定が有効になる。

成果・決定事項: セレクターをドット付きのクラス指定に修正することで、商品説明のフォントサイズ調整に成功。技術用語補足: CSSクラスセレクターは「.クラス名」で要素を対象にする記法。

現状: 問題は解決済み。未解決の大きな論点や追加アクションは特になし。

はじめまして。

完全に初心者のため、コード編集に関する知識はまったくないため、

Dawn商品情報の商品説明箇所のフォントサイズをデバイス別に変更する方法を教えてください。

商品タイトルについては、main-product.liquidの27〜32行目に追記したコードでフォントサイズを変更できたので、

同様に以下のコードをその後に追記したのですが、商品説明のフォントサイズの変更はできませんでした。

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)} }

以下の方法も確認済みですが、商品管理から商品説明箇所に以下のようにコードを追記しても反映させれませんでした。

https://community.shopify.com/topic/1533261

どのファイルのどの箇所にどのコードを入れれば、商品説明のフォントをデバイス別に変更できるのか、ご教示頂けると幸いです。

よろしくお願いします。

セレクターの指定の仕方に少しだけ不足があるだけですので、

下記のようにされれば、指定のフォントサイズにできるかと思います。


CSSクラス名をセレクターとして指定する際は、

product__description

ではなく

.product__description

のようにします。

ご参考まで。

(キュー田辺)

フォントサイズ調整できました。

ありがとうございます。大変助かりました。