> For the complete documentation index, see [llms.txt](https://docs.openspaces.design/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.openspaces.design/plain-jane-docs-v2-fr/plain-jane-interactive/sections-and-features/preloader-section.md).

# Section préchargeur

### **Ce que vous apprendrez**

* Comment activer un écran de chargement personnalisé avant le chargement de votre site
* Comment personnaliser l’arrière-plan, le logo et le texte
* Comment définir la durée d’affichage

***

### 🧩 Présentation de la section

Le préchargeur ajoute un écran de chargement en plein écran qui apparaît brièvement lorsque les visiteurs arrivent sur votre boutique. Cela est utile pour améliorer la présentation de la marque et créer une expérience utilisateur plus soignée pendant le chargement initial de la page.

Vous pouvez afficher soit du texte soit une image (comme un logo) ainsi que des couleurs d’arrière-plan et des durées personnalisées.

***

### Comment activer le préchargeur

1. Dans le **éditeur de thème Shopify**, ouvrez le **Paramètres du thème**
2. Repérez et développez le **Préchargeur** panneau
3. Activez le **Type de logo du préchargeur** (choisir entre *Texte* ou *Image*)

***

### Paramètres du préchargeur

#### Type de logo du préchargeur

* **Texte** : Affiche un nom de marque ou de thème
* **Image** : Utilisez votre logo ou un visuel animé

#### Texte du préchargeur

* Ajoutez un court titre (par ex. « Plain Jane 3.0 »)
* Personnalisez le **Couleur du texte**
* Ajuster **Taille du texte** à l’aide du curseur

> 💡 Astuce : Utilisez des polices en gras ou de grande taille pour un impact visuel accru

#### Image du préchargeur

* Téléchargez une image statique ou animée (comme un .GIF ou .webp)

#### Couleur d'arrière-plan

* Définissez la couleur d’arrière-plan de l’écran du préchargeur

#### Durée du préchargeur

* Contrôle la durée d’affichage de l’écran (en secondes)
* Par défaut 1 seconde ; augmentez pour des effets d’animation de chargement plus longs

***

### Exemples d’utilisation

* Affichez votre **animation de logo** avant l’ouverture de la boutique
* Faites correspondre le **fond du préchargeur** avec votre section Hero pour une transition fluide
* Utilisez du texte de marque comme : « Chargement de la collection… » ou « Propulsé par Plain Jane »

> ⚠️ Gardez les durées courtes (1–3 secondes) pour éviter de ralentir l’accès des utilisateurs

***

### Conseils de style

* Faites correspondre le **couleurs** du préchargeur à votre palette de marque
* Gardez le **texte minimal** pour un rendu épuré
* Utilisez un fond transparent ou blanc pour une sensation de légèreté

***

### **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


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## 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, and the optional `goal` query parameter:

```
GET https://docs.openspaces.design/plain-jane-docs-v2-fr/plain-jane-interactive/sections-and-features/preloader-section.md?ask=<question>&goal=<endgoal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal.

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.
