"Shelf-Facing" Display
Format Tab + Settings... (Advanced Design Module Only)
The capabilities described in this section are only available if you own the CBC Advanced Design Module.)
If you own the Advanced Design Module for CBC, you can use the "Shelf Facing" Display option. The shelf display option is particularly useful for beverage and packaged goods research. Here is an example of a shelf facing display:
To achieve this look, the user supplies graphics in which each product is situated on a shelf "segment," such as:
When the graphics are placed side-by-side (with no space between them) and CBC by default automatically places a border (usually black for most browsers) underneath the graphic, the resulting display looks like a continuous shelf.
Note: when using the "shelf display" option, you will probably not want the brands to "shuffle" around randomly from task to task, but will want them always located in the same position. Make sure to select Sort Using the Natural Order option on the Design tab, and specify to sort by the natural order of the Brand attribute using the Settings... button.
Shelf Facing Settings
To create a shelf display look, you must tell CBC how many total rows (shelves) are to be used, and how many product concepts to display per row. For example, if you have 45 total products to display, you might choose to display them on 5 rows (shelves). The number of products shown per row might be something like:
Row # Number of Concepts on Row
1 7
2 8
3 10
4 9
5 11
Note that the widths of the shelves are entirely controlled by the width of the graphics used in the product concepts, together with the number of graphics you have chosen to display per row. CBC doesn't re-size your graphics--they are always displayed in their natural size.
Shelf Facing Format Settings
CBC controls the way the HTML tables are specified for shelf facing display. (We have provided CSS "hooks" within the HTML for shelf facing display.)
There are a number of settings that control how the "shelf display" functions work. The following picture illustrates the area each setting affects:
For Top Attribute Background Color, we suggest you pick the same color as is used in the background of your graphics (Note: this color will only show on the screen if the graphics you develop have different heights, or if you chose a transparent background color in your graphics). It is usually a good idea to pick the same background color as used for the Task Background Color, which is selected on the Format tab.
Separation between Shelves adds a blank line between the shelves.
None Option Position in Shelf Facing Tasks
In typical CBC task displays, the "None" option is always shown as the last concept in each task. You can also use that option with shelf facing. However, shelf facing display permits more flexibility. You can move the "none" text and the radio button associated with the text into the CBC tasks' header or footer. This is not the "global" HTML header, but is the regular text header or footer that you edit under Write Questionnaire | Edit.
To place the "None" concept in the header or footer of the task, type the function [%CBCNone( )%] in either the header or footer question text boxes of the CBC choice task, accessed through Write Questionnaire | Edit. You may want to supply some HTML to format this "None" concept exactly as you want it.