--- title: "Connexion et espace client : les pages de vos comptes clients dans l'éditeur" description: "Personnalisez la page de connexion de vos clients et leur espace personnel ; les pages d'origine restent en ligne tant que vos mises en page ne sont pas publiées." url: https://docs.vivlab.com/sections/themes-accounts --- # Connexion et espace client Avec les [comptes clients](https://docs.vivlab.com/sections/customer-accounts.md), deux pages de votre site s'ouvrent à vos clients : la **page de connexion**, où ils se connectent ou créent leur compte, et leur **espace personnel**, où ils retrouvent commandes, adresses et favoris. Vous personnalisez chacune dans l'éditeur, avec votre logo, vos couleurs et vos textes. Ouvrez-les depuis la page [Thèmes](https://docs.vivlab.com/sections/branding.md), onglet **Comptes clients** : **Connexion des clients** pour la page de connexion, **Espace personnel des clients** pour l'espace membre. Ce groupe n'apparaît qu'avec une boutique. Ces deux pages s'affichent sans l'en-tête ni le pied de page de votre site, comme les [étapes du paiement](https://docs.vivlab.com/sections/themes-checkout.md) : elles gardent chacune un lien de retour vers la boutique. ## Que voulez-vous faire ? - [Personnaliser la page de connexion](#page-de-connexion) - [Personnaliser l'espace personnel](#espace-personnel) - [Partir d'une autre mise en page](#partir-d-une-autre-mise-en-page) - [Changer un texte](#changer-un-texte) - [Mettre une page en ligne](#publier) ## Personnaliser la page de connexion {#page-de-connexion} La page de connexion sert à plusieurs formulaires. Dans la barre de l'éditeur, **Aperçu avec** choisit celui que montre le canevas : **Connexion**, **Inscription**, **Mot de passe oublié**, **Code e-mail** ou **Nouveau mot de passe**. Votre mise en page vaut pour tous. Le bouton **Éléments** propose : - **Logo** : le logo de votre boutique, avec un lien vers l'accueil. - **Titre** : le titre et le sous-titre du formulaire affiché. - **Bascule connexion / inscription** : passe de la connexion à la création de compte ; masquée sur les autres formulaires. - **Formulaire de connexion** : le formulaire affiché, avec ses messages d'erreur (et **Continuer avec Google** si la [connexion Google](https://docs.vivlab.com/sections/memberships-settings.md#connexion-google) est réglée). - **Continuer sans compte** : le lien pour commander sans compte, masqué quand un [compte est obligatoire](https://docs.vivlab.com/sections/memberships-settings.md#comptes-a-la-commande). Vous pouvez aussi ajouter des blocs classiques, par exemple une image de marque à côté du formulaire ou un texte qui rappelle les avantages d'un compte. ## Personnaliser l'espace personnel {#espace-personnel} Dans la barre de l'éditeur, **Aperçu avec** choisit la page de l'espace montrée sur le canevas : **Commandes**, **Favoris**, **Téléchargements**, **Abonnements**, **Retours**, **Mes informations**, **Adresses**, **Moyens de paiement**, **Sécurité** ou **Communications**. La mise en page entoure toutes ces pages. Le bouton **Éléments** propose : - **Logo** et **Retour à la boutique** : le logo de votre boutique et le lien vers son accueil. - **Accueil du client** : le nom du client, sa date d'inscription et ses points de [fidélité](https://docs.vivlab.com/sections/loyalty.md). - **Navigation** : les liens vers les pages de l'espace, en **Barre latérale** (une colonne, qui devient une rangée défilante sur petit écran), en **Barre horizontale** ou en **Panneau latéral sur mobile** (la colonne sur ordinateur ; sur petit écran, un bouton **Mon espace** l'ouvre dans un panneau). - **Page en cours** : la page ouverte par le client (commandes, informations, adresses, favoris…). - **Déconnexion** : le bouton qui déconnecte le client. ## Partir d'une autre mise en page À la première ouverture, chaque page reprend la structure de la page d'origine. Cliquez sur le fond de la page, puis, dans **Modèles**, sur **Changer** : - page de connexion : **Centré**, **Panneau de marque**, **Divisé**, **Carte** ou **Minimal** ; - espace personnel : **Barre latérale**, **Barre supérieure** ou **Cartes**. Choisissez une mise en page, puis confirmez avec **Remplacer**. Toutes les sections sont remplacées, mais les textes que vous avez saisis sur les éléments sont conservés ; le changement peut être annulé. **Réinitialiser la mise en page** revient à la structure d'origine. ## Changer un texte Sélectionnez un élément, comme le **Titre** de la page de connexion, puis cliquez de nouveau dessus et tapez votre texte directement sur la page. **Entrée** ou un clic ailleurs enregistre, **Échap** annule. Sur la page de connexion, choisissez d'abord le formulaire dans **Aperçu avec** : chaque formulaire a son propre titre. Un texte vidé reprend le texte par défaut, traduit dans la langue du visiteur. ## Mettre une page en ligne {#publier} Cliquez sur **Publier la mise en page**, vérifiez l'aperçu ordinateur et mobile, puis **Publier**. Pour qu'aucun client ne reste bloqué, ces éléments doivent être présents sur ordinateur et sur mobile : - page de connexion : **Formulaire de connexion**, **Bascule connexion / inscription** et **Logo** (le chemin du retour à la boutique) ; - espace personnel : **Page en cours**, **Navigation**, **Déconnexion**, et **Retour à la boutique** ou **Logo**. Tant que la mise en page n'est pas publiée, vos clients voient la page d'origine. Chaque page se publie séparément. ## Bon à savoir - Les comptes clients s'ouvrent et se règlent dans [Comptes clients > Paramètres](https://docs.vivlab.com/sections/memberships-settings.md) : connexion Google, compte obligatoire pour commander, protection contre les robots. - Le canevas de l'espace personnel montre un client d'exemple : personne n'a besoin d'être connecté pour le composer.