Use the Drop Image Feature for Product Options
In your product options, you can set the option type as a "Drop Image" type. This feature is useful when you want to show a graphical representation of what the product option will look like. For instance, you may have a fabric or product that comes in different colors, and you may want to display an image of the color swatch when customers choose that particular option. This article will teach you how to use the product's "Drop Image" feature.
Upload Your Images
The first step is to upload the images for the product options to your store's Image Manager:
Log into your Shift4Shop Online Store Manager.
Using the left navigation, go to Products.
On the next page, look towards the top of the page and click on the Actions drop-down arrow.
Select Image Manager.
Your store's Image Manager is a special interface that will allow you to upload images to your site without the need for FTP. With it, you can create folders for your product images, rename them, as well as delete images as needed.
5. Once in the Image Manager, look towards the top right of the page and click Upload Files.
The Image Manager window will open up, and you will be able to drag and drop images from your computer directly into the image manager. Use this to upload your product's drop images.
Assign your product options
The next step is to assign options to your product.
Using the left navigation, go to Products and search for the product that you'd like to edit.
Click on the product ID for the item or select the Action > Edit button at the far right of the listing.
Next, click on the Options Tab for the product.
We'll now add a product option that will use Drop Image for its display.
4. Click on the +Add New button located at the top right of the page.
5. Type in your Option Name, (e.g. Color).
6. Choose your option display type as "Drop Image."
7. Click Add to create the option.
Now that the option is added, we'll need to create the specific option sets it will offer.
8. Towards the top right of the Option listing, look for and click on +Add. "[option]" will be the name of the option you just created.
9. Add your Option Sets. (e.g. Red, Blue, Yellow, etc) as needed.
10. Click on Select link in the "Opt." field and (using the file manager) navigate to your desired image.
11. Click on the image, then click Select to assign it.
12. Repeat this process for as many options as you have for the product.
Result: Your product's listing page will now show a selectable option drop-down that will contain a small image that updates when the respective options are selected.
Use Dropdown Image Option as Cart Thumbnail
Normally, the image shown to the shopper on the view cart page is the product's main image. However, you can also have the store display the selected drop-down image in the view cart by following the next steps below.
While still in the Shift4Shop Online Store Manager:
Use the left navigation menu and go to Settings > General > Store Settings.
Then, click on the Checkout tab found at the top.
Within the "View Cart" section, place a mark in the Use Dropdown Image option as cart thumbnail checkbox.
Click Save at the top right of the page
The product's image in the view cart will now display as the selected Drop Image.