# Page de connexion

### **Ce que vous apprendrez**

* Comment activer et personnaliser le modèle de page de connexion pour les comptes clients hérités
* Comment modifier l'apparence du formulaire de connexion à l'aide des paramètres du thème
* Comment ajuster le texte, les styles des boutons, la mise en page et les liens

***

### 🧩 Aperçu

Cette page de connexion fait partie de Shopify **système de compte client hérité** et est entièrement personnalisable via votre éditeur de thème. Elle prend en charge des blocs de mise en page personnalisés, des images latérales et des champs de saisie stylisés — offrant un contrôle visuel complet de l'expérience de connexion client.

> ⚠️ Cette page de connexion s'applique uniquement lorsque **Comptes clients hérités** sont activés dans **Paramètres > Comptes clients**.

***

### 🎨 Structure de la page

La page de connexion est composée des sections suivantes :

* **Logo & Horloge** (Optionnel)
* **Formulaire de connexion** (Fonctionnalité principale)
* **Lecteur de musique** (Optionnel)
* **Pied de page** (Optionnel)

***

### ✏️ Personnalisation du formulaire de connexion

Accédez à **Éditeur de thème → Modèles → customer/login.liquid**\
Cliquez sur la **Formulaire de connexion** bloc pour commencer la personnalisation.

#### 🔳 Image latérale de connexion

* **Choisir une image** – Téléchargez ou sélectionnez une image de marque
* **Position de l'image latérale** – Choisir gauche ou droite
* **Courber l'image latérale** – Ajoute des coins arrondis
* **Supprimer l'image latérale** – Basculer pour masquer complètement

***

#### 🧾 Contenu de l'en-tête de connexion

* **Texte d'en-tête** – Titre du bloc de connexion (par ex. « Se connecter » ou « Bon retour »)
* **Texte de sous-en-tête** – Brève description ou message personnalisé

Vous pouvez également personnaliser **les couleurs du texte de l'en-tête et du sous-titre**.

***

#### 🔐 Champs de saisie

Chaque champ du formulaire dispose de ses propres paramètres de conception :

**Champ e-mail**

* Couleur du libellé
* Couleur de la bordure
* Couleur du texte

**Champ mot de passe**

* Couleur du libellé
* Couleur de la bordure
* Couleur du texte

***

#### 🔘 Bouton de connexion

Personnaliser :

* **Texte du bouton** (par ex. « Entrer » ou « Se connecter »)
* **Couleur du texte**
* **Couleur d'arrière-plan**

Utilisez un contraste fort et en gras pour maintenir l'accessibilité.

***

#### ❗ Style des erreurs

Définir le **Couleur du texte d'information en cas d'erreur de connexion** pour correspondre au style d'alerte de votre marque (généralement rouge).

***

#### 🔗 Liens supplémentaires

Vous pouvez mettre à jour le texte et la couleur pour :

* **Lien d'inscription**
* **Lien Mot de passe oublié**
* **Lien Retour à la boutique**

Ils apparaissent sous ou autour du formulaire de connexion.

***

#### 🎨 Divers

* **Champs et boutons arrondis** – Activez pour des coins arrondis sur les champs et le bouton de connexion.

***

### ✅ C'est fait !

Votre page de connexion personnalisée est maintenant entièrement stylisée et accessible à :\
`votreboutique.com/account/login`

> 💡 Astuce : Associez cela aux documents « Page d'inscription » et « Page de compte » pour construire entièrement le parcours client.

### **Besoin d’aide ?**

* 💬 **Rejoignez notre communauté sur Discord :** <https://discord.gg/hcc2GvgZc6>
* 📧 **Envoyez-nous un e-mail à :** <support@openspaces.design>
* 💻 **Discutez en direct avec nous :** Disponible du lundi au vendredi, de 10h à 18h EST, directement sur notre site web