Fixing broken responsive images on Shopify

So, you just setup your theme. You add an “image with text” section or any other section that is supposed to show an image, but when you take a look on mobile the edges are being cut off.

If you are going through this right now worry not, I’ll teach you a way to permanently fix this issue.

Downloading the section file

Download the files clicking here.

The installation process

  1. In your Shopify admin, go to Online Store > Themes Actions Edit Code.
  2. Under sections click on “Add a new section”.
  3. Write the following: ezfy-responsive-banner.
  4. Click on the button create section.
  5. Inside this new file, delete everything in it.
  6. Copy the code that you have downloaded, either the free or pro version, paste it in and save.

Adding it to your website via the customize panel

  1. Click on customize theme at the top of the page.
  2. Find the option add section. You may need to scroll down if you have a lot of sections.
  3. Look for custom by EZFY. You’ll now see your section there. Click on it to add it to your theme.
  4. Now just customize it as per your wish and click on save once you’re done!

If you need any further assistance we are here for you! Reach out to ezfycode@gmail.com and we’ll be happy to help.

Shop

You may also like

Here are some other blog posts you may be interested in.

Background with geometric patterns.Background with geometric patterns.Background with geometric patterns.Background with geometric patterns.Background with geometric patterns.Background with geometric patterns.

Do you need something different?

If the tutorial above is not what you're looking for, please let us know what you need. We'll get back to you within 24 hours.

Request a free quote

Contact Us

Let us know what type of customizations you're looking for.

Send us an e-mail and we'll get back to you within 24 hours! Before you click on "send message" please make sure to do the ReCaptcha so your e-mail can be sent safely.

Loading...