# 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 :**
* 📧 **Envoyez-nous un e-mail à :**
* 💻 **Discutez en direct avec nous :** Disponible du lundi au vendredi, de 10h à 18h EST, directement sur notre site web
---
# Agent Instructions: Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.
Perform an HTTP GET request on the current page URL with the `ask` query parameter:
```
GET https://docs.openspaces.design/plain-jane-docs-v2-fr/readme-1/customer-accounts/login-page.md?ask=
```
The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.
Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.