Articles on: Getting Started

How to Use the Result Page - Basics

Introduction



The Result Page in Quizell allows you to showcase recommended products based on the settings you’ve configured. By customizing this page, you can create a tailored and visually appealing experience for your customers. Follow this guide to set up and configure your quiz’s Result Page.

Step-by-step Setup Guide



Step 1: Access Your Quiz’s Result/Thank You Page Editor



In the Quizell dashboard, navigate to the Quizzes section.

Locate the quiz you want to edit and click to open it.



Select the Result/Thank You Page and click to open its editor.



Step 2: Configure Your Result Page



1. Choose the Result Type


A. In the Result/Thank You Page Editor, select Result.



B. Click the Products Box to edit the display of recommended products.



C. Choose an answer type:

· Single: Displays one product.

· Multiple: Displays several products.

· Hierarchy: Highlights one main product while showing additional options.

· Group Products: Organizes products into predefined groups.

· Flip Cards: Displays products as cards that flip on hover.



2. Configure Product Elements


Adjust what is shown for each product:

· Hide Description: Toggle to show/hide product descriptions.

· Limit Description: Toggle to show/hide shorter or full descriptions.

· Use Bullet Description: Toggle to display bullet points in the description.

· Product Rank: Toggle to show/hide rank labels above products, with editable fields.

· Price: Toggle to show/hide product prices.

· Show Product Variants: Toggle to show/hide product variants.



3. Adjust Display Settings

Control how products are displayed:

· Products per row: Choose the number of products displayed per row (1 to 4).

· Rows: Set how many rows of products to display.



4. Set image settings


Adjust the appearance of product images:

· Rows: Choose the image size in product cards: 1:1, 2:3, or 3:2.

· Scale: Select how images are displayed: Fit or Fill.



5. Customize Card Styles


Style your product cards:

· Border Color: Select the border color.

· Background Color: Choose the background color.

· Stroke: Adjust the border’s weight and radius.

· Padding: Add spacing within the product cards.



6. Edit Text Styles


Customize the appearance of text on the product cards:

· Product Title: Set the font style, size, and weight.

· Text Alignment: Align the text to the left, center, right, or justify it.

· Text Color: Select the color and opacity of the text.

· Price Color: Adjust the color and opacity of the price text.



7. Configure Button Styles


Personalize the buttons displayed on product cards:

· Text: Set the button’s text (e.g., “Shop Now”).

· Font Style: Choose the font style and size for the button text.

· Text Color: Set the color and opacity of the button text.

· Background Color: Select the background color and opacity.

· Stroke: Adjust the button’s border size and radius.




🎉 That’s it! You’ve successfully configured your quiz’s Result Page. With these customization options, you can create a visually engaging and highly functional results experience tailored to your audience.

Updated on: 18/12/2024

Was this article helpful?

Share your feedback

Cancel

Thank you!