This training guide has been designed to familiarize you with the Galleries feature on Avetti commerce.
Galleries can be used on the store to display additional product images to further promote your products. Galleries are a great way to showcase your product by displaying various high definition images of your product in different available colors, sizes or other properties. Galleries currently support “jpg” or “jpeg” for images and “pdf” for pdf files.
On this page, all the images and PDF files used in the store will be displayed.
- Click the Additional Product Images tab on the item page. A View source on one of the gallery image further shows us the location from which the image is loaded.
- Click one of image to view the actual high resolution image.
- There are two locations- galleries and gallery_thumbs which stores gallery files.
- Any file that you upload in to the gallery would have a scaled downed version automatically on gallery_thumbs.
- You will find these locations under Media | Manage Media | Store ID | Assets | Images. The images that you see on the gallery are the thumbnail images.
Creating Galleries #
An important product property called Sys_Gallery_Images which determines whether or not an item would have a gallery.
If a product gallery is missing:
- Go to Catalog.
- Click Items.
- Search for the particular item. You will be directed to Product Data page.
- Click the Product Properties tab.
- Select Sys_Gallery_Images Property drop down menu and set a value. The value is the number of images you want on the gallery.
Upload Gallery Images #
There are two ways of uploading images in to the gallery.
Method 1 #
- Go to Media | Manage Media | Store ID | Assets | Images | Galleries and use the Upload button at the bottom to upload an image.
- The critical point to remember is the name of the upload image. It should be in the format “item code-n” where n is the position of image in the gallery.
- Example, if you are uploading the first image for item with itemcode NVW4WMH, the image file should have the name “NVW4WMH-1”.
- The reason for this, is that the item template will pull the Sys_Gallery_Images value that was set in the previous step, and then will generate the images by looping through that many times, adding the appropriate number to the product code. This generates the images dynamically, rather than having to manually edit the template to add each image by name.
- Only “jpg” or “jpeg” formats are currently supported for images. Also keep in mind the Sys_Gallery_Images property value as this is the maximum value of n that you can specify.
Method 2 #
- Click Catalog.
- Click Manage Galleries/PDFs. The same naming rules apply here.
- Click the Upload button at the bottom.
- Select the file from your hard drive.
Edit Gallery Images #
- Go to Catalog | Manage Galleries/PDFs and use the Upload button. Use the same format “item code-n” where n is the position of the image that you want updated.
- You will see a file overwrite prompt message to which you need to confirm.
- This will upload your new image in place of the old one.
Remove Gallery Images #
- Use ‘Filter By’ search option to search for all existing gallery files.
- Click the Delete button to delete it.
Add PDF files to products #
To add PDF files or make changes to pdf files in the store, a new section called “Manage Galleries/PDFs’ has been created.
To access it to Catalog|Galleries/PDF’s.
To view the PDF files section, select the PDF option from the Category drop-down menu.
Here you can modify, search and delete the existing PDF files previously uploaded to the store. You can also add new PDFs files to the store.
Upload a new PDF file #
To upload a new PDF document:
1.Look for the Upload button at the bottom of the page.
2.Once pressed, a new window will appear allowing you to upload a PDF document to the server.
3.Click the Browse button to select your file and import it.
Note, if you don’t see the View button, turn on flash in your browser (view the Enable Flash guide at the end of this guide)
The name of the PDF file will be used on our system to find the related product and link them, so the file name must be the same as the product code. If there are multiple documents for a single product, add a dash and the number of image to the file name.
- Product Code: 70015260
- PDF 1: 70015260
- PDF 2: 70015260-1
- PDF 3: 70015260-2
Multiple files can be selected at once.
4.Wait while the files are being uploaded.
5.When the upload is complete, click Close.
6.Verify that the uploaded files are in the list of PDF files
Verify property “Sys_Pdf_Files” #
To display all the files on the store’s product page, verify that the products have the correct property value.
- To do this go to Catalog|Products
- The Manage Products page will be open. Click the title of the product you want to verify.
- The Advanced Editing page of the product will be loaded in the same window.
- Click on the Product Properties tab. The Product Properties page will open in the same window.
- Verify that the “Sys_Pdf_Files” property is in the list of properties with the correct value, which must be equal to the number of PDF files uploaded for each product.
Attach property “Sys_Pdf_Files” to the product #
If the property is not in the list, add it:
- Go to the drop-down menu under “Select Property”
- Select the “Sys_Pdf_Files” property and then add the property value that will be equal to the number of PDF documents in the product.
- Click the Add (+) button and verify that the property is in the property list.
You can also modify the value of the property by clicking the edit button () and adding the correct property number.
When the PDF files and the Sys_Pdf_Files property are set up correctly, a new section will appear on the product page in the store, usually called Documentation. Where you can access the PDF files via links.
- The PDF file will be opened in a new browser tab.
Enable Flash – Chrome #
If the View button does not appear in the window, you must turn on Flash.
1.To do this go to Chrome | Settings | Advanced settings | Privacy & security | Site settings | Flash
2.Activate Flash and restart your browser to update it.
3.On the Manage Galleries/PDF page, click on the padlock located at the top left of the browser.
4.Go to the Flash drop-down menu and select the Allow and close the secure connection window.
5.A message to reload the page will appear on the screen.
6.Press the Reload button.
7.Press the Upload button and wait a few seconds.
8.The Browse button will appear on the left side of the Cancel All button.