Hiển thị paywall được thiết kế bằng Remote Config trong React Native SDK

Nếu bạn đã tùy chỉnh một flow bằng Remote Config, bạn cần triển khai phần render trong code ứng dụng di động để hiển thị flow đó cho người dùng. Vì Remote Config mang lại sự linh hoạt theo nhu cầu của bạn, bạn hoàn toàn chủ động trong việc quyết định những gì được đưa vào và giao diện flow của bạn trông như thế nào. Chúng tôi cung cấp một phương thức để lấy cấu hình Remote Config, giúp bạn tự do hiển thị flow tùy chỉnh đã được cấu hình qua Remote Config.

Lấy remote config của flow và hiển thị nó

Trong v4, một flow chứa một mục AdaptyRemoteConfig cho mỗi ngôn ngữ đã được cấu hình trong mảng remoteConfigs. Chọn ngôn ngữ phù hợp với tùy chọn của người dùng, sau đó đọc các giá trị cần thiết từ data của nó.

try {
  const flow = await adapty.getFlow("YOUR_PLACEMENT_ID");
  const config = flow.remoteConfigs?.find((c) => c.lang === "en")
    ?? flow.remoteConfigs?.[0];
  const headerText = config?.data?.["header_text"];
} catch (error) {
  // handle the error
}

Tại thời điểm này, sau khi đã nhận được tất cả các giá trị cần thiết, bạn cần render và kết hợp chúng thành một trang trông đẹp mắt. Hãy đảm bảo thiết kế tương thích với nhiều kích thước màn hình và hướng xoay khác nhau của điện thoại, mang lại trải nghiệm mượt mà và thân thiện với người dùng trên mọi thiết bị.

Hãy đảm bảo ghi lại sự kiện xem paywall như mô tả bên dưới, để Adapty analytics có thể thu thập thông tin cho funnel và A/B test.

Sau khi hoàn tất việc hiển thị flow, hãy tiếp tục thiết lập luồng thanh toán. Khi người dùng thực hiện mua hàng, chỉ cần gọi .makePurchase() với sản phẩm từ flow của bạn. Để biết thêm chi tiết về phương thức .makePurchase(), hãy đọc Thực hiện mua hàng.

Chúng tôi khuyến nghị tạo một paywall dự phòng. Paywall dự phòng này sẽ hiển thị cho người dùng khi không có kết nối internet hoặc không có cache, đảm bảo trải nghiệm mượt mà ngay cả trong những tình huống đó.

Theo dõi sự kiện xem paywall

Adapty giúp bạn đo lường hiệu quả của các flow. Mặc dù chúng tôi tự động thu thập dữ liệu về các giao dịch mua, việc ghi lại lượt xem flow cần có sự tham gia của bạn vì chỉ bạn mới biết khi nào khách hàng nhìn thấy một flow.

Để ghi lại sự kiện xem flow, chỉ cần gọi .logShowFlow(flow), và nó sẽ được phản ánh trong các chỉ số paywall của bạn trong funnels và A/B test.

Không cần gọi .logShowFlow(flow) nếu bạn đang hiển thị các flow hoặc paywall được render bởi Flow Builder hoặc Paywall Builder. Adapty tự động theo dõi lượt xem trong những trường hợp đó.

await adapty.logShowFlow(flow);

Tham số yêu cầu:

Tham số	Bắt buộc	Mô tả
flow	bắt buộc	Một đối tượng `AdaptyFlow` lấy được qua `adapty.getFlow(placementId)`.

Nếu bạn đã tùy chỉnh paywall bằng Remote Config, bạn cần tự triển khai phần hiển thị trong code của ứng dụng để người dùng có thể thấy nó. Vì Remote Config mang lại sự linh hoạt theo nhu cầu của bạn, bạn hoàn toàn chủ động trong việc quyết định nội dung và giao diện của paywall. Chúng tôi cung cấp một phương thức để lấy cấu hình Remote Config, giúp bạn tự do hiển thị paywall tùy chỉnh đã được thiết lập qua Remote Config.

Lấy Remote Config của paywall và hiển thị

Để lấy Remote Config của một paywall, truy cập thuộc tính remoteConfig và lấy các giá trị cần thiết.

try {
  const paywall = await adapty.getPaywall({ placementId: "YOUR_PLACEMENT_ID" });
  const headerText = paywall.remoteConfig?.data?.["header_text"];
} catch (error) {
  // handle the error
}

Tại thời điểm này, sau khi đã nhận được tất cả các giá trị cần thiết, đã đến lúc render và ghép chúng thành một trang trông đẹp mắt. Hãy đảm bảo thiết kế tương thích với nhiều kích thước màn hình và hướng xoay khác nhau, mang lại trải nghiệm mượt mà và thân thiện với người dùng trên các thiết bị khác nhau.

Hãy nhớ ghi lại sự kiện xem paywall như mô tả bên dưới, để Adapty analytics có thể thu thập thông tin cho các funnel và A/B test.

Sau khi hiển thị paywall xong, hãy tiếp tục thiết lập flow mua hàng. Khi người dùng thực hiện mua hàng, chỉ cần gọi .makePurchase() với sản phẩm từ paywall của bạn. Để biết thêm chi tiết về phương thức .makePurchase(), hãy đọc Thực hiện mua hàng.

Theo dõi sự kiện xem paywall

Adapty giúp bạn đo lường hiệu quả của các paywall. Trong khi dữ liệu về các giao dịch mua được thu thập tự động, việc ghi lại lượt xem paywall cần có sự chủ động từ phía bạn vì chỉ bạn mới biết khi nào người dùng nhìn thấy paywall.

Để ghi lại sự kiện xem paywall, hãy gọi .logShowPaywall(paywall), và sự kiện này sẽ được phản ánh trong các chỉ số paywall của bạn trong funnels và A/B test.

Bạn không cần gọi .logShowPaywall(paywall) nếu đang hiển thị các paywall được tạo trong Paywall Builder.

await adapty.logShowPaywall(paywall);

Tham số yêu cầu:

Tham số	Bắt buộc	Mô tả
paywall	bắt buộc	Một đối tượng `AdaptyPaywall`.