The Online Shop Designer Blog » images

Viart Shop Quick Start Guide

tosd — Wed, 15 Apr 2009 07:53:05 +0000

Viart Shop is a fully featured shopping cart application that can, in addition to all the usual features, accommodate multiple customer groups. This makes it particularly useful for online shops that must cater for both retail and wholesale customers. In this quick start guide I will cover just those things that site owners usually have to attend to when they have elected to add their own content. This will include:

Creating Categories / Sub categories
Creating Products including prices, descriptions and images

Creating Categories and Sub-categories

From the top menu select [Products] / [Products & Categories]

The top level categories will be listed in the ‘Available Categories’ box.

Click the ‘Add Category’ link at the bottom of the ‘Available Categories’ box.
Fill in the required information and note the following:
- The order allows you to set the display order of the Categories
- Category names are best kept as short as possible
- Leave the ‘Parent category’ set to [top] if you are adding a top level category. This is the level that shows by default
- If you are creating a sub-category, set the parent to the category that the sub-category will nest under by selecting from the drop down list
- Assign Category images and descriptions if required. These will show up as icons to aid selection.
- Meta data allows you to set up your website so that search engines can readily index your content. This is quite important. Typically at this level the page title and description should both contain the most important keywords relating to the category. Keep the title to just a few words and the description to 10-20 words. The keywords field should also contain the main keywords relevant to the category. Separate them with commas and whatever you do don’t indulge in keyword repetition or you may (will?) be penalised.

Creating Products

In Viart Shop there is a high level of control afforded to administrators when creating products and their attributes. In this Quick Start guide I will only cover the basics of creating a new standard product:

Navigate to the category that you want to add a product to using Available Categories box on the [products] / [Products and Categories] screen. Clicking on a category will expose any subcategories. When you get to the lowest category level the products in that category will be displayed in the adjacent box titled “Products in (selected) category:”.

At the bottom of the product list click ‘Add New’, then complete as follows:
- at this point you should also note that if you want to go back and edit a product, there is an [edit] link next to each listed product.

General Product Information [access via top tab]

Complete, as a minimum, those fields that are marked with an asterisk. Note that the product order allows you to control the order in which the customer will view the products in the list view.
Don’t feel compelled to complete all fields. In many cases the minimum required field information will be sufficient.

Pricing

The first item relates to tax. This will normally be set up by TOSD. The ‘Change settings here’ link however allows you to control how prices are entered (inc or ex tax) and how they are displayed (inc or ex tax). After clicking on the ‘Change settings here’ link, select the ‘Tax Settings’ tab.
The required field ‘Price (List price)’, will be visible by default. In other words, this is the price that non-registered visitors will see. It is also the price that will be presented to customers belonging to the retail customer group.
The ‘Trade Price’ is the price that registered wholesale customers will see after they log in.
Note that there are also fields to enter discounts (one for each customer group). These allow you to set up special prices for either or both groups. Ensure that the ‘Activate Discounts’ box is checked if you wish to enable discounts. There is also a price preview box to allow you to see how the discount will be presented to the customer.

Fees and Commissions

These are costs that can be added to particular products but are beyond the scope of this Quick Start Guide.

Descriptions [access via top tab]

There are three types of descriptions that are used for different purposes:

The ‘Short description’ is presented to the customer when they are browsing the products in a gategory.
‘Highlights’ appear next to the product image and pricing details when the customer clicks through to a detailed product page. Bulleted lists work well here.
‘Full description’, as the name suggests, is a more detailed description of the product. It is displayed under the large product image and highlights on the detailed product page. For some items specifications or applications can be entered here.
‘Meta data’ – see comments for categories above. The same principles apply except that this time the keywords should relate quite specifically to the product.

Quantity prices [access via top tab]

This is where quantity discounts are set up (e.g. 1-9: $10.00 , 10-20: $9.00 etc). Quantity discounts can be particularly relevant to online shops that cater to wholesale customers. In fact the options allow the administrator to apply quantity discounts to members of the wholesale customer group, but not the retail customer group. This flexibility can be quite handy.

Images and Appearance [access via top tab]

Images: assigning images is easy in Viart Shop. In general, all the administrator has to do it prepare a single image (usually) 600px X 600px, 96dpi in jpg or png format and upload it via the ‘Upload Image’ link next to the Super-sized image box. Viart will then create all the associated image sizes on the fly.
Appearance:The ‘Hide add to cart’ function is useful in situations where you may like to oblige a customer to click through to the detailed product page before they can commit to an order. You may for example want to do this to ensure that the customer has viewed detailed and important information that is required to make an appropriate selection.

Stock and Shipping [access via top tab]

The stock control section is fairly straight forward. If you have weight based freight calculations then the weight of the product can be entered here. You can also instruct Viart to either monitor stock levels (by clicking the checkbox) or not. If you elect to use stock control you must enter real stock numbers for each product. Minimum and maximum order quantities can also be ordered.
The shipping controls in this section override the default site shipping conditions. This is very useful. For example you may want to assign free freight to a product as a special promotion, even though the rest of the site has shipping costs assigned. Another example may be where a product simply falls outside the default calculations, perhaps because it requires special packing. In these situations you can assign a one off shipping cost at the product level.

Downloadable [access via top tab]

This section will be covered by a dedicated article.

Special Offer [access via top tab]

The special offer facility allows you to assign a product to the special offer module (which is often configured to display on the home page). In addition it provides an editor for entering and formatting the special offer. e.g. ‘Buy two get one free if you order before 31st’. The editors formatting controls enable you to set up the offer to stand out. Images etc can also be included.

See also:

If you have found this article useful you are welcome to leave a comment. If you have any queries relating to Viart Shop please Contact us

Prestashop image preparation and upload

tosd — Tue, 17 Mar 2009 04:32:18 +0000

Images for Prestashop eCommerce websites created by TOSD require one image to be prepared for each item that is (usually) 600px X 600px – 96dpi, and in JPEG or PNG format. Always check with TOSD before proceeding with your image preparation to confirm that these specifications apply to your website’s template.

The image size of 600px X 600px is used by Prestashop in the popup viewer that is triggered by the customer either clicking on the normal product image (displayed on the product details page) or the ‘View full size’ link under it. All other versions of the image that are displayed in various places around the site are generated by Prestashop automatically.

Image preparation tips:

Always prepare the image such that its finished size is square, and exactly 600px X 600px / 96dpi. If the original image is rectangular, prepare a square blank image (usually all white) that is 600px X 600px then copy (and centre) the rectangular image onto the square blank one.

Note – as a fall back, if your images are not large enough to prepare in the preferred 600px X 600px size, then adopt 300px X 300px as your standard.

In most cases images look best on a white background. For the best presentation ensure that all backgrounds are white – not various shades of grey.
If you do not currently have any image preparation software I recommend Paint.NET (http://www.paint.net/). Under the paint.net heading, click the ‘getpaint.net’ link to download. Installation is straight forward. Information and tutorials are available here: http://www.getpaint.net/doc/latest/en/index.html
Don’t worry too much about the ‘megapixel’ count of your digital camera. Almost any modern digital camera is capable of producing quite acceptable images for display on the web.
If I were to give one single tip on photographing products for display on your website, it would be to ensure that there is adequate lighting and no distracting backgrounds.

Image upload

When you have finished entering the core product information (under the [Info] tab) select the [Images] tab.
Click the [Browse] button to locate the prepared image on your PC.
Enter a short, relevant description in the Caption field.
Leave Thumbnail Resize Method set to the default: ‘Automatic’
Click the [Save Image] button to upload. Prestashop will create all required thumbnails on the fly.

An finally the golden rule of Online Shops:

Images attract – Features describe – Benefits sell

Yes, you need them all !

Images add interest – words add profit

tosd — Sat, 04 Oct 2008 06:39:35 +0000

What a desolate landscape a website would be without images. The importance of images, and in fact all the graphical elements that make up a theme, should not be overlooked. They add visual interest, set the overall mood, and in the case of online shops, are a vital part of the overall information required to convey a message to a market.

But for all that they are still just images. Of themselves they do not attract potential customers to a website, they add little to a customer’s understanding of what is being offered, and they do not constitute a call to action. No. .

Just consider for a moment what words add to the marketing equation of a website:

They are primarily responsible for attracting potential customers to a website via search engine traffic.
They engage the visitor’s interest by clearly explaining the purpose of the website in a way that will encourage them to take a closer look.
They detail products and services, and most importantly the customer benefits that flow them.
They are the main element in that all important “call-to-action” – the thing that causes the transition from visitor to prospect or even customer.

But here’s the thing: words may rule, but what words?

As a website designer I put all my efforts into creating websites that are functionally sound and visually pleasing. How disappointing it is then when I see clients add poorly written content. The result in business terms is quite predictable: poorly written content results in lost sales. It is just that simple.

Fortunately help is at hand from Word Nerds a company in whom I have great confidence.

If visitors are not choosing to become customers, perhaps you are just not asking them correctly: it’s all in the words!

Image is Everything

tosd — Sat, 30 Aug 2008 01:17:11 +0000

Yes, as far as your Online Shop is concerned, your images really are everything.

In fact your images are often the single most important factor affecting your potential customer’s decision to buy. Aside from the images you present, all your customer has is a basic description and price . . . so they had better be good!

And by “good”, I don’t just mean high quality. That should be a given. Rather, I mean that they should be carefully selected and presented to tell a story.

Typically I suggest you consider having the following images incorporated:

a thumbnail for convenient item viewing and selection at the category level. This should be a small replica of your standard image.
a standard image that shows a full view of the product.
an enlargement that either shows a larger version of the standard image, a larger version shot from a different angle, or a close-up of a particular feature.
an “in use” image. This could be a woman modeling a handbag, or a frypan cooking a delicious meal.

Note that the first three essentially allow the customer to see the features, while the last one shows the benefits: in these examples how stylish you could look swinging the handbag, or what wonderful meals you could cook with the frypan.

The bottom line?

Features describe – benefits sell!

For a good example of how this can be done well have a look at an Online Shop I completed for Eurolux Australia The quality of the images I was supplied with were excellent, but more importantly the range of images told the whole story – features and benefits. Just look at the shots of the meals cooking in the frypans. You can almost smell them!