eTailer Lite

Step Three: Adding categories and products

This is the maintenance step, and must be repeated every time you wish to add new products/categories or update existing ones – so we’ve made it as simple as possible. We use the same makeXML button to create all site categories and to populate those categories with products. Much like setting the site up for the first time, adding products is as simple as entering text, dragging a selection over them and clicking the button.

Categories

In an E-tailer Lite site, top-level categories exist only to hold secondary level categories – they do not link directly to a list of products. For example – in the demo store ‘Visual’ contains the sub-category ‘Digital Cameras’ which is a viewable list of products, but some of the other top-level categories are blank to demonstrate what we mean. Every E-tailer Lite site must have at least one top level and one secondary level category. The ‘Products’ navigation panel on the left side of the screen can hold a maximum of 20 top level categories and an unlimited number of sub-levels (since the menu will only display the currently selected sub-options).

We add new top and secondary level categories by editing the Categories page of the Etailer.xls sheet again. The first column (column A) contains the site text (as previously edited), and the second column contains the top-level categories. Any top-level categories left blank between B6 and B31 must contain a small letter x so that the site logic will ignore their value. Columns C onwards contain the sublevel categories (called product lists). You can have as many sub-levels as you like, just remember to include x’s in all blanks (on all other rows as well – as per the example).

As usual – simply drag a rectangle over all selections and hit the magic button. Upload the new categories.xml file and preview.

Products

Adding products uses the same simple process as previously used. The first page of the spreadsheet contains all of the product lists that match the names of the sub-level categories on the second page (the names must be identical in spelling and case use). Every product has a few compulsory criteria and some optional ones (where x can be used to skip the data).

Compulsory data fields are the sku/identifying part number, the manufacturer/supplier, the product name/model, the stock level, the number of images online in the img folder for this product (see next section), the price, and the status (used for savings etc). A product can have a maximum of 5 cells of text (think of them as paragraphs) and 5 features – if you cannot locate that much information from brochures or suppliers, simply place an x to skip them.

The same formatting shortcuts for bold, italic, new lines and new paragraphs can be applied here. As mentioned, you cannot change the names of the headers (the cream rows) without causing problems in the store (as will a hash (#) character in any pasted text).

Simply enter product details, drag a rectangle over the entire product list (including the two coloured rows) and press the button to export a new xml file with the name of the first row. Upload to the categories sub-directory and press the corresponding name in your product navigation panel to view. Now – wasn’t that simple?

Product Images

Images can come from a variety of sources (desktop scans from magazines and brochures, digital cameras etc) and taking good photographs is a separate profession in itself. Fortunately, most product images can be sourced directly from suppliers – since you’re doing them a favour by selling them. Most suppliers have web sites of their own and are more than happy for you to use their images (as long as you ask first). The skills we need to develop are in resizing and preparing those images for Internet use.

Every product in your store needs two versions of the same image – a normal sized image for the product’s view page, and a small (called a thumbnail) sized version for the list pages, bookmarking menu, and base of the view page. All images must be .gif files and reside in the products sub-directory. All thumbnails must be 82 pixels wide by 54 pixels high, but the main image can be any size up to 405 pixels wide by 266 pixels high (as per the demo store). Every image is saved with a resolution of 72dpi (the same resolution as all monitors). Every product must have at least one image – although errors will not occur if absent.

The names of the images should contain three parts – the part number, the image number, and the size – so 31445_1_th.gif tells us that we’re looking at the small version (_th) of the first image (_1) of product 31445. The large version would be 31445_1_lg.gif, and any extra images would be 31445_2_th.gif, 31445_2_lg.gif etc. Naming images after product names is never a good idea when dealing with image management.

And that’s all there is to it! – You are now the proud owner of a working store that displays your chosen products and messages. We wish you all the best in your new online selling venture, and welcome your feedback.