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の行であったのではと思います。
なお上記があっているか否かにかかわらず、初期状態のテーマの同じファイルの差分を確認し元の記述を調べれば元に戻せるはずです。
有料広告は、必ずしもリターンがあるとは限らず、コストがかかってしまいます。ネットショップを開設したばかりのころは、「予算をかけずにお客様が集まってくれる方法を実行したい」と考える方...
Byお客様との効果的なコミュニケーションを実現する[顧客管理]の新機能「お客様セグメンテーション」をご紹介!
ByShopify Marketsとは?ご利用可能な機能とご利用プランによる機能の違いShopify Marketsの管理画面 マーケットのタイプ各種設定マーケットを追加す...
By Daiki