Media settings

To add media, navigate to Dashboard > Products, and select the specific product you wish to edit from the list. There are three product media types that can be added to the product page:

Images

3D models

Videos 

Please read this detail information about media types.


Setting Description
Desktop media width
  • Small
  • Medium
  • Large
Constrain media to screen height When this option is enabled, the media, such as images or videos, will be constrained to fit within the height of the screen.
Media fit 

“Media fit” refers to how product images or other media (such as videos) are sized and displayed within their respective containers on a web page.

Two options for Media fit:

  • Original: This setting displays the media at its original size, without any cropping or resizing. 
  • Fill: This option adjusts the media to fill the entire container, even if it requires cropping or resizing to do so.
Desktop layout

This option refers to the way in which product images are displayed in the featured product section.

There are four options available to choose:

  • Stacked: All product media are stacked one after the other. Clicking a stacked media type opens a pop-up window with a larger view of the selected media.
  • 2 columns: If a product contains multiple types of media, the extra media content is displayed in a two-column layout following the main product media.
  • Dots: All product media can be scrolled by clicking on the dots.
  • Thumbnail: When a product has multiple media types, the additional media are shown as thumbnails below the main product media. Customers can click on any thumbnail to view it.
  • Thumbnail carousel: When a product has multiple media types, the additional media are shown as thumbnails in a carousel below the main product media. Customers can click on any thumbnail to view it or use the carousel navigation arrows to see other media.

*Clicking on the main media opens a popup window displaying a larger view of the media.

Desktop thumbnail position

Use this option to set “Thumbnail” layout.

  • Bottom: All thumbnails are displayed at the bottom after the main product media.
  • Left: All thumbnails are displayed on the left of the main product media.
  • Right: All thumbnails are displayed on the right of the main product media.
Desktop media position

Choose the media position:

Left: Media left, content right.

Right: Media right, content left.

Mobile layout 
  • 2 columns 
  • Show thumbnails: When a product has multiple media types, the additional media are shown as thumbnails below the main product media.  
  • Hide thumbnails: With this setting, product media are displayed in a swipeable manner, allowing you to navigate through each image one after the other without the presence of thumbnails.
Image zoom
  • Open lightbox: When you click on an image, a lightbox will open, displaying the product media in a larger view for a more detailed visual experience.
  • Click and hover: Interact with the product images by clicking or hovering over them directly on the page, without the need to open a separate lightbox.
  • No zoom
Hide other variant’s media after selecting a variant  Select this option to hide the media for other variants after a variant has been selected.
Enable video looping If you add a video to showcase your product, “enabling video looping” will allow customers to watch the video over and over again without having to manually restart it. This can be useful in highlighting specific features or aspects of the product that the customer may have missed during the first viewing.

Visual view: some examples


Desktop layout : Thumbnail


Desktop layout: 2 columns


Image zoom: Open lightbox — pop-up on clicking on the product image

Did this answer your question? Thanks for the feedback There was a problem submitting your feedback. Please try again later.

Still need help? Contact Us Contact Us