E-Commerce Item Image Management
WebAlliance offers several methods to attach an image, or multiple images, to your items on your website, on a per-item basis.
Supported file types for item images are .jpg, .png, .webp, and .gif.
The steps outlined here describe linking images to items. Linking images to Categories will be done either through the Attribute Manager, the WebAlliance PIM, or through your ERP system.
When creating image file names, be sure to use only the following characters: 0-9 a-z A-Z and use _ or - in place of a space character. Special characters (like & : / $ # . % etc.) in the file names will cause problems and could result in image associations that don't work.
Linked images typically are uploaded to the website overnight. You will not see immediate changes to the website when changing links or placing new images in your system.
Step 1 - Link the image to the associated item
NOTE - If your website uses the PIM-Enterprise, Custom Fields are supplied there. It's not necessary to create them in the ERP system.
The simplest way to associate an image (or images) with an item is to name the image file with the associated item code. For example, Item# ABC123 would automatically associate with an image called ABC123.jpg on the website, as long as ABC123.jpg is placed in the gateway server's Raw_Images/Items folder.
The images you link to items using this method must be placed in the gateway server's Raw_Images/Items folder.
This method is effective for images that go with a single item.
To automatically associate multiple images with an item, use the example of Item# ABC123. Name the associated images ABC123.jpg, ABC123_2.jpg, ABC123_3.jpg, etc. The website will recognize the relationship and display all 3 images for Item# ABC123.
Note that not every part number will be eligible for automatic image association. If your item number contains a character such as / # * " or ! (among others), the automatic association method will not work. Websites treat those as special characters that serve specific functions.
Items that have these characters in the Item number should be associated with images using either ERP "Links" or User Defined Fields (see below for more information on both).
Using P21 Item Maintenance, you can set up image associations via the "Links" tab. This method allows you to assign a single image to multiple items, but P21 allows only a single image per item using this method.
The images you link to items using this method must be placed in the gateway server's Raw_Images/Items folder.
The "Link Path" should point to the image file in the gateway server's Raw_Images\Items folder. "Link Area" should be "Web Full", and the Status must be set to "Active".
As part of the initial setup of your website's P21 integration, several Custom Fields are created. Field1 - Field5 can be used for a variety of tasks, and one of those tasks is linking images to an item. As in the above methods, the images you link to items must be placed in the gateway server's Raw_Images/Items folder.
This method is effective in cases where you'd like to associate a single image with multiple items or associate multiple images with a single item.
NOTE: For this example, we'll designate Field1, and attach an image to item # ABC123.
To create the links:
- First, designate one of Field1 - Field5 and inform Aldrich Web Solutions of your choice. This field should be used only for image links.
- Next, in Field1 of Item# ABC123, enter the file name that you want to associate. In this method, the full path is not necessary. As long as the image file defined exists in Raw_Images/Items, the system will find it based on the file name.
- Multiple images can be assigned to an item by separating the file names with a semicolon. For example, ABC123picture.jpg;ABC123additionalPicture.jpg would result in two images available for the associated item. Note that the file names MUST be separated with a semicolon, and there MUST NOT be a space after the semicolon. "ABC123picture.jpg, ABC123additionalPicture.jpg" will NOT work.
NOTE: If you include multiple image links using the Custom field method, the first image in the field is the primary image for the item. The additional images appear on the website in the order they're listed in the field.
You can use the custom field method to attach externally-linked images to your items. Be sure to include the "http://" or "https://" prefix with the link.
For instance, https://dl.dropboxusercontent.com/a/imagelink would go into Field1 for our above example.
URLs to images must NOT include special characters such as commas, etc.
You can use the PIM-Enterprise to attach images to items. Check out Attaching Images to Items in the PIM-Enterprise book for details.
NOTE: if you use the PIM-Enterprise to attach images to items, you do not need to complete "Step 2 - Place the images..." below. The PIM-E handles the whole process for you.
Step 2 (optional) - Place the images in the Raw_Images/Items folder
When using some image-linking methods, the highest-available-quality version of the image related to an item should always be placed in the Raw_Images/Items shared folder on your gateway server. Contact Aldrich Web Solutions with any questions regarding the location or accessibility of the shared folder.
Within Raw_Images/Items, you're free to organize your folder structure however you prefer. The most important thing to keep in mind is that all images must have unique file names. In other words, there must not be both Raw_Images/Items/Folder1/ABC123.jpg *and* Raw_Images/Items/Folder2/ABC123.jpg.
Alternative Method - Use Category Image as Recurring Item Image
If an item does not have an associated image on the website, a generic "No Image Available" box will display (NOTE: this can be updated, if you prefer a different placeholder, like a logo). However, WebAlliance can be configured to show the image for the category that the item exists in.
Attribute Manager users can see our manual entry that covers attaching an image to a category.
NOTE: If any of your items exist in more than one category, this image linking method is not an option for your system.
When using the category image as a recurring item image, keep in mind that the category image is available to the item in some places on the website (search results, category listings, SKU Detail), but not in all places on the website. You could end up with image-less items in some areas of the website.
Attaching images directly to items is the best method to ensure each item always shows proper images.
When the Same Item is Linked with More than one Method
WebAlliance will display all images assigned to an item through any of the 3 methods described in this article.
If you've assigned an image to an item using each of the 3 above methods, and all 3 image files are available to the website, then all 3 images will appear online for the item.
Keeping Track of your Item to Image Linking
At some point, you may want to run a report to find out which items have assigned images. The WebAlliance system isn't intended to provide this type of report, but depending on your image linking method, you can find these image/item associations through your ERP system fairly easily.
Because the Automatic Link method does not involve the ERP system, there isn't really anything to report on. It's less work than the other methods to set up initially, but much more difficult to report on later.
The other two available methods, Item Maintenance - Links tab and Custom Fields, do leave a data trail in the ERP system. Because of that, it's easy to generate a report that can tell you which items have image links.
We have added a new tool called the Item Image Display Configurator that allows WebAlliance to search for an image for items that don't have a specified image.