Thiết lập Component

Giới thiệu

Trong ZMA Experience, một component là đơn vị phần mềm đóng gói sẵn bao gồm giao diện, logic xử lý và các hook sự kiện, cho phép các nhà phát triển nhúng trực tiếp vào ứng dụng thông qua component key mà không phải xây dựng từ đầu.

Mỗi component không chỉ cung cấp sẵn layout, style và tương tác người dùng cơ bản, mà còn xử lý tự động các nghiệp vụ như gọi API, nhận đầu vào và phát ra các sự kiện để dễ dàng can thiệp hoặc mở rộng. Các component đều được thiết kế theo nguyên tắc tái sử dụng cao, giúp giảm thời gian phát triển và đảm bảo tính nhất quán về trải nghiệm trên nhiều dự án.

Các bước thực hiện

Bước 1: Khởi tạo component

Tạo custom component

Người vận hành thực hiện các bước sau để tạo một component theo một tempate có sẵn trong ZMA Experience:

• Truy cập Module ACT Console

• Chọn tab ZMA Experience

• Chọn

• Để chọn template, người vận hành có thể điền các thông tin trong bảng sau để tìm kiếm template.

• Người vận hành có thể xem trước template bằng cách nhấn vào nút

• Sau khi xem trước và lựa chọn template phù hợp với chiến dịch, người vận hành nhấn Select để bắt đầu sử dụng. (Người vận hành có thể chọn template ngay tại màn hình review bằng nút Select Template)

Điền thông tin component

• Sau khi đã tạo thành công, người vận hành điền các thông tin cần thiết cho component.

• Nhấn Save Changes để hoàn thành.

Bước 2: Custom Component

Khi template đã được khởi tạo, người vận hành sẽ tiến hành tùy chỉnh giao diện của component dựa trên yêu cầu của từng brand bằng cách nhấn vào

Sau đây là cách cầu hình theo từng component:

Bước 3: Tích hợp component

Hiện tại, Pango đang hỗ trợ hai hình thức tích hợp component:

• Tích hợp với Pango ZMA

• Tích hợp với Partner ZMA

Tích hợp với Pango ZMA

Sau khi đã hoàn tất tạo và cấu hình cho component, người vận hành tích hợp component vào ZMA theo hướng dẫn chi tiết:

1

Lấy component key

• Truy cập Module Console Act

• Truy cập đến ZMA Experience

• Nhấn để tiến hành tạo component key (hoặc tạo lại component key bằng cách nhấn )

• Sau khi đã tạo xong, người vận hành nhấn để lấy component key

2

Tích hợp vào ZMA

• Truy cập Module Console.

• Truy cập đến ZMA cần tích hợp component.

• Chọn Setting

• Chọn tab Services.

• Truy cập đến PZE Service.

• Bật toggle "Enabled" để tiến hành điền đoạn code init.

• Điền đoạn code theo format bên dưới có chứa Key component và nhấn để hoàn tất tích hợp.

Format đoạn code để init PZE vào MiniApp

Copy

[
  {
    "pzeKey": "insert_key_here",
    "pzeType": "pzeWheel",
    "pzeEnv": "production",
    "block": "page",
    "pzeVersion": "latest"
  }
]

Tích hợp với Partner ZMA