Design Tab

Introduction

The "Design" tab is where you can adjust the look and feel of your Product Finder to fully match your brand’s identity. Here you can set colors, change fonts, add pictures, edit attributes (viewed at the results view) and many more customization actions links to which can be found in the article.

1. Get to the Design Settings

To get to the design tab, open editor of the Product Finder, and click the "Design" header at the top.

2. Design Page Layout

Once you've clicked the Design header, you will see the Design settings page. It will be similar to the example below:

The page consists of the two main part:

• (1) A preview page of your Product Finder: You can see how your Product Finder looks currently and how it changes are applied to the Product Finder

• (2) Question Bank and design-related settings

3. Design Settings

Once you've clicked the "Design" link in the page header, the tab on the right will be opened at the appearance settings (in the example). If you click in the "Appearance" header, it will be minimized and will look like this:

As you can see, the Design settings menu contains three sections: 

3.1 Question Bank

Question bank: Click the header to switch between the question shown in the preview page. You can also  Manage questions: add and modify questions: define if they are mandatory, illustrate them with images and hints, etc; delete a question or remove questions. Manage answers: add answers, define their types and modify them according to their type: where possible illustrate them with images and descriptions, add default answers, specify which products should be displayed each of the answers.

3.2 Appearance

Click "Appearance" to access the basic design settings of the Product Finder itself. From here you can: Change the theme Enable or disable images Change the colors used in the Product Finder Show or hide answers for which there is no matching product Enable or disable move to the next question without the "Next" button Enable dynamic URL change Change the font type and size Edit general texts on the page Define if any recommendations should be shown before the visitors have given their first answer Define the layout of the recommendations-related pages  Emphasize top products Enable a special display of the product's rating information Add pricing details Add or remove product buttons: enable the visitor to see the details of the product and add products to cart directly from the recommendations page Configure the appearance of the recommendations-related pages Change the template with a custom CSS

3.3 Product Attributes