Conteneur

Container widget

Le widget de conteneur vous permet d'ajouter des widgets supplémentaires dans un conteneur spécifique, également appelé bloc.

Ajouter un widget de conteneur à votre site web. Pour ajouter un conteneur, allez dans > Widgets et sélectionnez Conteneur

Une fois que vous avez positionné votre conteneur, de nombreuses options vous permettent de créer et de concevoir la section parfaite de votre page. Examinons de plus près les paramètres du conteneur. Vous trouverez ci-dessous :

  1. Paramètres de bloc

  2. Paramètres de colonne

  3. Onglet d'affichage de bloc

  4. Ajouter un bloc

À l'intérieur d'un conteneur, vous pouvez modifier :

  • Couleur de fond

  • Ajouter une vidéo

  • Dégradés

  • Superpositions

  • Diviseurs de forme

  • Points d'ancrage

Éléments du conteneur

Avant d'entrer dans les détails plus fins, examinons les principaux éléments du conteneur.

Comme pour n'importe quel conteneur/bloc, vous pouvez créer des divisions et plusieurs colonnes horizontales et verticales. L'image ci-dessous montre le conteneur/bloc divisé en 3 colonnes horizontales.

Pour effectuer cette action, passez simplement votre souris en haut du conteneur/bloc sélectionné. Un bouton apparaîtra, vous permettant de diviser le conteneur en jusqu'à 5 colonnes.

Note : Chaque colonne peut être redimensionnée à la largeur souhaitée. De plus, vous pouvez également ajouter des bordures et des couleurs différentes à chaque colonne.

Dans l'image ci-dessous, nous avons ajouté une couleur aux colonnes pour que vous puissiez voir visuellement ce que nous voulons dire.

Avant de continuer à expliquer comment utiliser les colonnes pour votre contenu, mentionnons que nous avons parlé de la création de colonnes verticales également.

Pour ajouter une nouvelle colonne qui peut être positionnée au-dessus ou en dessous des 3 colonnes que nous venons de créer, passez simplement votre souris sur la colonne que vous venez de créer et vous verrez une icône de plus +.

Cela ajoutera une nouvelle colonne au-dessus, par exemple.

Dans l'image ci-dessous, nous venons d'ajouter une nouvelle colonne au-dessus de la colonne que nous venons de créer précédemment. Cette fois-ci, nous avons créé une division de deux colonnes, blanc et noir à titre de référence.

Maintenant, nous avons un conteneur avec :

  • 2 colonnes

  • 3 colonnes

Colonne globale

Les colonnes globales vous aident à accélérer la conception lorsque vous souhaitez utiliser le même bloc sur plusieurs pages.

Avec les paramètres de colonne globale, vous pouvez effectuer des mises à jour en un seul endroit et les modifications affecteront toutes les colonnes ayant les mêmes informations de colonne globale.

Commencez par sélectionner la colonne que vous souhaitez rendre globale. Ensuite, accédez aux paramètres et sélectionnez "C'est une colonne globale".

Once selected you will see a drop down menu, if doing this for the first time you will only have one option to select from as shown below:

After you have selected that option, give you column a name and click save. Now your selected column is a global column. Again meaning that if you copy and paste this column to multiple pages on your website, when an edit it made the changes will show on all the other global columns you have selected.Displayed in the image below is the column we turned into a global column. No other columns here will be affected.

If you need to remove or rename the column you can do so be wither deselecting the option or clicking on the rename text.

Anchor points

Anchor points are sections of your website that you want to move your visitors to when they click a call to action button or link within text 'Anywhere you add a link'For example: If you have a button on your website that you want visitors to click to take them to a specific section on that page. When they take action, they will be taken straight to the section where the anchor point has been added.How to add an anchor point:Go to container settings > select anchor point > label your anchor point for future reference and lastly, where you have the call to action eg a button, add the anchor point link there.

Adding your anchor point from your call to actionSelect your originating call to action. In this case we will use a button.Select anchor point > then select what page/section or even funnel step where your anchor point is located. It will be labeled the same as you labelled it previously.Note you can have different anchor points across different devices 'Mobile and desktop' if required.If you cannot see you anchor point in the drop down menu, be sure that you have saved it. Then it will appear in the drop down menu.

Container additional settings

Within the container you can control:

  • Container delay

  • Hide/make container draft

  • Block/container positioning

Container delay works exactly the same as all widget delays: You are able to select a time frame when you want that entire container to display when someone visits your website.Hiding or making container draft will hide the entire container from the website visitors view.And finally, block/container positioning. This is a fast way to move your containers up and down your page.

Dernière mise à jour