メタフェイズではShopifyを利用したストア構築を行っています。
今回はassets内のCSSのbackground-imageの扱いを紹介いたします。

assets内のcssのbackground-imageなどでassets内の画像を読み込んでいる場合、該当箇所をLiquidへ書き換える必要があります。
assets/styles.cssというファイルがある場合assets/styles_.css.liquidへコピーします。※ファイル名は任意
次に

background-image: url("./mod_img_sprite.png");

上記を

background-image: url("{{ "mod_img_sprite.png" | asset_url }}");

へ書き換えます。

そして、Liquidテンプレート内のCSS読み込み部分を

{{ 'styles_.css' | asset_url | stylesheet_tag }}

へ書き換えます。

Shopifyを利用したストアの構築・運用のご相談はお問い合わせフォームより受け付けております。