Paramètres de mise en page
Avec EasyWebshop, il est possible de créer une mise en page personnelle pour votre boutique en ligne, tout en restant facile à utiliser pour l'utilisateur. Le gestionnaire de mise en page vous offre énormément de fonctionnalités pour personnaliser et pour affiner le look de votre site Internet. Les paramètres de mise en page peuvent être trouvés dans Paramètres > Mise en page
- Quelques astuces pour créer une belle mise en page
- Demandez à un web designer de concevoir votre mise en page
1. Choisissez un modèle de départ
Choisissez un design à partir duquel vous souhaitez démarrer. Vous pouvez voir un exemple du design en cliquant dessus. N'hésitez pas à faire des essais, aucune donnée ne sera perdue si vous changez la mise en page.
- Version mobile avec designs réactifs
- Les modèles avec l'icone
Réactif peuvent s'adapter selon la taille de l'écran de vos visiteurs. Ces modèles fonctionnent sur smartphones et tablettes.
2. Choisissez la palette des couleurs
Cliquez sur l'onglet Palette de couleurs. Vous pouvez choisir une palette de couleurs prédéfinie, ou déterminer vous-même la combinaison des couleurs.
- Fond
- Cette couleur est utilisée pour le fond. Une image de fond peut couvrir cette couleur.
- Fond des menus
- Cette couleur est utilisée pour le fond des éléments dans votre boutique en ligne.
- Texte des menus
- Cette couleur est utilisée pour le texte sur les éléments. Choisissez un contraste adéquat avec le menu en fond.
- Menu avec survol de la souris
- Cette couleur est utilisée lorsqu'un visiteur déplace le curseur de sa souris sur un élément du menu.
Essayez différentes combinaisons. Vous pouvez toujours annuler vos changements par la suite. Assurez-vous que le résultat final ne soit pas trop tape-à-l'œil et qu'il y ait suffisamment de contraste entre les textes et les couleurs de fond.
Quelques astuces pour les combinaisons de couleur :
Vous pouvez également ajouter un code couleur personnalisé en cliquant sur le code de couleur dans la fenêtre contextuelle de sélection des couleurs. Les codes couleurs peuvent être trouvés dans les sites Web mentionnés ci-dessus. Entrez un code couleur hexadécimal qui commence par #. Par exemple : #FF9900.
Vous pouvez également personnaliser l'affichage des textes et des titres. Les valeurs qui sont communément utilisées sur Internet sont réglées par défaut. S'il n'y a aucune raison de les changer, nous vous recommandons d'utiliser les valeurs par défaut.
Police : Sans-Serif, taille du texte : 1 em, couleur du texte : noir.
Ce paramètre affecte tous les textes de votre boutique. Ainsi, tout reste cohérent. Afin de faire des exceptions pour certains textes, vous pouvez utiliser le système de gestion du contenu.
Une question fréquemment posée à notre service d'aide : « Les textes de ma boutique sont partis. ». Ceci est dû au fait que la couleur du texte est définie pour apparaître de la même couleur que le fond.
Vous pouvez également changer le style des boutons qui sont affichés sur notre boutique en ligne.
3. Choisissez un fond
- Mettez en ligne votre propre image de fond
- Utilisez un fond personnalisé qui rendra votre boutique unique.
- Répéter l'image de fond
- Vous pouvez choisir de répéter un motif ou de l'étendre pour obtenir une grande photo en fond.
- Opacité
- Vous pouvez rendre le contenu de votre page Web transparente, afin que votre fond ressorte. 50% = très transparent, 100% (défaut) = non transparent. Assurez-vous que le contraste soit suffisant.
- Motifs de fond
- Vous pouvez choisir l'un de nos motif préprogrammés plutôt que de choisir votre propre fond. Vous pourrez trouver plus de motifs sur ces sites :
- Image de fond
- Vous pouvez choisir parmi quelques exemples de fonds.
4a. Mettez un logo (d'entreprise) en ligne
Lorsque vous mettez un logo en ligne, le titre et le slogan de votre boutique sont remplacés par le logo. C'est à vous de décider que le logo s'adapte bien au design.
Voici des éditeurs d'images gratuits qui vous permettront de modifier votre logo :
Astuce : vous pouvez mettre en ligne des images transparentes. Nous recommandons le format .png.
4b. Définissez une icône de navigateur
Cela vous permet de mettre en ligne une favicon qui est visible dans la barre d'adresse lorsque l'on visite votre boutique.
Vous avez besoin d'un fichier image au format .ico, d'une taille de 16×16 pixels et avec un poids maximal de 150 Ko.
- Créez vous-même une favicon
- Téléchargez une favicon
- Votre web designer ou concepteur de logo peut également vous créer une favicon
La favicon est affichée :
- Dans les onglets du navigateur
- Dans la barre de liens
- Dans les favoris du navigateur
- En faisant glisser vers le bureau
5. La page d'accueil de votre boutique
Ici, vous pouvez choisir d'afficher ou de cacher des objets sur votre page d'accueil. Il y a beaucoup plus d'objets que vous pouvez afficher sur votre page d'accueil :
- Message de bienvenue : voir la page Accueil dans la prochaine section
- Paramètres d'affichage supplémentaires, voir la section Paramètres de la boutique
- Partenaires et réseaux sociaux : voir la section marketing
Par défaut, les 12 derniers produits sont affichés sur votre page d'accueil, changez ce nombre à 0 si vous ne voulez aucun produit sur votre page d'accueil. Vous pouvez également choisir pour chaque produit si vous voulez, ou non, l'afficher sur la page d'accueil. Voir gestion avancée des produits pour cela.
Voir votre boutique
Après avoir cliquer sur Enregistrer, les changements prennent immédiatement effet. Cliquez sur voir votre boutique pour voir le résultat.
Questions fréquemment posées à propos de la mise en page
- Il y a un espace libre à gauche et à droite de la page, puis-je également y mettre des informations ?
- Nos modèles sont créés pour avoir une largeur de 1000 pixels. Cela s'adapte parfaitement à la plupart des écrans d'ordinateur, d'ultrabook, de netbook et de tablette.
Sur un grand écran, vous verrez un espace libre sur la gauche et la droite. C'est un « espace souple » qui change selon la largeur de l'écran. Si vous mettez une bannière ou du texte à cet endroit, alors une barre de défilement horizontal apparaîtra sur beaucoup d'ordinateurs. Vos visiteurs devront faire défiler horizontalement pour lire toutes les informations.
Si vous voulez toujours faire un site Web plus large, alors il est préférable de choisir une mise en page avec un design personnalisé.
Problèmes possibles
- Je vois toujours la version ancienne du site Web
-
Cela est dû généralement au fait que les anciennes images sont toujours dans le cache du navigateur Internet. Un navigateur Internet (Internet Explorer, Firefox, Google Chrome,...) enregistre les pages Web et les images sur votre disque dur. Ainsi, lors de votre visite suivante, la page se charge plus rapidement. Lorsque vous visiterez la page, vous verrez la version ancienne de la photo sur votre disque dur et non la nouvelle version de votre site Web.
Pour régler ce problème : rendez-vous sur la page de la boutique et cliquez sur Actualiser la page ou Recharger la page.
Vous pouvez également utiliser les touches de raccourci : F5 ou CTRL + R (Pomme + R sur Mac). La version la plus récente de votre page web et maintenant chargée.
Autres raisons possibles pour lesquelles vous ne voyez pas les changements:
- Vous être sur un mauvais site ou une mauvaise page Web
- Il y a un module de mise en page avancée (mise en page CSS ou mise en page personnalisée) activé. - Mon logo est répété ou il y a un espace blanc à côté
- Si votre logo n'est pas aux bonnes dimensions, il sera répété, ou un espace blanc apparaîtra de chaque côté.
- La favicon n'est pas affichée
- Utilisez un navigateur récent. Dans certaines anciennes version d'Internet Explorer, aucune favicon n'est affichée.
Connectez également un nom de domaine à votre boutique. Certains navigateurs affichent la favicon de EasyWebshop si aucun nom de domaine n'est connecté.
Tailles de logo
Vous pouvez choisir les dimensions de votre logo vous-même. Ce tableau montre la quantité d'espace disponible pour le logo. Les logos plus grands sont automatiquement mis à l'échelle proportionnellement.
| Modèle | Dimensions in pixels |
|---|---|
| Vitality | 300x100 |
| Carefree | 300x100 |
| Soft Touch | 200x50 |
| Soft Link | 200x50 |
| Easy Mobile | 330x50 |
| Clean | 330x50 |
| Clean & Smooth | 330x50 |
| Streamlined | 1120x200 |
| Streamlined Wide | 2000x200 |
| Elementary | 330x50 |
| Elementary Reverse | 330x50 |
| Fluid | 1080x200 |
| Flex | 1080x200 |
| Fluid Classic | 1080x200 |
| Flex Classic | 1080x200 |
| Fluid Edge | 1080x200 |
| Flex Edge | 1080x200 |
| Fluid Edge Classic | 1080x200 |
| Flex Edge Classic | 1080x200 |
Page suivante: Modifier les textes et pages web >>>
