Webflow sort une nouvelle fonctionnalité : les espaces membres !

WEBFLOW MEMBERSHIP BETA : ITSSSSSSSSSS TIMEEEEEEEEE !

Il est maintenant possible de créer un espace membre, sans aucun outil supplémentaire (👋 memberstack) sur vos site web Webflow. Cela fait maintenant presque deux semaines que j'utilise la version BETA de l'espace membre de Webflow.

Voici un résumé de mes premières impressions, ce que j'ai aimé et ce qu'il faut savoir !

• Date de sortie officielle,
• Cas d'usages pour l'espace membre,
• Comment créer son espace membre sur Webflow ?

1. Webflow espace membre : date de sortie officielle

C'était une fonctionnalité attendue depuis plusieurs années par les utilisateurs de Webflow et la date officielle de sortie est ....

Toujours inconnue héhé - mais la bêta est ouverte !

Faire une demande d'accès à la bêta via ce formulaire

Si vous êtes sélectionné, vous verrez ensuite cette nouvelle fonctionnalité s'intégrer à l'interface designer de votre projet Webflow.

2. Pourquoi créer un espace membre sur son site ?

2.1 Car c'est un puissant levier d'acquisition !

Il y a plein de bonnes raisons d'utiliser ce levier d'acquisition. En voici quelques-unes ;

• Monétiser des contenus tels que des formations/cours
• Créer un espace privé pour certains de vos clients
• Créer un lead magnet, en bloquant certaines ressources preniums, en échange de données
• Fédérer une communauté en ligne autour d'une interface unique

Ces exemples ne sont que la petite partie des possibilités. Je suis convaincu que, nombreux no-code makers, avec un peu d'imagination, créerons d'autres leviers sur leur site internet avec cette nouvelle possibilité.

2.2 Mais attentions aux limites SEO 😨

Puisqu'une partie de votre contenu est bloquée, il est probable que le contenu restreint ait été traité indépendamment dans le référencement par Google. Mais nous allons faire nos propres tests pour en savoir plus, puis nous ferons un article entier sur le sujet avec toutes nos expériences !

3. Comment le créer sur un site Webflow ? (sans memberstack)

Webflow vous permet de créer un espace réservé facilement, même sans être un expert de l'outil ! Suivez le guide, cliquez sur quelques boutons.

Tutoriel simple et complet

(1) Activer l'espace membre de votre projet

⚠️ Attention, il est important de savoir que, comme la features e-commerce de Webflow, c'est un acte irréversible. Vous ne pourrez plus le désactiver. Mais, si tel est votre choix... go !

→ Rendez-vous dans votre projet Webflow. Sur la barre de contrôle vertical (à gauche) dans votre designer, cliquez sur l'icône "Users".

Une fenêtre de notification s'ouvre pour vous rappeler que cette création est définitive. Cliquez sur ok, votre nouvel espace avec adhésion est créé. Facile.

(2) Définir des Access Group

Cette fonctionnalité vous permet de contrôler quel type d'utilisateurs aura accès à quel contenu. Il s'agit de la base pour commencer à structurer votre espace membre.

"Group type" : l'accès sera-t-il gratuit ou payant ?

Par défaut, l'accès sera gratuit car, pour ajouter une passerelle de paiement permettant de créer des accès payants sur votre site web, il faut d'abord activer l'extension e-commerce sur son compte webflow.

Accès "Grant Accès" : Comment les utilisateurs vont ils accéder à votre contenu ?

Pour donner accès à votre contenu privé, webflow vous propose deux options :

1. Automatiquement : lorsqu'un utilisateur s'est inscrit avec succès via votre page "log-in" et a confirmé son adresse électronique. Vous lui permettez maintenant de se connecter automatiquement à son compte via cette même adresse.
2. Manuellement : vous permet d'inviter manuellement des personnes à accéder à certains de vos contenus (exemple, après une demande de pré-inscription, sélectionner puis donner accès à quelques demandeurs à une bêta)

L'un des plus grands avantages de l'utilisation des mises à jour automatiques est de pouvoir libérer du temps pour vous et votre équipe afin de travailler sur d'autres choses, mais dans certains cas la solution d'ajout manuel vous permet de sélectionner.

Restricted content : quel(s) contenu(s) bloqué(s) sur votre site?

D'un simple clic, vous pouvez sélectionner précisément les pages statiques, dynamiques (CMS) ou même le dossier des pages sur lesquelles vous souhaitez appliquer une restriction d'accès.

Une fois l'ensemble de ces champs remplis, cliquez sur "Create".

Voilà, vous avez maintenant mis en place un accès privée pour votre site Webflow. Cet élément est modifiable et il est également possible de le supprimer. Tout comme un élément des collections du CMS.

(3) Pages restrictions

Sur les paramètres de vos pages Webflow, vous pouvez désormais ajouter dans l'onglet "Acces Control" des restrictions d'accès spécifiques à chaque page ;

• Public
• Specifics members only

Comment savoir quelles pages de mon site Webflow ont un accès "membre seulement" ?

Sur les pages "membership", une petite icône avec un bonhomme bleu apparaît en bas à gauche.

(4) Les pages créées par défaut (Users pages)

Lorsque vous activez l'espace membre sur votre projet, webflow créera automatiquement une série de page :

• Log in
• Sign up
• Reset password
• Update password
• Access denied
• User account

Ces pages sont similaires aux pages "utilitaires" que l'on trouve sur vos sites Webflow, comme votre page d'erreur 404 ou bien votre panier d'achat en ligne sur l'extension e-commerce. Vous pouvez (et même à mon avis devez) personnaliser complètement leurs interfaces visuelles.

(5) Bouton log in / log out

Un bouton de connexion/déconnexion ! C'est un nouvel élément HTML.

Il est obligatoire pour faire fonctionner votre interface réservée aux membres.

Pour le trouver, allez dans les éléments (A) et faites un drag & drop du bouton LOG IN/LOG OUT directement sur l'interface webflow de votre projet. Une fois ajouté dans votre site, vous pouvez personnaliser son design et son texte.

(6) Comment personnaliser les e-mails envoyés ?

Avec l'espace membres, plusieurs modèles de mails automatisés sont par défaut intégrés au système (sans plug-in, ni besoin d'outils complémentaires) ;

• e-mail de bienvenu
• e-mail d'oublis de mot de passe
• e-mail d'actualisation du mot de passe
• etc...

L'ensemble de ces champs sont personnalisables avec des champs dynamiques, alimentés directement depuis votre projet Webflow. Lorsque un nouveau membre s'inscrit, vous pouvez donc, par exemple, personnaliser son "e-mail de bienvenu", avec son nom, son prénom, etc...

Pour accéder au template, allez dans les paramètres de votre designer Webflow (⚠️ pas le projet, mais accessible depuis la barre verticale de gauche). Cliquez ensuite sur l'option Email et vous trouverez plusieurs options de personnalisation possibles.

(7) Tester votre espace membre

Okkkkk. Est-ce que tout fonctionne bien ? Testons !

Publiez votre site, puis testez directement en live la bonne intégration de l'espace membre en simulant la création d'une inscription avec l'une de vos adresses e-mails.

____

A partir de l'étape suivante, les fonctionnalités décrites sont bloquées si vous n'avez pas un plan Webflow e-commerce.

____

(8) Créer un espace membre payant

1. Activer la fonctionnalité e-commerce de votre site
2. Ajouter un nouveau "produit"
3. Sélectionner l'option "membership" à la liste déroulante de produits
4. Remplir les différents champs descriptifs
5. Ajouter les paramètres de paiement : abonnement/paiement unique (Webflow fonctionne avec Stripe)
6. Définissez le tarif
7. Validez votre produit puis retournez dans l'interface "Users"
8. Reprendre les étapes de création de "l'access group" puis changer le paramètre d'acces group de "free acces" pour "paid access"
9. Connectez cet accès à un produit (celui que vous venez de créer)
10. Définissez les restrictions
11. Cliquez sur create

Bonus : gérer facilement le suivi de vos abonnements depuis votre CMS dans l'onglet "subscriptions".

(🎁) Quelques conseils en plus...

• Pensez à bien laisser visible un lien pour créer un nouveau compte sur votre interface de connexion.

• ⚠️ Lorsque que quelqu'un annule son abonnement, l'annulation est immédiate. Il verra donc immédiatement son accès au contenu privé coupé. Expliquez-le clairement.

Questions techniques

Combien côute l'espace membre ?

D'après les dires de Webflow, pour l'instant le prix "reste à déterminer".

Mais la première version, bêta access est gratuite.

Y a-t-il une limite sur le nombre d'utilisateurs ?

Pour l'instant, l'espace réservé aux membres est limité à 1000 membres par projet.

Peut-on se connecter avec un Social (google, facebook, etc..) ?

Une connexion SSO (Single Sign-On) est encore à l'étude dans le cadre de la feuille de route des produits, il n'est donc pas encore possible. Mais cela devrait être surveillé pour les futures versions du produit

Weblow Membership : notre avis

Il est assez simple de prendre en main cette nouvelle fonctionnalité de Webflow car le back-office espace membre fonctionne sur le même principe que les collections CMS ou que l'e-commerce de Webflow.

Que vous soyez une agence numérique, un freelance ou une simple entreprise, Membership 1.0 est déjà très suffisant pour répondre à vos besoins de développement.

Combiné avec Make (un outil d'automatisation) et airtable, vous pouvez déjà créer des workflow solides :

Cependant, afin d'utiliser pleinement cette fonctionnalité, nous attendons avec impatience

1. La sortie de "Logic" sur Webflow. Logic est l'automated Workflow System intégré nativement à Webflow
2. Le développement de la version ecommerce actuelle.

Pour enfin, être dans le...

Le futur

Avec la synergie entre son espace réservé aux membres, Logic, et sa fonctionnalité de de commerce électronique, Webflow offrira à ses utilisateurs d'énormes possibilités pour créer bien plus que des sites web sans code. Les possibilités de créations semblent devenir, bientôt, illimitées.

Ps : Et pour finir, je souhaite bon courage à Wordpress et Memberstack pour continuer d'innover. Sinon, l'année prochaine, les chiffres ne seront pas jojoooo! Toujours all-in sur l'outil no-code Webflow, et je dors tranquille ! Merci Webflow.