> For the complete documentation index, see [llms.txt](https://helpv3.ladipage.vn/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://helpv3.ladipage.vn/cac-tinh-nang-mo-rong/tao-menu-ban-mobile.md).

# Tạo menu bản mobile

**Bước 1: Thêm mới icon menu.**

<figure><img src="https://4163873660-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FVlMUbaIjYt7SY2R8v2az%2Fuploads%2FjzrnaDoy0Htj2wItxyFh%2Fmenu.png?alt=media&amp;token=8d21fb5e-f2a6-491e-ad89-67b72ccd88c7" alt=""><figcaption></figcaption></figure>

Hoặc bạn vào phần Thêm mới--> Phần tử--> Biểu tượng và tìm kiếm với từ khóa Menu.

**Bước 2: Tạo popup nội dung menu.**

<figure><img src="https://4163873660-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FVlMUbaIjYt7SY2R8v2az%2Fuploads%2FxQIGND3o3n5qxQL4ufM5%2Fmenu2.png?alt=media&amp;token=27082180-5f7b-4f8c-918e-f0014bf4d102" alt=""><figcaption></figcaption></figure>

**Bước 3: Liên kết các mục menu đến section tương ứng hoặc tới trang khác.** \
**(Xem thêm hướng dẫn** [**liên kết đến section**](broken://pages/-LwRPDh8YTU6tQYORsey) **và** [**liên kết mở liên kết**](https://help.ladipage.vn/su-kien-cho-phan-tu/su-kien-nhap-chuot/su-kien-mo-lien-ket)**).**

<figure><img src="https://4163873660-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FVlMUbaIjYt7SY2R8v2az%2Fuploads%2FdMnbEKCs6ZJcIrT8qWbv%2Fpopupmenu.png?alt=media&amp;token=d578f917-2931-4698-9daf-fe8747f6156a" alt=""><figcaption></figcaption></figure>

{% hint style="warning" %}
**Lưu ý:**&#x20;

* **Bạn có thể cài đặt vị trí hiển thị của Popup như mình mong muốn.**
  {% endhint %}

<figure><img src="https://4163873660-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FVlMUbaIjYt7SY2R8v2az%2Fuploads%2F3uuv2OmRApcVg2poP6pP%2Fpopup1.png?alt=media&amp;token=56d88e34-b1ae-48b1-97e3-6c009a98f14c" alt=""><figcaption></figcaption></figure>

{% hint style="warning" %}

* **Popup nội dung menu sẽ hiển thị khi khách hàng bấm vào icon menu, vì vậy không cài đặt hiển thị cho popup này.**
  {% endhint %}

<figure><img src="https://4163873660-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FVlMUbaIjYt7SY2R8v2az%2Fuploads%2FDwUMOCeCIG3LdQbx1NQb%2Fpopup2.png?alt=media&amp;token=cfe729ce-36fa-4d9d-a484-6f2616ed4fa5" alt=""><figcaption></figcaption></figure>

**Bước 4: Liên kết icon tới popup.**

**Bạn vào phần thiết lập--> Sự kiện--> Chọn hành động nhấp chuột--> Sự kiện mở popup--> Chọn popup nội dung menu.**

<figure><img src="https://4163873660-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FVlMUbaIjYt7SY2R8v2az%2Fuploads%2Fx8ntwModMGnb6ZQNlfnS%2Fpopup3.png?alt=media&amp;token=973ab522-2436-4f00-a933-740b98471f70" alt=""><figcaption></figcaption></figure>

**Bước 5: Ghim icon ở đầu trang trong suốt quá trình khách hàng cuộn chuột. Bạn có thể chọn vị trí hiển thị của icon menu này theo vị trí ghim**

<figure><img src="https://4163873660-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FVlMUbaIjYt7SY2R8v2az%2Fuploads%2F8OpZo6TfnMpSrr6UGHqv%2Fghim%202.png?alt=media&amp;token=397e9968-73fa-48b6-ae89-519945f3b41c" alt=""><figcaption></figcaption></figure>

Nếu bạn thiết kế kiểu Responsive, bạn có thể thiết kế menu desktop và mobile khác biệt nhau bằng cách **Ẩn các nội dung menu của desktop trong thiết kế bản mobile.**

<figure><img src="https://4163873660-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FVlMUbaIjYt7SY2R8v2az%2Fuploads%2FVHFqFI1Cx3AtxPat20ox%2F%E1%BA%A9n.png?alt=media&amp;token=f073b14b-ef96-4639-b029-e05215ae2ce6" alt=""><figcaption></figcaption></figure>