# Widget constructor

<figure><img src="/files/89t3CtCJQpMCaXEodEHK" alt=""><figcaption></figcaption></figure>

This page allows you to create, edit and customize widgets to display donations on your stream. Everything is made as simple and convenient as possible.

***

#### Sections of the page:

1. **Widget settings**

* **Background Color:** \
  Select the background color for your widget. Click on the colored square to open the palette and select the desired shade.
* **Embed Link:** \
  A unique link that you can use to integrate your widget into streaming software (such as OBS). To copy the link, click on it.

2. **Widget List**

* **Name:** \
  The name of the widget that you specify when you create it.
* **Min amount, USD:** \
  The minimum amount of donation with which the widget will be displayed.
* **Status:** \
  A slider to enable or disable the widget.
* **Updated:** \
  Shows the date and time when the widget was last updated.
* **Created:** \
  Displays the date and time the widget was created.
* **Actions:**
  * **Edit (pencil icon):** Allows you to change the widget's settings.
  * **Delete (trash can icon):** deletes the widget. Attention: you cannot restore a deleted widget!
  * **Preview (eye icon):** shows how the widget looks on the embed page.

3. **Managing the list of widgets**

* **Add Widget button:** Creates a new widget. Click the button, fill in the form and save the settings.
* **Number of elements per page:** Select how many widgets to display on one page (e.g. 10 or 20).
* **Page Navigation:** Use the arrows at the bottom of the table to navigate between widget pages.

***

#### How to create a new widget&#x20;

1. Click the “Add Widget” button.
2. In the form, fill in:
   * Name of the widget (optional).
   * Minimum donation amount (optional).
   * Appearance settings.
3. Save the settings - the widget will appear in the list.

***

#### How to embed a widget&#x20;

1. Copy the link from the Embed Link field.
2. Paste the link into your streaming program (e.g. OBS) as a Browser Source.
3. Adjust the size and location of the widget in your program.


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://faq.tonation.me/en/for-streamers/widget-constructor.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.