Outils d'accessibilité

Utiliser les lignes et les colonnes pour faire une mise en page


  • Connectez-vous à l'espace d'administration du site.

RAPPEL : si vous ne savez plus comment vous connecter à l'espace d'administration de votre site, cliquez ici

  • Rendez-vous sur la page à modifier et passez en mode édition.

RAPPEL : si vous ne savez plus comment passer en mode édition, cliquez ici

  • Pour consulter les informations essentielles de prise en main sur les lignes et les colonnes, cliquez ici.

SOMMAIRE :

  1. Insérer une ligne
  2. Insérer une ou plusieurs colonnes / modifier le nombre de colonnes sur une ligne
  3. Les outils d'une ligne : modifier, supprimer, masquer, dupliquer,...
  4. Les outils d'une colonne : modifier, supprimer, masquer,...
  5. Les options d'une ligne
  6. Les options d'une colonne

1. Insérer une ligne

  • Cliquez sur le bouton + à l'endroit ou vous souhaitez l'insérer, puis sélectionnez le nombre de colonnes souhaitées :

builder insert line

  • Cliquez sur le bouton SAVE en bas à gauche pour sauvegarder les modifications.

2. Insérer une ou plusieurs colonnes / modifier le nombre de colonnes sur une ligne

  • Dans les options de la ligne, cliquez sur le bouton permettant de réorganiser les colonnes de ladite ligne : vous pourrez contrôler le nombre de colonnes à utiliser sur la  ligne en sélectionnant les valeurs prédéfinies ou en saisissant votre propre combinaison :

builder insert col

  • Cliquez sur le bouton SAVE en bas à gauche pour sauvegarder les modifications.

3. Les outils d'une ligne : modifier, supprimer, dupliquer,...

  • (1) : permet de déplacer la ligne vers le haut ou vers le bas.
  • (2) : permet de modifier le nombre de colonnes dans la ligne.
  • (3) : permet d'accéder aux options de la ligne.
  • (4) : permet de dupliquer la ligne.
  • (5) : permet de sauvegarder la ligne comme modèle afin de la réutiliser plus tard sur n'importe quelle page.
  • (6) : permet de copier la ligne.
  • (7) : permet de coller la ligne (dans une nouvelle ligne vide).
  • (8) : permet de masquer la ligne (elle ne sera pas visible sur le site par les visiteurs).
  • (9) : permet de supprimer la ligne.
  • (10) : permet d'ajouter une nouvelle ligne.

builder line options


4. Les outils d'une colonne : modifier, supprimer, masquer,...

Pour accéder au outils d'une colonne, 2 possibilités :

  • Si la ligne est vide : faites un clic droit sur la ligne dans le rectangle en pointillés (1), puis tout en bas cliquez sur Column (2) :
    • (3) : permet de déplacer la colonne.
    • (4) : permet d'accéder aux options de la colonne.
    • (5) : permet de masquer la colonne (elle ne sera pas visible sur le site par les visiteurs).
    • (6) : permet de supprimer la colonne.
    • (7) : permet d'ajouter une ligne dans la colonne.
      builder col tools1
  • Si la ligne n'est pas vide : cliquez sur l'icône en forme de colonne double (1) dans l'angle supérieur droit d'un module (Addon) :
    • (2) : permet de déplacer la colonne.
    • (3) : permet d'accéder aux options de la colonne.
    • (4) : permet d'ajouter une ligne dans la colonne.
    • (5) : permet de masquer la colonne (elle ne sera pas visible sur le site par les visiteurs).
    • (6) : permet de supprimer la colonne.

builder col tools2


5. Les options d'une ligne

  • Cliquez sur l'icône en forme d'outils dans l'angle supérieur gauche de la ligne
  • Les options de la ligne d'affichent alors dans la partie gauche de l'écran.

builder line options

  • Les options de la ligne se divisent en 3 parties :
    • L'onglet Général permet de gérer les réglages suivants :
      • Le titre de la ligne (appellée également section) : des options de mise en forme apparaissent automatiquement dès qu'un titre est saisit.
      • Le sous-titre de la ligne (appellée également section) : des options de mise en forme apparaissent automatiquement dès qu'un sous-titre est saisit.
      • La position du sous-titre.
      • L'alignement du contenu de la ligne.
      • La largeur du conteneur (qui englobe la ligne) et l'espacement entre chaque colonnes de la ligne.
    • L'onglet Style permet de gérer les réglages suivants :
      • La hauteur de la ligne.
      • La largeur de la ligne.
      • Les marges internes et externes de la ligne.
      • L'arrière plan de la ligne : mettre une image, une couleur ou un dégradé.
      • La bordure de la ligne.
      • Ajouter des ombres portées à la ligne.
      • Ajouter une forme haute ou basse à a ligne.
      • Masquer la ligne sur téléphone portable, tablette ou ordinateur (un tutoriel spécifique pour les ajustements mobiles est accessible en cliquant ici).
    • L'onglet Animation permet de gérer les réglages suivants :
      • L'animation de la ligne : à choisir parmis une liste prédéfinies.
      • La durée et le retard de ladite animation.

builder line options details


6. Les options d'une colonne

  • Pour accéder au options d'une colonne, 2 possibilités :
    • Si la ligne est vide : faites un clic droit sur la ligne dans le rectangle en pointillés, puis cliquez sur Column en bas, puis sur Options.
    • Les options de la colonne d'affichent alors dans la partie gauche de l'écran.

      builder col option1
    • Si la ligne n'est pas vide : cliquez sur l'icône en forme de colonne double dans l'angle supérieur droit d'un module (Addon), puis cliquez sur Options de la colonne.
    • Les options de la colonne d'affichent alors dans la partie gauche de l'écran.

      builder col option2
  • Les options de la colonne se divisent en 4 parties : 
    • L'onglet Général permet de régler l'alignement des éléments contenus dans la colonne.
    • L'onglet Style permet de gérer les réglages suivants :
      • La hauteur de la colonne.
      • L'arrière plan de la colonne : mettre une image, une couleur ou un dégradé.
      • Les marges internes et externes de la colonne.
      • La bordure de la colonne.
      • Ajouter des ombres portées à la colonne.
    • L'onglet Responsive permet de gérer les réglages suivants (un tutoriel spécifique pour les ajustements mobiles est accessible en cliquant ici) :
      • Dimensions des colonnes pour le mobile.
      • Ordre d'affichage des colonnes pour le mobile.
      • Masquer la colonne sur téléphone portable, tablette ou ordinateur
    • L'onglet Animation permet de gérer les réglages suivants :
      • L'animation de la ligne : à choisir parmis une liste prédéfinies.
      • La durée et le retard de ladite animation.

builder col options details


Liens utiles

Suivez-nous

sur les réseaux sociaux

logo du réseau social facebook
logo du réseau social linkedin
logo du réseau social linkedin
5 out of 5 stars
Nombre d'avis : 28
Sauvegarder
Choix utilisateur pour les Cookies
Nous utilisons des cookies afin de vous proposer les meilleurs services possibles. Si vous déclinez l'utilisation de ces cookies, le site web pourrait ne pas fonctionner correctement.
Tout accepter
Tout décliner
En savoir plus
Functional
Outils utilisés pour vous apporter des fonctionnalités lors de votre navigation, cela peut inclure des fonctions de réseaux sociaux.
Cloudflare
Accepter
Décliner
Analytics
Outils utilisés pour analyser les données de navigation et mesurer l'efficacité du site internet afin de comprendre son fonctionnement.
Google Analytics
Accepter
Décliner