Concevoir un paywall personnalisé avec Remote Config

Important

Ce guide couvre le Remote Config pour les paywalls personnalisés. Pour le Flow & Paywall Builder, consultez Personnaliser un flow avec le Remote Config.

Le Remote Config du paywall est un outil puissant qui offre des options de configuration flexibles. Il permet d’utiliser des payloads JSON personnalisés pour adapter précisément vos paywalls personnalisés. Vous pouvez ainsi définir divers paramètres tels que les titres, les images, les polices, les couleurs, et bien plus encore.

Avant de commencer à personnaliser un paywall personnalisé (Cliquez pour développer)

Pour commencer à personnaliser un paywall personnalisé à l’aide du Remote Config :

Accédez à Flows & Paywalls dans le menu principal d’Adapty et ouvrez l’onglet Custom Paywalls.
Cliquez sur le paywall pour l’ouvrir.

Passez à l’onglet Remote config.

Le Remote Config dispose de 2 vues :

Tableau
JSON

Les vues Table et JSON contiennent les mêmes éléments de configuration. La seule différence est une question de préférence : la vue Table propose un menu contextuel, pratique pour corriger les erreurs de localisation. Vous pouvez basculer entre les deux vues en cliquant sur l’onglet Table ou JSON selon vos besoins.

Quelle que soit la vue choisie pour personnaliser votre paywall, vous pouvez ensuite accéder à ces données depuis le SDK via les propriétés remoteConfig ou remoteConfigString de AdaptyPaywall, et apporter des ajustements à votre paywall. Vous pouvez également mettre à jour les valeurs du Remote Config par programmation via l’API server-side pour modifier dynamiquement les configurations de paywall sans passer par le tableau de bord. Voici quelques exemples d’utilisation d’un Remote Config.

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

# Test titles or others texts

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

# Test images on your paywall

{
    "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 on the paywall

{
    "hard_paywall": true
}

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

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

Vous pouvez combiner différentes options et en créer de nouvelles. Vous pouvez ainsi tester différents titres, textes, images, polices, couleurs, etc.

Vue JSON du Remote Config

Dans la vue JSON du Remote Config, vous pouvez saisir toutes les données au format JSON :

Vue tableau du Remote Config

Si vous n’avez pas l’habitude de travailler avec du code et que vous devez modifier certaines valeurs du JSON, Adapty propose la vue Table pour vous faciliter la tâche.

C’est une copie de votre JSON sous forme de tableau, facile à lire et à comprendre. Le codage couleur permet d’identifier les différents types de données.

Pour ajouter une clé, cliquez sur le bouton Add row. Nous vérifions automatiquement le mappage des valeurs et des types, et affichons une alerte si vos modifications risquent de produire un JSON invalide.

Les options de ligne supplémentaires sont particulièrement utiles pour les localisations de paywall :

Il est maintenant temps de créer un placement et d’y ajouter le paywall. Ensuite, vous pouvez afficher vos paywalls personnalisés iOS, Android, React Native, Flutter, Unity, Kotlin Multiplatform, et Capacitor dans votre application mobile.