# 2. Configuration de votre page d'accueil

{% embed url="<https://youtu.be/KpO8Wdo-LeI>" %}

{% hint style="info" %}

> ⚠️ Remarque : Le `Arrière-plan dynamique` section a été dépréciée dans les dernières versions de Plain Jane et Interactive. Utilisez `Toile de page` à la place — elle offre la même fonctionnalité pour les images d'arrière-plan, les vidéos, les couleurs, etc.
>
> ⚠️ Remarque : Ce guide **prennent** s'applique aux utilisateurs de Plain Jane Starter.
> {% endhint %}

### Ce que vous apprendrez

* Comment personnaliser la mise en page de votre page d'accueil dans Plain Jane v3 et Interactive v2
* Comment ajouter et configurer des menus centrés, alignés sur le côté et compacts
* Quand utiliser chaque mise en page pour de meilleurs résultats
* Comment lier les menus et gérer la navigation
* Comment contourner complètement la page d'accueil si vous le souhaitez

>

***

### 🛠️ Pour les nouveaux utilisateurs : Configurer un menu

1. Aller à **Boutique en ligne** > **Navigation** dans votre administration Shopify.
2. Cliquer sur **Ajouter un menu** et nommez-le quelque chose comme `Menu de test`.
3. Ajoutez des éléments de menu tels que :
   * `Hommes` → lien vers votre collection Homme
   * `Lookbook` → lien vers une page personnalisée ou la page d'accueil
   * `Contact` → lien vers la page de contact intégrée de Shopify
4. Cliquer sur **Enregistrer**.

***

### 🎨 Mise en page 1 : Menu centré

C'est la mise en page la plus populaire (par ex., page d'accueil style Supreme).

#### Comment la configurer

1. Ouvrez votre thème dans l' **Personnaliser** éditeur.
2. Assurez-vous que ces sections sont présentes :
   * `Préchargeur`
   * `Popup e-mail`
   * `Toile de page`
   * `Menu centré`

> 💡 Astuce : `Toile de page` remplace la section dépréciée `Arrière-plan dynamique` Utilisez-la pour les images d'arrière-plan ou les couleurs.

#### Lier votre menu

* Cliquez sur la `Menu centré` section
* Dans le panneau de droite, **choisissez votre menu** dans le menu déroulant (par ex., `Menu de test`)

#### Icônes de réseaux sociaux

* Activer les icônes **activé**
* Collez les URL complètes de vos profils (par ex., TikTok, Threads, Tumblr)

> 💡 Astuce : N'ajoutez pas de contenu défilant sous le menu centré. Gardez-le propre et simple.

***

### 🎨 Mise en page 2 : Menu aligné sur le côté

Convient aux marques qui veulent des menus verticaux minimalistes.

#### Étapes de configuration

1. Dans l'éditeur de thème, supprimez le `Menu centré`.
2. Cliquer sur **Ajouter une section** > `Menu aligné sur le côté`
3. Sélectionnez votre menu dans le panneau de droite

#### Options de personnalisation

* Ajuster **taille de la police**, **espacement des liens**, et **couleurs**
* Basculer **lien de connexion** visibilité (nécessite l'activation des comptes clients)
* Choisissez **alignement du logo** (gauche ou droite)
* Changer **famille de polices** sous `Paramètres du thème > Typographie`

> 💡 Astuce : Évitez d'empiler des sections produit sous cette mise en page — elle n'est pas adaptée au défilement.

***

### 🎨 Mise en page 3 : Menu compact

Cette mise en page comporte une icône hamburger en haut à droite.

#### Étapes de configuration

1. Ajoutez le `Menu compact` section
2. Liez votre menu sous `Paramètres du thème > Paramètres globaux du menu`
3. Centrez ou alignez votre logo comme vous le souhaitez

#### Ajouter arrière-plan + contenu

* Utilisez la `Toile de page` section pour :
  * Définir une couleur d'arrière-plan ou télécharger une image
* Ajouter des sections comme `Liste de collections` ou `Carrousel de produits`

> ⚠️ Avertissement : Il s'agit de la **seule mise en page** recommandée pour les pages d'accueil défilables.

***

### 🚀 Contourner la page d'accueil (optionnel)

Vous voulez diriger les visiteurs directement vers une collection ?

1. Aller à `Paramètres du thème > Paramètres de la page d'accueil`
2. Activer **Ignorer l'écran d'entrée**
3. Définissez la page de destination (par ex., une collection spécifique)

> 💡 Astuce : C'est utile pour les marques axées sur les produits qui n'ont pas besoin d'une page d'accueil.

***

### 📌 Notes finales

* Utilisez **Toile de page** pour toute la personnalisation de l'arrière-plan de la page d'accueil
* Gardez votre mise en page minimale et fonctionnelle
* Enregistrez toujours et actualisez pour prévisualiser vos modifications

Mises en page prises en charge :

* Menu centré (landing statique)
* Menu aligné sur le côté (nav verticale minimaliste)
* Menu compact (constructeur de page d'accueil défilable)

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

* 💬 **Pour l'assistance technique, rejoignez-nous 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