ブロック内でフォントのサイズや種類などを変えられるようにしたいです。

Topic summary

Dawnテーマを使用しているユーザーが、リッチテキストや画像バナーなどの個々のブロックごとにフォントサイズやフォント種類を変更できるようにする方法を質問しています。

解決方法:

  • liquidファイルの {%- for block in section.blocks -%} ~ {%- endfor -%} の間で処理を行う必要がある
  • SchemaのBlocks内でrangeタイプの設定を追加(例: font_size、min: 22、max: 38など)
  • コード内で <h2 style="font-size: {{ block.settings.font_size }}px"> のように指定

追加の質問:
別のユーザーから、PCとスマホでフォントサイズを分けて調整したい場合の方法について質問が出ています。メディアクエリを使った分岐方法についての回答待ちの状態です。

元の質問者は自分でも同様の方法に辿り着いたと報告しています。

Summarized with AI on November 3. AI used: claude-sonnet-4-5-20250929.

Kuroda96さま

個々のブロックで値を変更したいようでしたら、

liquidファイルの{%- for block in section.blocks -%} ~ {%- endfor -%}の間で処理を行う必要があります。

一案ですが、下記の手順でいかがでしょうか?

①SchemaのBlocks内で下記指定(指定内容は任意)

{

“type”: “range”,

“id”: “font_size”,

“min”: 22,

“max”: 38,

“step”: 1,

“unit”: “px” ,

“label”: “Font size”,

“default”: 22

},

②コードの{%- for block in section.blocks -%} ~ {%- endfor -%}内で上記を指定

例:

よろしくお願いします。

フルバランス 園畑