Présentation des rangées

Les rangées sont toujours divisées en colonnes, que ce soit une colonne ou six colonnes. Le choix du nombre de colonnes est vraiment un choix personnel qui dépend du contenu que vous désirez mettre à votre page.

Vous pourrez en tout temps modifier le nombre et la largeur de vos colonnes. Votre contenu s’adaptera aux nouvelles dimensions.

Explications des outils

  • Croix : La croix permet de déplacer une rangée ou une colonne.
    Une colonne peut être déplacée dans sa rangée ou dans une autre rangée.
    Une rangée peut être déplacée avant ou après une autre rangée, mais pas dans une rangée ou une colonne.
  • Clé à molette – La clé à molette permet de changer les paramètres.
    Plusieurs options peuvent être configurées, telles que la  couleur et les marges. Les options de paramètres seront expliquées en détail un peu plus loin dans l’article.
  • Double feuille à coins retourné  – La double feuille permet de faire une copie de la rangée.
    En cliquant sur l’icône, la rangée se copie et se rajoute à la suite. Les deux rangées sont éditables indépendamment l’une de l’autre.
  • Le X – Le X permet d’enlever la rangée.
    En cliquant sur le x, un message de vérification vous demande si vous désirez réellement enlever la rangée. Vous pouvez annuler ou accepter. Une fois accepté, vous ne pouvez pas changer d’idée.

Une rangée peut être créée à partir de l’onglet “Présentation des rangées” ou d’un “Élément”. Il faut cliquer, glisser et déposer à l’endroit désiré.

Lorsque l’on déplace une rangée, une colonne ou un élément, les lignes pointillées rouges indiquent les différentes rangées, tandis que les lignes bleues indiquent les colonnes. Si vous désirez créer une rangée complètement éditable indépendamment des autres, il faut la déplacer à l’extérieur des pointillés.

Paramètres de rangée (clé à molette)

Style

  • Largeur : Une rangée en pleine largeur couvre l’ensemble de l’écran d’un côté à l’autre. Une rangée fixe aura la largeur maximale définie dans les paramètres du thème choisi.
  • Hauteur : Une rangée en pleine hauteur remplira la totalité de votre navigateur de haut en bas, tandis que la hauteur par défaut s’ajustera au contenu.
Couleurs
  • Couleur du texte : Choisissez la couleur désirée à partir du sélecteur, ou à partir d’une couleur sauvegardée. Si vous choisissez une nouvelle couleur, vous pouvez la sauvegarder pour usage futur à l’aide du signe “+”. Tout le texte de la rangée utilisera la couleur choisie. Si vous ne choisissez pas de couleur, le texte sera de la couleur définie par le thème choisi.
  • Couleur de lien :  Choisissez la couleur désirée à partir du sélecteur, ou à partir d’une couleur sauvegardée. Si vous choisissez une nouvelle couleur, vous pouvez la sauvegarder pour usage futur à l’aide du signe “+”. Tous les liens de la rangée utiliseront la couleur choisie.
  • Couleur lors de survol de lien : Choisissez la couleur désirée à partir du sélecteur, ou à partir d’une couleur sauvegardée. Si vous choisissez une nouvelle couleur, vous pouvez la sauvegarder pour usage futur à l’aide du signe “+”. Tous les liens de la rangée utiliseront la couleur choisie lorsque l’on passera au-dessus avec le curseur.
  • Couleur de l’en-tête : Choisissez la couleur désirée à partir du sélecteur, ou à partir d’une couleur sauvegardée. Si vous choisissez une nouvelle couleur, vous pouvez la sauvegarder pour usage futur à l’aide du signe “+”. Certains éléments ont des titres, si vous choisissez une couleur, les titres auront cette couleur, mais le reste du texte conservera la couleur choisie précédemment.
Arrière-Plan
  • Aucun : Le fond de la rangée sera de la couleur définie par le thème
  • Couleur : Choisissez la couleur désirée à partir du sélecteur, ou à partir d’une couleur sauvegardée. Si vous choisissez une nouvelle couleur, vous pouvez la sauvegarder pour usage futur à l’aide du signe “+”. Ensuite, vous pouvez choisir l’opacité de la couleur.
  • Photo : Choisissez la photo que vous désirez mettre, à partir de votre bibliothèque ou d’une nouvelle image choisi sur votre ordinateur.
    Configurez les différents points :
    Répéter : Répétition s’applique à la façon dont l’image doit s’afficher à l’arrière-plan. La sélection “Aucune” affichera l’image téléchargée telle quelle. “Mosaïque” répétera l’image autant de fois que nécessaire afin de remplir la rangée horizontalement et verticalement. Vous pouvez également spécifier que l’image ne se répète qu’horizontalement ou verticalement.
    Position : Définis l’emplacement de la photo mise en arrière-plan. Choisissez l’emplacement qui convient le mieux à votre image.
    Fixation : Fixation spécifiera comment l’image réagit quand on déroule la page. Quand “Dérouler” est sélectionné, l’image déroule lorsque la page déroule. C’est le réglage par défaut. “Fixe” permettra à l’image de dérouler à l’intérieur de l’arrière-plan de la rangée si “Remplissage” est sélectionné dans le réglage de la mise à l’échelle.
    Mise à l’échelle : Aucune, Ajustement ou Remplissage
  • Vidéo : Ajouter une vidéo MP4 ou WebM et choisissez l’image par défaut qui sera visible avant que la vidéo ne joue.
  • Diaporama : Un diaporama est une suite d’images qui s’alternent.
    Configurez les différents éléments :
    Origine : Choisir “Médiathèque”
    Photos : Sélectionner les photos voulues. Cliquez sur les images, ensuite sur “Ajouter à la Galerie”. Vous pouvez ajuster l’ordre des images en cliquant sur le bouton “Inverser l’ordre” ou en cliquant et glissant les images. Cliquez ensuite sur ” Mettre à jour la Galerie”.
    Vitesse : Choisissez la vitesse à laquelle vous désirez que les images s’alternent.
    Transition : Choisissez la façon dont vous désirez que vos images s’affichent. Vous avez 11 choix différents, essayez-les pour choisir celui qui vous convient le mieux.
    Photos en mode aléatoire : En sélectionnant “non”, vos images s’afficheront telles que vous les avez ordonnées. En sélectionnant “oui”, vos images s’afficheront de façon aléatoire.
  • Parallaxe : C’est un effet qui permet à l’image d’arrière-plan de défiler à une vitesse différente des éléments en surface.
    Choisissez une photo et configurez sa vitesse.
Pour Photo, Vidéo, Diaporama et Parallaxe, vous pouvez aussi configurer une couleur de fond au cas ou vos images ne seraient pas de la bonne taille. Vous pouvez aussi ajouter une couleur de superposition avec une transparence pour créer un filtre de couleur.
  • Bordure : Permets d’ajouter un contour à votre rangée. Cela permet d’attirer l’attention sur un point ou de délimiter certains contenus.
    Configurez les différents points :
    Type :
    Aucune, Continue, Tirets, Pointillée, Double
    Couleur : Choisissez la couleur désirée à partir du sélecteur, ou à partir d’une couleur sauvegardée. Si vous choisissez une nouvelle couleur, vous pouvez la sauvegarder pour usage futur à l’aide du signe “+”.
    Opacité : Choisissez l’opacité, si votre fond n’est pas blanc, vous le verrez au travers de la bordure selon l’opacité choisie.
    Épaisseur : Du haut, du bas, de gauche, de droite, les quatre côtés sont configurables indépendamment l’un de l’autre.
N’oubliez surtout pas de sauvegarder vos changements.

Avancé

  • Marges: Du haut, du bas, de gauche, de droite, les quatre côtés sont configurables indépendamment l’un de l’autre.
    Extérieures : L’ajustement des marges extérieures permet de créer des espaces entre les différentes rangées et de modifier la largeur d’affichage indépendamment des configurations du thème.
    Intérieures : L’ajustement des marges intérieures permet de créer un espace entre les limites des rangées et ses colonnes et éléments.
  • Présentation adaptative
    La présentation adaptative permet de contrôler l’affichage d’une rangée selon le type d’appareil à partir duquel on accède au site.
  • Sélecteur CSS
    Permets d’associer la rangée à un code CSS spécifique. Configurer l’ID ou la Classe selon votre besoin.
N’oubliez surtout pas de sauvegarder vos changements.