Aller au contenu

Contenu protégé (Login wall)

Utilisez nos mécanismes de connexion pour protéger le contenu de vos pages statiques et le réserver à vos clients ou aux abonnés actifs.

Dernière mise à jour
30 septembre 2024

Protéger votre contenu avec le login wall

Si vous voulez donner facilement à vos clients l’accès aux contenus achetés (par exemple une formation en ligne ou un ebook), vous pouvez utiliser notre Login Wall: une fonctionnalité qui bloque l’accès à votre page pour les personnes n’ayant pas acheté un produit donné ou n’ayant pas d’abonnement actif. La configuration prend moins de 5 minutes.

Il vous suffit d’ajouter un court code dans la section de la page contenant le contenu à protéger. Vous pouvez générer ce code depuis le panneau de modification du produit. Une option Protect y est prévue.

66fabea8a6c214d7ab67dc54 66fabb2ccbb608d3f873d6fd 66fab93845e0dd2aeea1195f Xnapper 2024 09 30 16.43.10

Choisissez si vous voulez protéger l’ensemble du produit ou une variante de prix précise. Pour protéger la page entière (tout son contenu devient alors inaccessible aux non-clients), cliquez sur Secure entire page, puis sur Copy code.

66fabb2ccbb608d3f873d706 66fab93e8372bf182ed77890 Xnapper 2024 09 30 16.43.25

Quand protéger une variante de prix et quand protéger le produit?

À vous de voir! Si vous voulez bloquer l’accès selon la possession de n’importe quelle variante (n’importe quel prix) d’un produit donné, protégez le produit entier. Si l’accès ne doit être réservé qu’aux personnes ayant acheté une variante précise, sélectionnez l’option Choose specific Price variants puis indiquez les variantes à protéger. Seules les personnes ayant acheté ce prix précis pourront alors voir le contenu.

Après avoir copié le code généré, il ne vous reste qu’à le placer dans la section correspondante de votre site. Vous pouvez aussi le faire dans des éditeurs comme Webflow, Carrd, Squarespace, Wix et d’autres.

Vous pouvez également utiliser la protection d’accès de façon créative, par exemple en vendant vos contenus sur Notion via des services comme super.so ou potion.so, qui permettent de modifier la section.

Résultat: chaque personne qui visite votre page voit ses droits d’accès vérifiés. Si elle n’en a pas, nous affichons une fenêtre de connexion (à vos couleurs, avec votre logo), qui correspond en réalité à une connexion à Easycart.

En général, les clients Easycart n’ont toutefois pas besoin de se connecter, car notre token est enregistré dans le cache de leur navigateur.

L’étape suivante consiste à vérifier si la personne a accès à un produit précis. Si ce n’est pas le cas, nous la redirigeons avec un message approprié directement vers la page d’achat. Si c’est le cas, nous la laissons accéder à votre page. Cela fonctionne bien sûr aussi pour les abonnements, où nous vérifions en plus si l’accès de la personne est toujours actif.

Comme tous les acheteurs disposent d’un compte créé sur Easycart, vous pouvez utiliser nos mécanismes back-end sécurisés pour autoriser vos utilisateurs de cette façon.

Tout se passe côté front-end, ce qui signifie que vous pouvez coller ce snippet sur la page dans n’importe quel éditeur comme Webflow, Wix, etc. pour protéger instantanément le contenu voulu. Nous reconnaissons que cette méthode n’est pas aussi robuste qu’une protection back-end classique de votre côté, mais nous avons fait en sorte qu’elle soit un peu plus difficile à contourner que les solutions front-end habituelles, et c’est à notre avis une solution vraiment satisfaisante.

Afficher ou masquer seulement certains éléments de la page pour vos clients

Vous pouvez aussi afficher ou masquer certains conteneurs ou sections de la page. C’est une solution intéressante lorsque vous avez une page de vente unique où, à la place des prix et du bouton “acheter”, vous voulez afficher un bouton “accéder au produit” pour les clients ayant déjà acheté. Pour cela:

  1. Générez le code à intégrer dans la page avec l’option Secure page sections
  2. Placez le code généré dans la section <head> de la page
  3. Pour le contenu destiné aux personnes qui n’ont pas le produit, ajoutez l’attribut data-free
  4. Pour le contenu destiné aux personnes qui ont le produit, ajoutez l’attribut data-paid

Exemple en code:

<div data-paid>Contenu du conteneur</div>

Vous pouvez aussi ajouter n’importe quelle valeur, elle n’est pas prise en compte, par exemple:

<div data-free="true">Contenu du conteneur</div>

Le fonctionnement est le suivant:

  • Si l’utilisateur n’est pas connecté → il ne voit que le contenu gratuit
  • Si l’utilisateur est connecté mais n’a pas l’accès → il ne voit que le contenu gratuit
  • Si l’utilisateur est connecté et a l’accès → il ne voit que le contenu payant
Vous n'avez pas trouvé ce que vous cherchiez? Contactez-nous