Tùy chỉnh flow bằng Remote Config

Hướng dẫn này đề cập đến Remote Config cho Flow Builder. Đối với các paywall thông thường được tạo mà không dùng Flow Builder, xem Thiết kế paywall bằng Remote Config.

Remote Config cho phép bạn lưu trữ một JSON payload tùy chỉnh mà SDK đọc lúc runtime. Dùng tính năng này để thiết lập các giá trị như tiêu đề, hình ảnh, font chữ, màu sắc hay feature flag mà không cần phát hành phiên bản app mới.

Làm việc với Remote Config

Để mở Remote Config của một flow, nhấp vào biểu tượng phía trên phần xem trước màn hình trong trình chỉnh sửa flow.

Open remote config in the Flow Builder editor

Trong chế độ xem JSON, bạn có thể nhập bất kỳ dữ liệu nào theo định dạng JSON. Trình chỉnh sửa hiển thị một cột cho mỗi ngôn ngữ bạn đã thêm:

Nếu remote config chứa JSON không hợp lệ, bạn sẽ không thể lưu hoặc xuất bản flow. Xem Lưu & xuất bản flow để biết danh sách đầy đủ các vấn đề có thể chặn việc xem trước và xuất bản.

Bạn có thể truy cập dữ liệu này sau đó từ SDK thông qua mảng remoteConfigs trên AdaptyFlow. Adapty lưu trữ một mục AdaptyRemoteConfig cho mỗi ngôn ngữ; chọn mục khớp với ngôn ngữ của người dùng và đọc dictionary đã được phân tích cú pháp hoặc jsonString thô để điều chỉnh flow của bạn khi chạy. Dưới đây là một số ví dụ về cách bạn có thể sử dụng remote config.

{
    "screen_title": "Today only: Subscribe, and get 7 days for free!"
}

# Test titles or other texts

{
    "background_image": "https://adapty.io/media/paywalls/bg1.webp"
}

# Test images on your flow

{
    "font_family": "San Francisco",
    "font_size": 16
}

# Test fonts

{
    "subscribe_button_color": "purple"
}

# Test colors of buttons, texts etc.

{
    "photo_gallery": "https://adapty.io/media/paywalls/link-to-html-snippet.html"
}

# Any HTML code that can be displayed in the flow

{
    "hard_paywall": true
}

# By setting it to true, you disallow skipping the paywall without subscribing
# You have to handle this logic in your app

{
    "title": {
        "en": "Try for free!",
        "es": "¡Prueba gratis!",
        "ru": "Попробуй бесплатно!"
    }
}

Bạn có thể kết hợp bất kỳ mẫu nào trong số này, hoặc tự định nghĩa các key riêng để thử nghiệm các bản sao nội dung, bố cục hoặc hành vi khác nhau.

Tiếp theo, tạo một placement và thêm flow vào đó. Sau đó hiển thị flow trong ứng dụng của bạn: iOS hoặc Android.

Thêm ngôn ngữ

Để bản địa hóa flow, nhấp vào Add locale phía trên trình chỉnh sửa và chọn ngôn ngữ.

Adapty thêm một cột mới vào trình chỉnh sửa cho ngôn ngữ đó. Chỉnh sửa từng cột một cách độc lập — tại runtime, SDK trả về entry AdaptyRemoteConfig có locale khớp với lựa chọn ngôn ngữ của người dùng.

Hộp thoại thêm ngôn ngữ với các trường Code và Name

Nhập và xuất JSON

Dùng menu Import/Export phía trên editor để sao lưu, chia sẻ, hoặc chỉnh sửa hàng loạt Remote Config trên tất cả các ngôn ngữ cùng một lúc.

Export JSON: Tải về một file JSON duy nhất chứa toàn bộ các ngôn ngữ.
Import JSON: Tải lên một file JSON theo cùng định dạng. File được tải lên sẽ thay thế Remote Config hiện tại.

File sử dụng mã ngôn ngữ làm key cấp cao nhất, với payload của từng ngôn ngữ là giá trị tương ứng:

{
  "en": {
    "title": "Get Premium",
    "cta": "Continue",
    "trial_days": 7,
    "features": ["sync", "export", "ai"]
  },
  "fr": {
    "title": "Passez à Premium",
    "cta": "Continuer",
    "trial_days": 7,
    "features": ["synchronisation", "exportation", "IA"]
  }
}

Mỗi khối ngôn ngữ tuân theo cùng một cấu trúc JSON mà bạn nhập trực tiếp vào cột locale.