Gérer la Configuration
Aperçu
Sous eCom \ Einstellungen, vous configurez le comportement de la boutique.
Quelles configurations existent, quelles valeurs elles peuvent prendre et ce qu'elles produisent, est décrit dans la description des fonctionnalités sur la page Configuration en aperçu. Cette page décrit uniquement la procédure et les endroits où l'on se trompe.
Procédure
- Ouvrir eCom \ Einstellungen.
- Modifier la configuration.
- Enregistrer.
- Mettre les données à disposition.
Un changement prend effet au plus tôt après le prochain intervalle de récupération de la boutique, donc après 15 ou 30 Minutes.
Configurations qui ne fonctionnent qu'avec un autre endroit
C'est la source d'erreur la plus fréquente : la configuration est définie, mais le second endroit manque.
| Configuration | Nécessite en plus |
|---|---|
| Saisie de bon | un bon créé sous eCom \ Gestion bons d'achat |
| Coûts d'expédition Article | Coûts d'expédition et Limite franco de port comme valeurs mandants avec indicateur eCom |
| Appliquer Valeur de commande minimale du Débiteur | données Débiteur fournies ; sinon la valeur mandants s'applique |
| Langue par défaut | Textes d'article et textes de Groupe de produit dans la Langue choisie |
| Pas encore Client, case décochée | le Bloc de texte Pas encore d'accès – Info sous eCom \ Textes |
Changer les couleurs de la boutique via CSS
La coloration est disponible comme Texte libre dans le champ CSS. Les couleurs sont données comme variables CSS en notation HSL.
Pour passer à votre couleur maison, en général deux valeurs suffisent :
- Définir
--primarysur votre couleur maison — teinte foncée. - Définir
--primary-softsur le même angle de couleur, mais très clair.
La notation HSL est hsl(angle de couleur saturation luminosité). Pour plus clair ou plus foncé dans la même couleur, vous ne changez que la dernière valeur. Les variables avec var(--primary) reprennent automatiquement la valeur de la couleur principale.
Attention : Chaque couleur a une couleur
-foreground, donc la couleur du texte dessus. Veillez à un contraste suffisant, sinon le texte dans la boutique devient illisible.
Le fond de page
L'arrière-plan de la boutique est constitué d'un dégradé de couleur d'arrière-plan avec deux points d'extrémité : --verlauf-warm et --verlauf-kalt. De plus, il existe la variable --shop-hintergrund pour une couleur d'arrière-plan uniforme.
Dans l'état de livraison, les deux points d'extrémité pointent vers --shop-hintergrund, qui lui-même pointe vers --primary-soft :
--shop-hintergrund: var(--primary-soft); --verlauf-warm: var(--shop-hintergrund); --verlauf-kalt: var(--shop-hintergrund);
Parce que les deux points d'extrémité ont la même valeur, aucun dégradé n'est visible dans l'état de livraison — l'arrière-plan est uni. Et parce que la valeur dépend de --primary-soft, elle s'adapte automatiquement à la couleur principale : celui qui modifie --primary-soft obtient l'arrière-plan correspondant.
Définir un autre arrière-plan uni. Une seule ligne suffit :
:root { --shop-hintergrund: hsl(0 0% 100%); }
Créer un dégradé. Définissez --verlauf-warm et --verlauf-kalt individuellement sur deux couleurs différentes et laissez --shop-hintergrund inchangé. La boutique fera alors une transition entre les deux points d'extrémité. Exemple :
:root { --verlauf-warm: hsl(27 87% 94%); --verlauf-kalt: hsl(215 100% 94%); }
Info sur le choix des couleurs : Une couleur vive paraît beaucoup plus intense sur une grande surface que sur un bouton. L'arrière-plan standard dépend de
--primary-soft, donc de la nuance claire, et reste ainsi discrète. Vérifiez toujours le résultat avec vos propres couleurs sur la boutique terminée avant de les fixer définitivement.
L'état de livraison et un contre-exemple
La boutique est livrée en orange. À côté, une palette bleue comme exemple de changement — les deux reposent sur un angle de couleur :
| Variable | Orange (livraison) | Bleu (exemple) |
|---|---|---|
--primary | hsl(27 87% 49%) | hsl(215 100% 25%) |
--primary-soft | hsl(27 87% 94%) | hsl(215 100% 94%) |
--secondary | hsl(36 82% 50%) | hsl(211 100% 40%) |
--accent | comme --primary | comme --primary |
--ring | comme --primary | comme --primary |
--shop-hintergrund | var(--primary-soft) | librement choisissable |
--verlauf-warm, --verlauf-kalt | les deux var(--shop-hintergrund) | les deux hsl(0 0% 100%) — blanc, donc pas de dégradé visible |
De --primary à --primary-soft, l'angle de couleur et la saturation restent identiques ; seule la luminosité change — pour l'orange de 49 à 94 pour cent, pour le bleu de 25 à 94. C'est exactement ainsi que la notation est conçue : une couleur, deux luminosités.
--secondary diffère légèrement dans les deux cas — quelques degrés dans l'angle de couleur et un niveau plus clair. Cela suffit pour que les éléments secondaires se détachent, sans introduire une deuxième couleur.
Info :
--accentet--ringreprennent la couleur principale. Qui ne veut pas explicitement une autre couleur n'a pas besoin de les définir. En pratique, il y a donc trois valeurs :--primary,--primary-softet--secondary.
La liste complète des variables se trouve dans la description des performances sur la Page Paramètres en un coup d'œil.