> For the complete documentation index, see [llms.txt](https://tgtaps.gitbook.io/tgtaps-docs/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://tgtaps.gitbook.io/tgtaps-docs/blocks/quizes/quiz.md).

# Quiz

Quiz is a series of questions with the bonus in points in the end. A quiz can be embedded into a page (for example, after the lesson) or dialog (which is opened on button click).

\
The example of simple quiz about crypto:

<figure><img src="https://923504530-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F4Ussb0ib5NljSmRt4570%2Fuploads%2FnfiJigyexMdSvdpeZTIW%2FTelegram_Mn5DDxFKPf.gif?alt=media&amp;token=8fb7db72-90a3-4032-b999-e22a666329f6" alt="" width="302"><figcaption></figcaption></figure>

## Table of content

* [How to create your first quiz?](#how-to-create-your-first-quiz)
* [What are quizes needed for?](#what-are-quizes-needed-for)
* [Types of quizes (with examples)](#types-of-quizes)
* [How to configure dialog quiz?](#how-to-configure-dialog-quiz)
* [Quiz UI settings](#quiz-ui-settings)
* [Placeholders](#placeholders)
* [Hint of fail](#hint-on-fail)
* [Randomization](#randomization)

## How to create your first quiz?

To make quiz work:

1. Add quiz block.
2. Add at least 1 question.
3. Add at least 1 answer (and select it as “right”).

The video demonstrates the full configuration of quizes:

{% embed url="<https://www.youtube.com/watch?ab_channel=TgTaps&v=v5oj3quvzBs>" %}

## What are quizes needed for?

Example of quizes use cases:

* Add final test after each lesson when you have course.
* Add daily\weekly\monthly quizes to add extra bonuses.
* Verify users' knowledge after reading posts, videos, etc.
* Unlock access from lesson to lesson when user pass tests.

## Types of quizes (with examples)

Quizes can consist of (both are supported for "embedded on page" and "dialog" quizes):

* Text answers\
  ![](https://923504530-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F4Ussb0ib5NljSmRt4570%2Fuploads%2F3l33z4nCArPFVQ1v68n1%2Fimage.png?alt=media\&token=93e5a954-f868-4c75-9a98-674588091989)<br>
* Image answers\
  ![](https://923504530-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F4Ussb0ib5NljSmRt4570%2Fuploads%2FWeeF6xsJ9P2WXHt5Jork%2Fimage.png?alt=media\&token=5b2c7fd5-c33f-41f3-a10d-03176953db3f)<br>
* Combined variant\
  ![](https://923504530-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F4Ussb0ib5NljSmRt4570%2Fuploads%2FmzgOByr7VC4r0tSYd2K4%2Fimage.png?alt=media\&token=c4a20074-1666-4644-8765-5a71cba21e81)

Moreover, quiz can have ordered questions (from first to last) or random questions (for example, you have 20 questions and want to show 5 random of them).

## How to configure dialog quiz?

Quiz can be embedded on the page or be opened in dialog window.

Embedded into page:

<figure><img src="https://923504530-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F4Ussb0ib5NljSmRt4570%2Fuploads%2Fw1aMgYp6yBTZBglE9RfX%2Fimage.png?alt=media&amp;token=d45a4c48-5d39-4a2a-866c-8d6d0ffb6b07" alt="" width="323"><figcaption></figcaption></figure>

Full screen dialog quiz:<br>

<figure><img src="https://923504530-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F4Ussb0ib5NljSmRt4570%2Fuploads%2FTD6AljaLgKOHo8QMUWze%2Fimage.png?alt=media&amp;token=e45af152-1768-4dda-a434-489d72a967d2" alt="" width="318"><figcaption></figcaption></figure>

<figure><img src="https://923504530-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F4Ussb0ib5NljSmRt4570%2Fuploads%2FM8gyjltzlmwDJcwtmksl%2Fimage.png?alt=media&amp;token=f44fdade-e683-40e7-9564-9663f20a9980" alt="" width="316"><figcaption></figcaption></figure>

To display quiz as a dialog, select “is dialog” checkbox:

<figure><img src="https://923504530-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F4Ussb0ib5NljSmRt4570%2Fuploads%2F4awjAf7ifBTZznRNJBSD%2Fimage.png?alt=media&amp;token=ad80522e-8342-4c79-bb56-d785a4bd68a0" alt=""><figcaption></figcaption></figure>

Then, copy the quiz ID (just click on it):

<figure><img src="https://923504530-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F4Ussb0ib5NljSmRt4570%2Fuploads%2FRqAaddgWgW0nxogvvkOA%2Fimage.png?alt=media&amp;token=3587bf66-4ae5-4bec-ae50-098a03328d01" alt=""><figcaption></figcaption></figure>

And insert this ID into the button URL:

<figure><img src="https://923504530-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F4Ussb0ib5NljSmRt4570%2Fuploads%2F0V3TudCGoodHGuoZvtix%2Fimage.png?alt=media&amp;token=01e07a6f-7201-40ff-87e0-a473804e275d" alt=""><figcaption></figcaption></figure>

When a user clicks on the button, the dialog will appear.\
To open the dialog in builder, just click on the block.

## Quiz UI settings

You can configure anything of a quiz:

* Question text and image design.
* Answer card (background, border, text, dialog, etc.).
* Hint dialog and button.
* etc.

UI properties of the right side:

<figure><img src="https://923504530-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F4Ussb0ib5NljSmRt4570%2Fuploads%2FAzFkiNpSgspFsGDoLn18%2Fimage.png?alt=media&amp;token=f1e4e8a2-e99d-4400-a316-25f950be1fff" alt=""><figcaption></figcaption></figure>

## Placeholders

On the screen completion or fail, you can use placeholders. You can insert:

* Number of successfully answered questions `{{successful_answers_count}}`
* Number of failed answers count `{{failed_answers_count}}`
* Amount of bonus points `{{bonus_points}}`

Example of usage:

<figure><img src="https://923504530-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F4Ussb0ib5NljSmRt4570%2Fuploads%2FvtQQ6c8Uq65O7Oh0QMA8%2Fimage.png?alt=media&amp;token=29d59075-dc25-4442-b3f6-8bd743f6c268" alt=""><figcaption></figcaption></figure>

## Hint on fail

When a user selects an invalid answer, you can give them a hint.

It opens like a dialog window:

<figure><img src="https://923504530-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F4Ussb0ib5NljSmRt4570%2Fuploads%2FD4VuGyURPxcZ8wLot2JX%2Fimage.png?alt=media&amp;token=2fdea9d4-3d66-4ce3-9881-7948b3e049d6" alt=""><figcaption></figcaption></figure>

## Randomization

You can randomize questions. For example, you have 10 unique questions. You want to show 3 random questions for each quiz repeat. And you want to give a bonus when at least 2 answered.

To achieve this, you need to set following settings:

<figure><img src="https://923504530-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F4Ussb0ib5NljSmRt4570%2Fuploads%2FyPhjcLBGft09PgiNUjZk%2Fimage.png?alt=media&amp;token=9f5140a2-4075-4449-8ff7-6cb9edeac06d" alt=""><figcaption></figcaption></figure>

***

Something unclear in docs or you know how to improve article? [Message us in community!](https://docs.tgtaps.com/tgtaps-docs/readme/community)\
We will answer you and then promise to improve the article within 3 days.