Skip to main content

​
4.2.3. Categories

Dữ liệu
  • Thêm dữ liệu mới:
1

Thêm dữ liệu mới cho danh mục

Người dùng nhấn vào nút “Thêm dữ liệu mới”.
Nút thêm dữ liệu danh mục trong giao diện quản lý

Nút thêm dữ liệu

2

Nhập thông tin và chọn ảnh danh mục

  • Người dùng nhập tên danh mục
  • Nhấn “Tải ảnh lên hoặc chọn ảnh từ thư viện”
  • Nếu đây là danh mục chứa các trang, chọn đường dẫn đến trang đích (người dùng sẽ được điều hướng đến trang tương ứng khi nhấn vào ảnh này)
  • Nếu đây là danh mục chứa các danh mục sản phẩm, chọn đường dẫn đến danh mục sản phẩm mà người dùng sẽ được điều hướng đến khi nhấn vào ảnh.
Giao diện thêm dữ liệu và chọn ảnh danh mục

Thêm dữ liệu cho danh mục

3

Hoàn tất hoặc hủy thao tác thêm dữ liệu

Người dùng nhấn “Thêm dữ liệu” để tiến hành thêm ảnh cho danh mục,
hoặc nhấn “Hủy bỏ” để hủy quá trình thêm dữ liệu.
  • Chỉnh sửa:
1

Mở trang chỉnh sửa danh mục

Người dùng nhấn vào nútđể đến trang chỉnh sửa danh mục.
Nút chỉnh sửa danh mục trong giao diện quản lý

Nút chỉnh sửa

2

Chỉnh sửa thông tin danh mục

Người dùng thực hiện các thao tác sau:
  • Nhập tên danh mục
  • Nhấn “Tải ảnh lên hoặc chọn ảnh từ thư viện” để thay đổi hình ảnh
  • Nếu đây là danh mục chứa các trang, chọn đường dẫn đến trang đích (người dùng sẽ được điều hướng đến trang tương ứng khi nhấn vào ảnh này)
  • Nếu đây là danh mục chứa các danh mục sản phẩm, chọn đường dẫn đến danh mục sản phẩm (người dùng sẽ được điều hướng đến danh mục sản phẩm tương ứng khi nhấn vào ảnh này)
Giao diện chỉnh sửa danh mục và chọn ảnh

Trang chỉnh sửa dữ liệu

3

Lưu hoặc hủy chỉnh sửa

Người dùng nhấn “Lưu chỉnh sửa” để tiến hành cập nhật ảnh cho thẻ trong danh mục,
hoặc nhấn “Hủy bỏ” để hủy quá trình chỉnh sửa dữ liệu.
  • Xóa:
1

Xóa thẻ trong danh mục

Người dùng nhấn vào nút để xóa dữ liệu trong danh mục.
Nút xóa thẻ trong danh mục

Nút xóa

2

Xác nhận xóa dữ liệu

Khi hộp thông báo xuất hiện, người dùng nhấn “Xóa ngay” để tiến hành xóa thẻ khỏi danh mục,
hoặc nhấn “Hủy” để dừng quá trình xóa dữ liệu.
Tổng quan
  • Hiển thị tiêu đề:
    • Người dùng nhấn nút để chuyển đổi qua lại giữa 2 trạng thái có tiêu đề và không có tiêu đề, ngoài ra người dùng có thể nhập tiêu đề cho phần tử danh mục. Ví dụ, nếu tiêu đề là “Đây là danh mục” thì phần tử danh mục sẽ như thế này
Screenshot of a deployment confirmation message that says All checks have passed.

Tiêu đề danh mục

  • Kích thước/ Màu sắc:
    • Người dùng có thể điều chỉnh kích thước và màu sắc cho tiêu đề của danh mục tại
Screenshot of a deployment confirmation message that says All checks have passed.

  • Chế độ xếp hàng:
    • Người dùng nhấn nút để chuyển đổi qua lại giữa 2 trạng thái có xếp hàng và không có xếp hàng. Nếu bật, người dùng sẽ nhập số cột, số cột sẽ phân bố các thành phần bên trong danh mục thành từng cột.
  • Số phần tử:
    • Người dùng có thể giới hạn số phần tử có thể có trong danh mục, các phần tử xếp sau sẽ bị loại bỏ nếu vượt quá số lượng phần tử
  • Chi tiết phần tử
    • Lề ngoài
      • Người dùng điều chỉnh chung khoảng cách giữa lề trên và dưới giữa các thẻ với các thẻ khác bằng nút
Screenshot of a deployment confirmation message that says All checks have passed.

  • Người dùng điều chỉnh khoảng cách giữa lề trái và phải giữa các thẻ với các thẻ khác bằng nút
Screenshot of a deployment confirmation message that says All checks have passed.

  • Người dùng có thể điều chỉnh riêng lề trên và lề dưới bằng cách nhấn vào nút
Screenshot of a deployment confirmation message that says All checks have passed.

  • Lề trong
    • Người dùng điều chỉnh chung khoảng cách giữa lề trên và dưới giữa lề các thẻ bằng nút
Screenshot of a deployment confirmation message that says All checks have passed.

  • Người dùng điều chỉnh khoảng cách giữa lề trái và phải giữa lề các thẻ bằng nút
Screenshot of a deployment confirmation message that says All checks have passed.

  • Người dùng có thể điều chỉnh riêng lề trên và lề dưới bằng cách nhấn vào nút
Screenshot of a deployment confirmation message that says All checks have passed.

  • Nền
    • Chọn màu nền cho các thẻ bằng cách nhấn ô vuông sau đó chọn màu
Screenshot of a deployment confirmation message that says All checks have passed.

  • Chuyển đổi qua lại giữa 2 trạng thái có màu nền và không có màu nền bằng cách nhấn nút
  • Xóa màu nền bằng cách nhấn nút
  • Bo góc
    • Người dùng có thể nhập hoặc tăng/giảm chung độ bo góc của 4 góc của các thẻ tại ô nhập
Screenshot of a deployment confirmation message that says All checks have passed.

hoặc điềù chỉnh riêng lẻ độ bo góc của từng góc bằng cách nhấn nút
Screenshot of a deployment confirmation message that says All checks have passed.

  • Viền
    • Người dùng có thể nhập hoặc tăng/giảm chung độ lớn viền của các thẻ tại ô nhập
Screenshot of a deployment confirmation message that says All checks have passed.

  • Chọn màu cho viền bằng cách nhấn ô vuông sau đó chọn màu
Screenshot of a deployment confirmation message that says All checks have passed.

  • Chuyển đổi qua lại giữa 2 trạng thái có viền và không viền bằng cách nhấn nút
  • Xóa viền bằng cách nhấn nút
  • Đổ bóng
    • Người dùng có thể chọn độ lớn đổ bóng của các thẻ tại ô
Screenshot of a deployment confirmation message that says All checks have passed.

  • Chọn màu cho đổ bóng bằng cách nhấn ô vuông sau đó chọn màu
Screenshot of a deployment confirmation message that says All checks have passed.

  • Chuyển đổi qua lại giữa 2 trạng thái có đổ bóng và không đổ bóng bằng cách nhấn nút
  • Xóa đồ bóng bằng cách nhấn nút
  • Hiển thị tên danh mục
    • Người dùng nhấn nút để chuyển đổi qua lại giữa 2 trạng thái có tên của các thẻ trong danh mục và không có tên của các thẻ trong danh mục. Nếu bật, người dùng sẽ nhập kích thước tên, màu của tên. Ví dụ, nếu chọn kích thước là 12 và màu đen thì danh mục sẽ như thế này:
Screenshot of a deployment confirmation message that says All checks have passed.

Danh mục

  • Hình ảnh danh mục
    • Kích thước:
      • Người dùng có thể nhập hoặc tăng/giảm chung kích thước của các hình ảnh trong từng thẻ tại
Screenshot of a deployment confirmation message that says All checks have passed.

  • Bo góc
    • Người dùng có thể nhập hoặc tăng/giảm chung độ bo góc của 4 góc của các ảnh tại ô nhập
Screenshot of a deployment confirmation message that says All checks have passed.

hoặc điều chỉnh riêng lẻ độ bo góc của từng góc bằng cách nhấn nút
Screenshot of a deployment confirmation message that says All checks have passed.

  • Viền
    • Người dùng có thể nhập hoặc tăng/giảm chung độ lớn viền của các ảnh tại ô nhập
Screenshot of a deployment confirmation message that says All checks have passed.

  • Chọn màu cho viền bằng cách nhấn ô vuông sau đó chọn màu
Screenshot of a deployment confirmation message that says All checks have passed.

  • Chuyển đổi qua lại giữa 2 trạng thái có viền và không viền bằng cách nhấn nút
  • Xóa viền bằng cách nhấn nút
  • Đổ bóng
    • Người dùng có thể chọn độ lớn đổ bóng của các ảnh tại ô
Screenshot of a deployment confirmation message that says All checks have passed.

  • Chọn màu cho đổ bóng bằng cách nhấn ô vuông sau đó chọn màu
Screenshot of a deployment confirmation message that says All checks have passed.

  • Chuyển đổi qua lại giữa 2 trạng thái có đổ bóng và không đổ bóng bằng cách nhấn nút
  • Xóa đồ bóng bằng cách nhấn nút