Elements - Overview

Last updated on 2023-03-02

Through the page builder, you have access to a multitude of element options to display your content on your pages. These have been designed to allow for quick and easy management of your pages while displaying information in a clear and personalized manner.

When adding your element, a list of choices will be available to you:

Simply click on the element of your choice to add it to the section and configure it.

Using an existing element or creating a new element

When selecting your element, you must choose one of the following 2 options: Use an existing element or New.

Using an existing element allows you to reuse an element that has already been displayed elsewhere on the website.

By clicking on the existing element, you will use the exact same item. Thus, if it is modified in one place, the existing element will also be modified. This function is useful when you want to repeat information on multiple pages, since future modifications can be made in a single element, and all linked elements will be automatically updated.
By clicking on the Copy-paste icon, you will use the same configurations as that item, but it will be independent. Thus, if you modify your element, the existing element will not be modified. This function is useful when you want to reuse the appearance of an element while modifying its content.

Creating a new element allows you to set up an element from scratch. You must fill in all the fields and configure the element according to your needs. This function allows you to customize the element and gives you more flexibility.

Adding an element to a section

When the section is created, click on the + to select the element of your choice.
Click on the desired element.
Select 1 of the following 2 options:
- Use existing element
- New
Name your item well, as this name will allow you to identify it later in your content integration.
Fill in all the fields of your element (these differ depending on the element).
Save.

Your element is now visible on the website.

Editing an element in a section

Hovering over the element you want to edit will make the Element block appear at the top of the block.
In this block, locate the two icons: Edit or Delete.
Click on Edit. The element parameters will appear on the left side of the screen.
Modify the desired parameters.
When you are done, save.

Your element is now modified.

Deleting an element in a section

When hovering over the element you wish to modify, the Element block appears at the top of the block.
In this block, locate the two icons: Edit or Delete.
Click on Delete.
Confirm that this is the desired action.

Your element is now deleted from the section.

Moving an element

From the side menu, select the Move sections option .
Click on the element you want to move (elements will be identified by their name and position in the section) and drag the section to the desired location (using the drag and drop technique).
Save your changes.

Managing Element Settings

In creating your element, you will notice several available parameters.

Advanced

This parameter allows you to display the section in only one language. Thus, if you want to display your element only in French, you can check the corresponding box. By clicking Save, the section will be displayed in French and hidden in English.

If you want the section to appear in both languages, there is no need to specify it. Display in both languages is done by default, everywhere on the site.

Style

This parameter allows you to adjust certain visual elements of the element.

Using Background, you can:
- Choose a background color
- Add a background image
Using Padding, you can:
- Manage the padding of your element on different screen sizes: desktop, tablet, and mobile.
- Manage padding on the vertical and horizontal axes.
Using Animation, you can:
- Apply an animation to your element:
  - Fade
  - Slide down, up, left, or right
  - Scale up and down
- Manage the speed of an animation
Using Parallax, you can:
- Activate a parallax animation on an item
- Determine the speed of the parallax animation

Old versions

Old versions allow you to revert back to an earlier version of an element after making changes. This function will appear when 2 or more versions are available for this element.

Versions are identified by date. By clicking on the version, your page builder will display the earlier version. You can choose this version by clicking Use. After saving, the change will be effective on the website.

Parent container

The parent container represents the container in which the item is located. You can modify the visual aspects of this container via the Style tab. You can manage the same parameters as in the element, but these changes will apply to the container of the element.

3420