Shopify Themes, Images and Sliders – When They Don’t Get Along


Shopify offers users all the latest tools to create an attractive online experience that drives sales and encourages customers to return. For example, you can feature sliders on your landing page that let your customers know about special sales or upcoming promotions. Sliders are a great way to present visual information that is easy for customers to understand and retain.

The nice thing about sliders is that they are relatively easy to use most of the time. But every now and again a Shopify user will choose a theme that does not play well in the slider department. For example, you may have created this beautiful image that looks great on your computer screen but, when uploaded to Shopify, does not fit properly into your slider. In such cases, the problem is not necessarily the Shopify platform. It rests with your chosen theme.

The nature of sliders is such that theme developers sometimes force predetermined sizes for images. If your theme utilizes such restrictions, you should get a message before uploading your slider image. That message will tell you the size restrictions you are expected to adhere to. If your image is too small, there is nothing that can be done. It simply will not look right in the slider. If the image is too big, you may or may not still be able to use it.

As a general rule, if an image is just slightly longer than the designated size, you can still get away with using it. But if it’s too big, it is not going to work. The lesson here is to find out what the restrictions are within your theme and then create your slider images accordingly.

Software to Manipulate Your Graphics

There are some excellent graphics manipulation programs out there that you can use to either create new graphics for your sliders or re-size the ones you already have. One example is a package known as Gimp. This software is free and open source, and it runs on Mac, PC, and Linux computers.

When creating new images, we recommend the following:

  1. Create your image in any size and save a copy in either encapsulated postscript (EPS), RAW, or vector format. All of these formats allow for resizing without harming image quality.
  2. After creating your original image, re-size it to whatever the restrictions of your theme are, saving a new copy as either a JPG or PNG image. Both of these formats handle compression rather well for web-related purposes.
  3. Always keep your original image as a base for any future changes. Any modifications should be made on this copy and then exported as a new copy.

For existing images, you will have to re-size them in whatever format they are currently in. Bear in mind that increasing the size will reduce resolution and clarity. Also bear in mind that you might have to crop your original images in order to achieve the right proportions.

Leave a Reply

Your email address will not be published. Required fields are marked *