How to put 3 category images per row on home page

Posted 30 Dec 2017,  Doug DePrenger

The goal is to put three categories per row on the home page with clickable images and a link below them. There can be more or less categories per row, depending on the template being used.

To do this:

1. Under Pages > Home edit and set Show Products: to Category List (Single Column). Click Update.

This puts the categories in columns. If no List Image exists, just the name of the category shows up. If a List Image is provided, the image and text below it will be clickable to the column in question.

2. Under Administration > Catalog Setup set Max Image Width: and Max Image Height:

This depends on the template and how many images in a row you want. If left blank, the actual size of the image is used.

In one case, they are set at 195 x 195. This is because of the template being used (not responsive) and the entire website is 900px wide (the menu column is about 192px wide, the main column is about 700px)

You may have to experiment to find the correct image size so three fit per row.

3. For each category, create a List Image: the same size as Max Image Width: and Max Image Height:

Note that these are *not* thumbnails. In vcd's case, the list images should be 195 x 195. If they are bigger, they will be resized for display but that is not a good idea.

4. In version 10.4.11 (released soon), there is an option in Catalog Setup under Admin section called SuppressV: This turns on/off the verbiage and search bar, which you'll see after step 1.