Magento Open Source, 2.0.x

Magento 2.0.18 is the final 2.0.x release. After March 2018, Magento 2.0.x will no longer receive security patches, quality fixes, or documentation updates. To maintain your site's performance, security, and PCIPayment Card Industry: Refers to debit and credit cards and their associated businesses. compliance, upgrade to the latest version of Magento.

Images and Video

Using high-quality images of consistent proportion gives your catalog a professional look with commercial appeal. If you have a large catalog with several images per product, you can easily have hundreds, if not thousands of product images to manage. Before you get started, establish a naming convention for your image files, and organize them so you can find the originals if you ever need them.

Product Images

A single product image is rendered in different sizes throughout the catalog. The size of the image container on the page is defined in the style sheet, but how the image is used is determined by the role that is assigned to the image. The main product image, or “base” image, must be large enough to produce the magnification that is needed for zoom. In addition to the main image, a smaller version of the same image might appear in product listings, or as a thumbnail in the shopping cartA grouping of products that the customer wishes to purchase at the end of their shopping session.. You can upload an image in the largest size that is needed, and let Magento render the sizes needed for each use. The same image can be used for all roles, or a different image can be assigned to each role. By default, the first image that is uploaded is assigned to all three roles.

From the Product Detail section, you can perform basic image management tasks such as upload multiple images, link to video, rearrange their order, and determine how each is used. For additional control, open the image in “detail view.” If you have a large quantity of images to manage, it can be more efficient to import them as a batch, rather than upload individual images. To learn more, see: Importing Product Images.

Image Detail
  • Image Roles

    Image Role


    Swatch Images

    A swatch image can be illustrate a color, texture, finish, or pattern. Swatch images that are specific to the product can be uploaded to the image gallery.

    Base Image

    The base image is the main image on the product detail page. Image zoom is activated if you upload an image that is larger image than the image container. Example sizes:

    470 x 470 pixels (without Zoom)
    1100 x 1100 pixels (with Zoom)

    Small Image

    The small image is used for the product images in listings on categoryA set of products that share particular characteristics or attributes. and search results pages, and to display the product images needed for sections such as for Up-sells, Cross-sells, and the New Products List. Example size:

    470 x 470 pixels


    Thumbnail images appear in the thumbnail gallery, shopping cart, and in some blocks such as Related Items. Example size:

    50 x 50 pixels