Adding images to your products is as simple as drag and drop.

Log in to your Shoprocket dashboard and click on the "Products" tab:

Then click on the edit icon for the product you want to add images to.

Once in your edit product view, click on the "Images" tab. Now you can drag and drop your product images into the image panel: (You can also click the upload panel to open a web dialogue box and select files from your computer, Google Drive, Box, Facebook etc.)

Once you have uploaded your file, you can dictate which of them is the "hero" image, this will be the main image we use inside your "sr-block" when listing products in your page. The other images will be available within your single product pages. 

I've uploaded my images, how do I show them on my site?

You can learn more about rendering images into your page here.

Default Image Placeholder

If you do not add an image to a product, but have the [IMAGESRC] tag in your sr-block, we will display a default image holder like this:

You can also set your own default image by adding this line of code to your page template, ideally in the footer, along with your Shoprocket sr.js code snippet:

<input type="hidden" id="sr-defaultimage" value="URL to your image">

Be sure to add the URL to your image in the "value" attribute. When the above code is present on your page, we will use the image defined as the placeholder for any products which do not have an image. 

This will apply to images in "sr-block", "sr-related" and also single product pages.
Was this article helpful?
Thank you!