> For the complete documentation index, see [llms.txt](https://docs.datasuite.vn/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.datasuite.vn/cac-tinh-nang/cac-thanh-phan-khac/them-nut-bam-add-button.md).

# Thêm nút bấm (Add button)

{% stepper %}
{% step %}

#### Thêm nút bấm

Tại thanh công cụ phía trên, nhấn vào biểu tượng ![](/files/6kZ2Bz2fqYWSvHbxTEBi) để thêm một **nút bấm** vào Report Page.&#x20;
{% endstep %}

{% step %}

#### Điều chỉnh kích thước và vị trí

Sau khi nút bấm được thêm vào Report Page, người dùng có thể:

* **Kéo/thả** để điều chỉnh vị trí trên trang.
* **Kéo góc dưới bên phải** để thay đổi kích thước của nút bấm.
  {% endstep %}

{% step %}

#### Chỉnh sửa và định dạng nút bấm

Tại thanh bên phải, trong tab **Visualizations → Style**, người  dùng có thể cấu hình các thuộc tính sau:

* **Border**: Bật/tắt đường viền của khung chứa nút bấm.
* **Label**: Nội dung văn bản hiển thị trong nút bấm.
* **Tooltip**: Văn bản gợi ý sẽ hiển thị khi người dùng di chuột lên nút.
* **Action:** Quy định hành động xảy ra khi người dùng nhấn vào nút. Hai loại Action đang hỗ trợ:
  * **Web URL**: Mở đường dẫn liên kết khi người dùng nhấn nút, với 2 chế độ:
    * **Its tab**: Mở liên kết trong tab hiện tại.
    * **New tab**: Mở liên kết trong tab mới.
  * **Bookmark**: Mở bookmark của báo cáo đã được thiết lập trước đó
* **Format**: Thiết lập định dạng giao diện của nút.

<figure><img src="/files/sZ6q2Y9hhYIxPsxWSWyP" alt=""><figcaption></figcaption></figure>
{% endstep %}
{% endstepper %}

#### Chi tiết định dạng nút bấm

Người dùng có thể thiết lập định dạng riêng cho từng trạng thái của nút:

* **Default**: Trạng thái mặc định khi trang được tải.
* **Hover**: Khi người dùng di chuyển chuột lên nút.
* **Press**:  Khi người dùng nhấn giữ nút.

Với mỗi trạng thái, người dùng có thể tùy chỉnh các thuộc tính sau:

* **Width**: Chiều rộng nút (đơn vị px). Mặc định: `80px`.
* **Height**: Chiều cao nút (đơn vị px). Mặc định: `36px`.
* **Font**: Font chữ sử dụng. Mặc định: `Inter`.
* **Font Size**: Kích thước chữ (đơn vị px). Mặc định: `14px`.
* **Font Style**: Kiểu chữ: `Normal` (thường) hoặc `Italic` (nghiêng).
* **Font Weight**: Độ đậm nét: `Normal` hoặc `Bold`.
* **Font Color**: Màu chữ. Mặc định: Trắng `#FFFFFF`.
* **Background**: Màu nền nút. Mặc định: Xanh `#154DBD`.
* **Boder Width**: Độ dày viền (px). Mặc định: `0px`.
* **Border Radius**: Độ bo góc viền (px). Mặc định: `6px`.
* **Border Style**: Kiểu đường viền: `solid` (liền), `dashed` (nét đứt), `dotted` (nét chấm).
* **Border Color**: Màu viền. Mặc định: Xanh `#154DBD`.

**Ví dụ:** người dùng có thể định dạng một nút bấm theo các thông tin minh họa bên dưới để tạo ra \
nút như hình  ![](/files/kdPBJ2kueuyDq1EENda3)

<figure><img src="/files/0YZIREzqbOA76TrQP0lr" alt=""><figcaption></figcaption></figure>


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## 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, and the optional `goal` query parameter:

```
GET https://docs.datasuite.vn/cac-tinh-nang/cac-thanh-phan-khac/them-nut-bam-add-button.md?ask=<question>&goal=<endgoal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal.

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.
