Liquid、JavaScriptなどに関する質問
コードについて知識不足なので、教えていただけると助かります。
https://note.com/gooddoctor/n/nce84b2ef484d
こちらの情報を元にグーグルフォントを読み込んで?みました。
「theme.liquid」ファイルにGoogle Fontsのリンクを貼る
は問題なくできたのですが、
③「theme.scsss.liquid」ファイルのfont-familyを書き換え
をしたところ
Undefined variable: "$font-style-header". at 1458
というエラーが出て、レイアウトも崩れてしまいました。
元の表記に書き直したのですがエラーが治りません
該当箇所と思われる部分のコードは以下です
/*================ Typography ================*/
{% assign header_font = settings.type_header_font %}
{% assign base_font = settings.type_base_font %}
{{ header_font | font_face }}
{{ base_font | font_face }}
{%- assign base_font_bolder = base_font | font_modify: 'weight', 'bolder' -%}
{%- assign base_font_bold = base_font | font_modify: 'weight', 'bold' -%}
{%- assign base_font_italic = base_font | font_modify: 'style', 'italic' -%}
{%- assign base_font_bold_italic = base_font_bold | font_modify: 'style', 'italic' -%}
{{ base_font_bold | font_face }}
{{ base_font_bolder | font_face }}
{{ base_font_italic | font_face }}
{{ base_font_bold_italic | font_face }}
$font-stack-header: {{ header_font.family }}, {{ header_font.fallback_families }};
$font-weight-body--bolder: {{ base_font_bolder.weight | default: 700 }};
$font-stack-header: {{ header_font.family }}, {{ header_font.fallback_families }};
$font-stack-body: {{ base_font.family }}, {{ base_font.fallback_families }};
$font-weight-header: {{ header_font.weight }};
$font-stack-body: {{ base_font.family }}, {{ base_font.fallback_families }};
$font-style-body: {{ base_font.style }};
$font-weight-body: {{ base_font.weight }};
$font-size-header: {{ settings.type_header_base_size }} * 1px;
$font-size-base: {{ settings.type_base_size }}px; // Henceforth known as 1em
$font-stack-cart-notification: "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif;
$font-size-mobile-input: 16px; // min 16px to prevent zooming
原因を教えたいただけると助かります!
恐らくですが、$font-stack-bodyの行が同じ記述で二つあるため、本来は上の方は$font-style-headerの行であったのではと思います。
なお上記があっているか否かにかかわらず、初期状態のテーマの同じファイルの差分を確認し元の記述を調べれば元に戻せるはずです。
Shopifyのチェックアウトは世界一コンバージョン率が高いチェックアウトです。2023年4月に実施された世界3大手マネジメントコンサルティング会社の共同調査によると、Sho...
By Minami_ Apr 11, 2024Shopifyのルーツ Shopifyは、スノーボードをオンラインで販売したいという夢を叶えるために2004年に誕生しました。当時は大企業だけがインターネットで販売す...
By JapanGuru Apr 7, 2024リエンゲージメントの自動化で売り上げ向上へ!素敵なオンラインストアを作成し、見込み顧客の携帯へ広告を直接に送信する、またはSNSなどで宣伝すると、お客様がストアに行き着...
By Mirai Mar 24, 2024