Shopify Question posted in
The Shopify help center can be found here.

How do I deal with having different environments but same images in Shopify?

I have two different sites, a development site, and a staging site, with the same Shopify theme. I also have my theme files on git. I merge my development branch to my staging branch but I get a lot of conflicts with image paths.

For example, some CSS code will conflict
staging:background: url(//cdn.shopify.com/s/files/1/0553/6117/5731/t/44/assets/contact_bg_img.png?29198)

development:background: url(//cdn.shopify.com/s/files/1/0196/8186/9924/t/70/assets/contact_bg_img.png?36011)

The images are the same it’s just that the location changes because they’re different stores. If I merge the changes then the image location will be incorrect.
I’m not sure how to deal with this issue. Has anyone dealt with this? Any ideas?

Tags:

2

Answers


  1. 0

    You need to upload the Image in Settings -> Files at any store(Staging or Development).

    Login or Signup to reply.
  2. 0

    You need to treat these images as theme assets. You can add these images to your assets directory in theme and then use URL filters to generate the URL for the images.

    {{ 'contact_bg_img.png' | asset_img_url: '300x' }}

    If you want to use your current solution, like uploading files and then use that URL, this can also be done via URL filters.

    {{ 'contact_bg_img.png' | file_img_url: '1024x768' }}

    Doing so, you will have the same code for multiple stores and no hardcoded URLs inside code.

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search