How to Link Images to Product Variants in SureCart

In SureCart, you can link images to specific product variants to ensure the correct image is displayed when a customer selects a variant option (e.g., color, size) on the product page. This guide will walk you through the steps to link an image to a variant using SureCart settings and the WordPress Media Library.

Set Up Variants in SureCart

Before linking an image to a variant, ensure that your product has variants set up correctly. For more detailed instructions on creating and managing product variants, check out our Creating and Managing Variants guide.

You can do this in the SureCart product settings:

• Option Name: This is the category of the variant (e.g., Color, Size).
• Option Values: These are the specific variants under each category (e.g., White, Black, Light Green for Color).

Example:
Option Name: Color
Option Values: White, Black, Light Green

Link Media to a Variant

You can easily link images or videos to specific product variants in SureCart. This allows customers to see the correct media when they select a particular option (e.g., color, size, style).

Linking an image or video

1. In your Product Images/Media gallery, hover over the image or video you want to link to a variant.
   • Click the pencil (edit) icon to open the media details.
2. In the Edit Media panel, scroll down to the Variation section.
3. From the Option dropdown, select the exact variant option that should display this media.
   • Example: Color — Green
   • If you want the media to display for all variants, leave it set to (All Variations).
4. Click Done to save your changes.

Example:
Variant: Light Green

Working with Videos

SureCart also supports linking videos to product variants. This is useful for showing product demos, promotional clips, or tutorials.

When editing a video, you have the following options:

• Poster
  Choose a poster image that will display before the video plays.
  • You can select an image from the library or generate a thumbnail from the video.
• Aspect Ratio
  Define how the video should be displayed (e.g., 1:1, 16:9).
• Variation
  Just like with images, you can assign the video to a specific variant option.
  • Example: Size — Large
  • Or keep it as (All Variations) so the video shows for every variant.

Verify the Link

To ensure that the image is correctly linked to the variant:

1. Go back to your product page in SureCart.
2. Select the variant option on the product page (e.g., choose “Light Green” from the color options).
3. The image you linked should now appear when the variant is selected.

Frequent Asked Questions