L'organisation du contenu de votre site est primordiale. Un contenu bien structuré facilite la navigation des visiteurs et vous permet de mettre en valeur des sections qui pourraient passer inaperçues. Une page bien organisée confère à votre site une allure professionnelle et contribue à augmenter vos ventes en simplifiant l'accès à l'information pour les visiteurs.
Structure des Sites Internet Guesty
L'outil de création de site web est composé d'un en-tête, d'un pied de page, de lignes et de colonnes. Chaque widget ajouté est inséré dans l'une de ces sections.
Les widgets occupent souvent toute la largeur d'une colonne ou d'une ligne, ce qui rend leur sélection difficile. Pour contourner ce problème, cliquez avec le bouton droit sur le widget dans la colonne ou la ligne souhaitée, survolez l'option « Sélectionner le conteneur », puis choisissez « Colonne » ou « Ligne ».
Rangées
Les rangées correspondent aux sections horizontales de votre site. Lorsque vous ajoutez des widgets et des colonnes, ils sont placés dans ces rangées. Pour modifier l'affichage du contenu sur mobile, cliquez sur le bouton « Inverser l'ordre des colonnes » dans l'éditeur de rangées. Vous devez modifier les options de conception de la rangée sur mobile pour accéder à cette option.
Vous pouvez ajouter des rangées à votre site en y faisant glisser des widgets. Lorsque vous faites glisser un widget entre deux rangées ou dans un espace où vous souhaitez ajouter une rangée, une nouvelle rangée sera créée dès que vous déposerez le widget.
Pour supprimer une rangée, cliquez avec le bouton droit n'importe où sur la rangée pour ouvrir le menu contextuel, puis cliquez sur Supprimer. Vous pouvez également cliquer sur le bouton Rangée en haut à gauche de la rangée, puis sur Supprimer.
Note:
Pour plus d'informations sur la modification et l'organisation des rangées, consultez l'éditeur de rangées.
Colonnes
Chaque ligne contient au moins une colonne. Les colonnes contiennent tous les widgets de votre site et déterminent leur disposition.
Chaque ligne peut contenir jusqu'à quatre colonnes. Lorsqu'une nouvelle colonne est ajoutée, elle apparaît à côté de la colonne existante dans cette ligne.
Note :
- Alors que les affichages sur ordinateur et tablette permettent à chaque ligne de contenir jusqu'à quatre colonnes, les sites Internet mobiles ne peuvent afficher au maximum que deux colonnes par ligne.
- Les colonnes ajoutées dans les vues de bureau ou de tablette occuperont toute la largeur de la page lors du passage à la vue mobile ; pour créer une ligne à deux colonnes dans la vue mobile, passez d’abord à la vue mobile, puis ajoutez un widget à deux colonnes.
Pour supprimer une colonne, cliquez avec le bouton droit n'importe où sur la colonne pour ouvrir le menu contextuel, puis cliquez sur Supprimer. Vous pouvez également cliquer sur la croix rouge (X) située en haut à droite de la colonne.
Vous pouvez placer les widgets directement dans les colonnes, ou structurer davantage la colonne en ajoutant des lignes internes.
Note :
Pour plus d'informations sur la modification et l'organisation des colonnes, consultez l'éditeur de colonnes.
Rangées intérieures
Les lignes internes offrent une plus grande flexibilité de conception en permettant d'ajouter des lignes à l'intérieur des colonnes. Grâce à elles, vous pouvez modifier la disposition des colonnes tout en conservant la conception générale de la ligne (par exemple, l'arrière-plan, l'espacement, le fond perdu).
Tout comme les lignes classiques, les lignes internes peuvent avoir leur propre arrière-plan et espacement, être divisées en quatre colonnes maximum et voir leur ordre modifié sur mobile. Les colonnes des lignes internes peuvent contenir n'importe quel widget, mais il est impossible d'ajouter des lignes internes à ces colonnes.
Pour ajouter une ligne interne à une colonne, procédez comme suit :
- Faites un clic droit sur la ligne, puis cliquez sur « Ajouter une ligne interne ». Si la ligne comporte plusieurs colonnes, choisissez celle à laquelle vous souhaitez ajouter les lignes internes.
- Cliquez avec le bouton droit sur la colonne, puis cliquez sur Ajouter une ligne interne.
- Faites un clic droit sur la ligne intérieure, puis cliquez sur Ajouter une ligne pour placer une ligne intérieure en dessous de la ligne actuelle.
Exemple de rangée intérieure
Pour illustrer l'utilisation des lignes internes, prenons deux exemples de conception d'une mise en page contenant un titre et trois boutons :
- Ajoutez deux lignes. Placez le titre sur la première ligne, sur une seule colonne. Divisez la deuxième ligne en trois colonnes. Placez un bouton dans chaque colonne.
- Deux rangées distinctes ne peuvent pas partager la même image de fond ; vous devez définir l'espacement et le style de fond perdu séparément pour chaque rangée.
- Ajoutez une ligne. Par défaut, chaque ligne contient une colonne. Ajoutez deux sous-lignes à la colonne. Placez le titre dans la première sous-ligne. Divisez la deuxième sous-ligne en trois colonnes. Placez un bouton dans chaque colonne.
-
Ces deux rangées intérieures partageront le même arrière-plan, le même espacement et le même fond perdu que la rangée principale.
-
Voici quelques points importants à prendre en compte lors de la modification des lignes internes :
- Vous pouvez uniquement utiliser les flèches de changement d'ordre pour modifier l'ordre des lignes internes. Pour modifier l'ordre des widgets et des lignes internes, vous devez faire glisser manuellement les widgets au-dessus ou en dessous de la ligne interne.
- Les widgets à 2, 3 ou 4 colonnes ne peuvent pas être placés dans les lignes internes. Pour ajouter une colonne, cliquez avec le bouton droit sur la ligne et sélectionnez « Ajouter une colonne ».
- Contrairement aux lignes ordinaires, les lignes internes ne peuvent pas être copiées-collées.
Widgets
Les widgets contiennent le texte, les images, les boutons et autres contenus de votre site.
Pour ajouter des widgets à votre site :
- Dans le panneau de gauche, cliquez sur Widgets.
- Recherchez le widget souhaité, puis faites-le glisser et déposez-le sur votre site.
Pour supprimer un widget de votre site, faites un clic droit n'importe où sur le widget pour ouvrir le menu contextuel, puis cliquez sur Supprimer. Vous pouvez également cliquer sur la croix rouge (X) située en haut à droite du widget.
Pour disposer des widgets côte à côte, faites glisser un widget sur votre site, ajoutez une colonne à la ligne où il se trouve, puis faites glisser un autre widget dans cette colonne. Vous pouvez également faire glisser le widget à deux colonnes sur votre site, puis faire glisser les widgets dans chaque colonne.
Alignement automatique
Lors du redimensionnement de widgets au sein d'une même colonne, Guesty Sites Internet tente de les aligner automatiquement pour qu'ils aient exactement la même taille. Pendant le redimensionnement, Guesty Sites Internet se déplace légèrement vers l'avant ou l'arrière pour s'aligner correctement. Cela devrait faciliter l'obtention de widgets de taille parfaitement similaire.
Alignement sur la grille
La fonction « Aligner sur la grille » vous permet de disposer les widgets sur les pages de votre site avec une précision professionnelle. Ce système vous permet d'aligner les widgets horizontalement et verticalement dans les colonnes et les lignes. Des règles s'affichent lorsque vous déplacez un élément sur sa ligne ou sa colonne, ou lorsque vous redimensionnez le widget. Les éléments alignés sont délimités par une bordure colorée. Un widget peut être aligné avec plusieurs autres widgets, selon le cas d'utilisation.
Note:
L'alignement est pris en charge dans les vues des trois appareils différents (ordinateur de bureau, tablette, mobile).
Pour plus d'informations sur l'ajout et la modification de widgets, consultez Ajouter des widgets et Modifier des widgets.
