Managing Your Product's Images

Scrolling down past the variants, you'll see the section for managing the product's images. On the left there's a button to Choose images if you want to upload more images for this product. To the right of that are the images that are already uploaded.

The product images will be displayed on the product page in your store in the same order as they appear in your admin.


You'll notice that the first one is marked as featured. Remember from before, the main image for a product, the one that will be displayed by default in your store, is called the featured image. The other images will be displayed as thumbnail images, or smaller images, underneath the featured image. You can reorder the images, as they will be displayed in your store, by dragging and dropping them individually to where you want them.


Whichever image you put first in the order will become the featured image.

You will notice that each image has three small icons underneath. From left to right, these icons enable you to: edit the image, set the alternative text for this image and delete the image. Let's look first quickly at the alternative text and deleting the image as editing the image provides a lot of different features.


  • Set the alternative text: The alternative or ALT text is displayed when the image cannot be displayed for some reason. It is also used to describe the image for people who are visually impaired or blind. To set the alternative text, simply click on ALT, write the alternative text in the pop-up that appears and click the Done button to save. It's generally a good idea to repeat any text that is in the actual product image in the alternative text.
  • Delete the image: The last icon on the right, underneath each of the product images is the trash icon . Clicking on this will delete the image from Shopify. A pop-up will appear asking you to confirm that you wish to delete the image. There is no way to get it back afterwards so make sure you have copies on your own computer!
  • Edit the image: Clicking on the first icon will open up a great little tool called Aviary which you can use to edit the image. For full control of your image, you might prefer to use software like Photoshop or Pixelmator. But for most simple manipulations, you can rely on this tool. You'll notice the buttons Crop, Resize, Orientation, etc. Let's examine each of these features one by one.


  • Zoom: Click on the small magnifying glass at the top left of the image board to reveal a slider to control the magnification of the image. If you look at the screenshot on the last page, you will see I'm using the zoom tool.
  • Crop: With the crop tool, you can select the area you want to keep in your image. Everything outside that area or frame will be deleted. This is a useful way to: change the shape (or aspect ratio) of the image, remove unwanted details or focus the image more specifically. You can use this tool to make your image square, for example.
  • Resize: With the resize tool, you can change the size of the image. By default, if you change the width, the height will change proportionally, or vice-versa. The use of this tool isn't really required as Shopify will manage the sizes of the images displayed in your store.
  • Orientation: With the orientation tool, you can rotate your image if necessary. You can also mirror, or what is often called flip horizontally or vertically your image. Try it out, you can always click cancel to undo your changes.
  • Redeye reduction: If there are people in your photo that have red eyes due to the camera flash then you can use the redeye reduction tool to remove the red. Click on the redeye tool then choose the tip size for the tool that you want using the selection of circles at the top. Precisely apply the tool by clicking the mouse in the middle of the red eye area.
  • Blemish: With this tool, you can remove blemishes not only from skin but from any surface. Choose an appropriate tip size for the tool and apply to small areas with blemishes. It can be useful to zoom in on the image using the zoom tool, the little magnifying glass, at the top left of the image. Sometimes a first application will reduce the blemish and a second application remove it completely.
  • Saturation: The saturation tool gives you control of the intensity or vividness of color in your image. Clicking on the tool will activate a slider to control the saturation. Sliding to the left will reduce the saturation and fade the image's colors so that the colors look washed out. Sliding to the right will increase the saturation so that the colors are more vivid. Sliding too much in either direction is often too much. However subtle adjustments in saturation can make the image more attractive.


  • Brightness: With the brightness tool, you can control the brightness of the image. Similarly to the saturation, you use a slider to control the brightness.
  • Contrast: With the contrast tool, you can control the difference between light and dark tones in your image. The lower the contrast, the more flat or dull the image will appear. The higher the contrast, the more "pop" or vibrancy to the image.
  • Draw: With the draw tool, you can choose a tip size and color, and use this to draw on the image. There is also an eraser tool if you want to erase a part of your drawing.
  • Text: With the text tool, you can add some text in the color of your choice. Select a color, type your text and click on the add text button. You can move the text by dragging the text box with the mouse. Or you can adjust the size and orientation of the text by dragging on the round handle at the bottom of the text box. Remove the text by clicking the x at the top right of the text box.
  • Whiten: The whiten tool can be used to whiten teeth. Choose a tip size and apply to areas that you would like to whiten.
  • Effects: If you're an Instagram user then you will already be familiar with the many filters that can be applied to photos. With this tool you can apply different filters that change the style of your image. You zcan have your image in black and white, in sepia, in soft focus and many other styles.
  • Undo and redo: At the bottom left of the image editor window, there are buttons to undo and redo the changes that you have made.

If you are happy with the changes you have made, then click the Save button to make those changes permanent. If you want to leave the editor without saving the changes, click on the x at the top right of the image editor window.