FROM CACHE - jp_header

オリジナルCSSの読みこませ方について

解決済
mayu
遊覧客
32 2 2

お世話様です。

オリジナルCSSの読み込ませ方が変更になっているようなので、質問させてください。

テーマはDebutを使用しています。

theme.liquidにあった以下のコードの下に、コードをコピーしてオリジナルCSS(add-style.css)を読み込ませましたが、合っていますでしょうか?

一応、内容は反映されているようです。

<link rel="stylesheet" href="{{ 'theme.css' | asset_url }}" type="text/css" media="print" onload="this.media='all';onLoadStylesheet()">

<link rel="stylesheet" href="{{ 'add-style.css' | asset_url }}" type="text/css" media="print" onload="this.media='all';onLoadStylesheet()">

どうぞ宜しくお願い致します。

1 件の受理された解決策

ベストソリューション
福水正太
Shopify Expert
20 3 8

成功

はじめまして。

簡単な返答で恐縮ですが、その記述で問題ございません。

 

ちなみに、

media="print" onload="this.media='all';onLoadStylesheet()"

この表記は、CSSの非同期読み込みに関してのコードでして、極論、あってもなくてもCSSファイルは読み込めます。

 

debutテーマのバージョンアップによるCSS読み込み記述の変更に関しては、

この記事が詳しく解説しているので、参考にしてみてください。

https://webutubutu.com/webdesign/8896

代表取締役

元の投稿で解決策を見る

4件の返信4
株式会社フルバランス
Shopify Partner
338 100 314

URLなどは良いと思いますが、onloadの記載は何か意図があってやってらっしゃいますか?

株式会社フルバランス(Shopify Experts)
東京・高田馬場 18期目のWebデザイン・システム制作会社です。Shopify / Shopify Plusの制作・運営をサポートしております。
https://fbl.jp/
mayu
遊覧客
32 2 2

返信ありがとうございます!

1行目のコードが元々入っているものになります。

自分で変更したのは、2行目のファイル名(add-style.css)だけです。

福水正太
Shopify Expert
20 3 8

成功

はじめまして。

簡単な返答で恐縮ですが、その記述で問題ございません。

 

ちなみに、

media="print" onload="this.media='all';onLoadStylesheet()"

この表記は、CSSの非同期読み込みに関してのコードでして、極論、あってもなくてもCSSファイルは読み込めます。

 

debutテーマのバージョンアップによるCSS読み込み記述の変更に関しては、

この記事が詳しく解説しているので、参考にしてみてください。

https://webutubutu.com/webdesign/8896

代表取締役
mayu
遊覧客
32 2 2

はじめまして。

返答ありがとうございます。

この記述で大丈夫とのことで、安心いたしました。

参照記事も教えていただきまして感謝申し上げます。