Setting Up Images and Videos for a Product

The Image/video section controls the photos and videos shown on a product page. High-quality media helps customers see what they're buying, such as a product from several angles or a short demonstration video. 

This guide explains how to add and manage product images, write alt text for them, add videos, and troubleshoot videos that don't display.

Accessing the Image/Video Section of a Product

To open a product's images and videos:

1. In your SHOPLINE Admin, go to Products.

2. Click Create product to create a new product, or select an existing product to edit.

   

3. Locate the Image/video section and configure the settings as described in the following sections.
4. When you're finished, click Save or Update to save your changes.

Adding Images to a Product 

You can upload, organize, and edit product images to showcase your products and improve their visibility.

Image Requirements

Before uploading product images, make sure they meet the following requirements:

Uploading Product Images

You can add product images in the following ways:

• Upload images: Click the + icon, then select image files from your computer.

  

• Drag and drop files: Drag and drop image or video files from your computer into the upload area.

• Add from the File Library: Click Add from file library, select Image from the File type dropdown, choose the images you want to insert, and click Complete.

  

Managing and Editing Product Images

After uploading images, you can manage their display order, edit them, or remove them.

• Change the cover image: The first image becomes the product's cover image, which appears in product listings and collections. To change it, drag another image to the first position using the six-dot handle.
• Preview and edit images: Hover over an image and click the Expand icon to preview it at full size. You can then:

  • Update the ALT attribute to describe the image for accessibility and SEO. For tips, see "Writing Effective Alt Text for Product Images" below.

    Note: Updating an image's ALT attribute inside the editor only changes that image in the product description. It doesn't update the original file stored in the File Library.

• Add a Caption description.
• Crop the image using Free crop, Square, or 4:3.
• Flip the image Horizontal or Vertical.
• Rotate the image to the Left side or Right side.
• Download the image.

• Delete images: Select an image and click Delete to remove it.

Writing Effective Alt Text for Product Images

Alt text is a short written description of an image. Search engines can only read text, so alt text helps them understand your images and can help your products appear in image search results, such as Google Image Search. Follow these guidelines when writing alt text:

• Keep it relevant and concise: Describe what the image shows in a short phrase.
• Include the focus keyword: Where it fits naturally, include the main keyword for the product.
• Avoid keyword stuffing: Don't repeat keywords or list unrelated ones.
• Skip redundant words: Don't start with phrases such as "this image" or "picture of."

For example, Red cotton T-shirt with a sunset mountain graphic is more useful than This image of a shirt, tee, T-shirt, cheap shirt.

For more ways to improve how your products appear in search, see "Optimizing Product SEO for Search Engines".

Adding Videos to a Product

You can add videos to showcase your products and provide customers with a more detailed view of their features.

Video Requirements

Before adding product videos, make sure they meet the following requirements:

Adding Product Videos

You can add product videos in the following ways:

• Embed a YouTube video: Click Add video URL, paste the YouTube URL, and click Confirm.

  

• Add from the File Library: Click Add from file library, select Video from the File type dropdown, choose the desired video files, and click Complete.

  

Managing and Editing Product Videos

After adding a video, click the Expand icon to open the video editor. You can then:

• Update the Video cover.
• Edit the Alt text.
• Add a Caption description.
• Download the video.

Troubleshooting Video Display and Playback Issues

If a video has been successfully added but appears as a blank screen, keeps loading, or fails to play on your storefront, try the following:

• Check the YouTube video settings: If you added the video using a YouTube URL, make sure that:
  • The video is set to Public or Unlisted. Private videos cannot be embedded.
  • The video has not been deleted or removed.
  • The video owner has enabled embedding.
  • The video is not subject to copyright or regional restrictions. Some videos may not be available for embedded playback in certain countries or regions.
• Wait for the video to finish processing: After a video is uploaded, the system may need some time to process it. During this time, the video may not load properly. Wait a few moments, then refresh the page and try again.
• Rule out browser caching issues: Try a hard refresh (Ctrl + F5 on Windows or Command + Shift + R on Mac), or open your storefront in an incognito/private browsing window.
• Check your theme or custom code: Third-party themes or custom code, such as CSS or JavaScript, may affect video display or playback. Temporarily switch to a SHOPLINE official theme to check whether the issue is related to your current theme or custom code.

If the issue persists after completing these troubleshooting steps, click the chat icon in the bottom-right corner of your SHOPLINE Admin to contact SHOPLINE Support for further assistance.