Product thumbnails are a great way to bring color and life to your online order form. Looking to add product thumbnails to your order form? Let's walk through an example on how to do it.
Step 1: Create a product
Step 2: Edit the product
In editing mode there will be a section to the right of the product called Product Thumbnail. Here is where we can upload an image to showcase what this product is.
The product thumbnail image window is 480 x 320 pixels.
Pro tip: Be sure to keep that in mind as you select the thumbnail image you wish to use for this product.
Example
For this example, let's add a thumbnail for our HDR Photography product. I have already built my product and now we need to select the photo I am going to set as the thumbnail. Open the image, right click, and select "inspect" on the image you wish to use. This will provide you with the image size details of the photo to ensure it will be a good fit for the product thumbnail image window (480 x 320 pixels).
This image size should work perfectly. Now, I'm going to go back to my product and choose this photo to set as the product thumbnail. Simply select Choose Image, locate your image and and select it, then press save.
Success! To see what the thumbnail looks like on the order form, open and view the order form and start the order process by entering an address. Any address from the dropdown will do. Input any other required fields on your form and move to Step 2: Products. Here you will see the product thumbnail we just set for our HDR Photography product above the product title and description.
