Quản lý đầu trang

Quản lý đầu trang thường dùng cho: Header, Main menu

Bước 1: Trong trang quản trị, chọn “Thiết lập” → “Giao diện

Bước 2: Ở trang “Bố cục” → chọn “Thêm bố cục

Bước 3: Điền “Tên bố cục” → chọn “OK” để lưu thông tin

Bước 4: Chọn “Chi tiết

Bước 5: Để thêm bố cục cho Header, chọn “Thêm”. Sau đó, chọn Component muốn thêm.

Lưu ý: Các component dùng cho Header gồm:

  • Header top

  • HeaderStyle1

  • Header Style 2 Component

  • Main menu

Bước 6: Sau khi chọn component, điền thông tin vào các mục trong component.

Dưới đây là VD về một số component:

  1. Header top

Ở “Header top” có thể điền các thông tin sau:

  • Mục 1 - Class modifier: Tùy chỉnh giao diện

  • Mục 2 - Kiểu: Chọn style theo các lựa chọn có sẵn cho header top

  • Mục 3 - Thông tin:

    • Loại: Chọn loại thông tin điền vào. VD: nếu thông tin là số điện thoại → chọn “Điện thoại”, nếu thông tin là các nội dung văn bản → chọn “Văn bản”

    • Biểu tượng: Biểu tượng cho thông tin. Các biểu tượng định dạng SVG

    • Nội dung: Điền nội dung hiển thị của thông tin

    • Đường dẫn: Điền đường dẫn cho thông tin. VD: Thông tin là số điện thoại “0962.180.180”  → đường dẫn là  “tel:0962180180”

  1. Header Style 2 Component:

Ở “Header Style 2 Component” điền các thông tin sau:

  • Mục 1 - Class modifier: Tùy chỉnh giao diện

  • Mục 2 - Layout: Chọn cách bố trí giao diện

  • Mục 3 - Hình ảnh hiện trên máy tính: Chọn ảnh cho phần header trên máy tính (Thường là ảnh logo)

  • Mục 4 - Hình ảnh hiện trên điện thoại: Chọn ảnh cho phần header trên điện thoại (Thường là ảnh logo)

  • Mục 5 - Kiểu: Chọn style theo các lựa chọn có sẵn

  • Mục 6 - Thông tin

    • Loại: Chọn loại thông tin điền vào. VD: nếu thông tin là số điện thoại → chọn “Điện thoại”, nếu thông tin là các nội dung văn bản → chọn “Văn bản”

    • Biểu tượng: Biểu tượng cho thông tin. Các biểu tượng định dạng SVG

    • Tiêu đề: Điền tiêu đề của thông tin muốn hiển thị

    • Nội dung: Điền nội dung hiển thị của thông tin

Header sau khi thêm component “Header top” và “Header Style 2 Component