Smart Container – Xây dựng bố cục website không giới hạn

Smart Container(Ô chứa) là một trong những thành phần cốt lõi của Tapato Platform, cho phép người thiết kế xây dựng những giao diện phức tạp một cách trực quan mà không cần viết mã.

Module Ô chứa
    ├── Module Ô chứa
    │      ├── Module Ô chứa
    │      │      ├── Tin ngắn
    │      │      └── Gallery
    │      └── Slide
    └── CTA

Không chỉ là nơi chứa các Module, Smart Container còn là một bộ máy bố cục (Layout Engine) giúp tổ chức, sắp xếp và hiển thị nội dung theo nhiều cách khác nhau.

Tự do xây dựng bố cục

Mỗi Smart Container có thể chứa không giới hạn Module và Container con.

Người dùng dễ dàng kéo thả để tạo các bố cục nhiều cấp, phù hợp với mọi loại website từ doanh nghiệp, thương mại điện tử, Landing Page đến cổng thông tin.

Chia cột Responsive trên từng thiết bị

Tapato cho phép thiết lập bố cục riêng cho từng thiết bị:

• Desktop
• Tablet
• Mobile

Mỗi Module bên trong Container có thể được cấu hình số cột theo chuẩn Bootstrap, giúp giao diện tự động thích ứng với mọi kích thước màn hình.

Chuyển đổi bố cục chỉ với một thao tác

Không cần tạo lại nội dung, Tapato cho phép chuyển đổi cách hiển thị của cùng một nhóm Module thành nhiều phong cách khác nhau:

• Dạng lưới (Grid)
• Tabs
• Accordion

Toàn bộ nội dung và cấu hình được giữ nguyên, chỉ thay đổi cách trình bày.

Lồng Container không giới hạn

Smart Container có thể chứa các Container khác, tạo nên cấu trúc nhiều cấp mà vẫn dễ quản lý.

Điều này giúp xây dựng các giao diện phức tạp nhưng vẫn trực quan trong quá trình thiết kế.

Lợi ích nổi bật

• Kéo thả trực quan, không cần lập trình.
• Lồng Container và Module không giới hạn.
• Chia cột Responsive riêng cho Desktop, Tablet và Mobile.
• Chuyển đổi giữa Grid, Tabs và Accordion chỉ với một thao tác.
• Tái sử dụng linh hoạt trong nhiều Template và Landing Page.
• Tạo giao diện hiện đại với mã nguồn sạch, dễ bảo trì và mở rộng.

Smart Container giúp người thiết kế tập trung vào ý tưởng và trải nghiệm người dùng, trong khi Tapato tự động xử lý bố cục và khả năng tương thích trên mọi thiết bị.

Hướng dẫ sử dụng module ô chứa >>