> For the complete documentation index, see [llms.txt](https://docs.shopone.io/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.shopone.io/cac-phan-tu-co-ban/tien-ich-nang-cao/ma-html.md).

# 5.4. Mã HTML

Tiện ích **Mã HTML** cho phép bạn chèn và hiển thị mã HTML tùy chỉnh trực tiếp vào trang web của bạn. Điều này rất hữu ích để thêm các yếu tố không được cung cấp sẵn trong trình chỉnh sửa, như mã nhúng, các đoạn mã HTML tùy chỉnh, hoặc các thành phần tương tác.

Việc sử dụng mã HTML mang lại khả năng tùy chỉnh cao, nhưng cũng đi kèm với mức độ phức tạp, đòi hỏi người dùng có kiến thức cơ bản về mã HTML để sử dụng hiệu quả. Nếu bạn chưa quen với mã hóa, hãy bắt đầu với các tính năng kéo thả và từng bước học hỏi để khai thác tối đa công cụ thiết kế Landing Page của mình.

## **1. Thêm Mã HTML vào landing page**

* Nhấn vào **Tiện ích** ở thanh sidebar của trình chỉnh sửa.
* Chọn **Mã HTML** trong mục **Nâng cao**
* Chọn phần tử **Mã HTML** và kéo vào trang landing page.

<figure><img src="/files/6cZhRFFT4RB8jMxapsvc" alt=""><figcaption></figcaption></figure>

## **2. Trình chỉnh sửa Mã HTML**

### 2.1. Chỉnh sửa HTML

Để mở trình chỉnh sửa **Nội dung,** bạn click vào tiện ích **Mã HTML** muốn chỉnh sửa trên màn hình ⇒ Chọn **Nội dung** trên thanh thiết lập nhanh.

<figure><img src="/files/5ReWZyc85PjtDKiTVuLc" alt=""><figcaption></figcaption></figure>

Sau đó, popup **Chỉnh sửa HTML** sẽ được hiển thị trên màn hình cho phép bạn nhập mã thiết kế theo mong muốn.

<figure><img src="/files/V2FzKs4cGAxFoQqiTlNL" alt=""><figcaption></figcaption></figure>

### 2.2. Trình chỉnh sửa thiết kế

Để mở trình chỉnh sửa **Thiết kế,** bạn click vào tiện ích **Mã HTML** muốn chỉnh sửa trên màn hình ⇒ Chọn **Thiết kế** trên thanh thiết lập nhanh.

<figure><img src="/files/C0i1hABPINFAmB0d9iaV" alt=""><figcaption></figcaption></figure>

* **Căn chỉnh:** giúp bạn căn chỉnh **Mã HTML** theo khung chứa, chi tiết [<mark style="color:blue;">**tại đây**</mark>](/cac-cong-cu-thiet-lap-co-ban-voi-landing-page/thanh-thiet-lap-nhanh/trinh-chinh-sua-thiet-ke/can-chinh.md).
* **Kích thước** trong trình chỉnh sửa thiết kế giúp bạn điều chỉnh kích thước và vị trí của các phần tử trên landing page, chi tiết [<mark style="color:blue;">**tại đây**</mark>](/cac-cong-cu-thiet-lap-co-ban-voi-landing-page/thanh-thiet-lap-nhanh/trinh-chinh-sua-thiet-ke/kich-thuoc.md).
* **Hiển thị:** cho phép bạn kiểm soát việc hiển thị **Mã HTML** trên các thiết bị khác nhau bao gồm Máy tính và Điện thoại


---

# 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.shopone.io/cac-phan-tu-co-ban/tien-ich-nang-cao/ma-html.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.