1. To start using the Visual Builder (Divi Builder) you must enter the website with your administrator account. After this, navigate to the page you want to edit on your website and click on the link in the top administration bar that says “Enable Visual Builder”
2. You will notice that when you position the cursor on the elements of the page, some icons are activated to move, edit, clone, and delete. For this example, we will click the configuration icon of the “Place your order” button.
3. Next, you will see the configuration panel of the selected element, where you can edit all its properties. In this example, we are going to edit the button text to say “Place your order now”. For the changes to take effect you must click on the bottom button that says “Done”.
4. You can edit the text of the page in 2 ways: by clicking on the element’s configuration panel or by double-clicking on any text on the page. This will become immediately editable, allowing us to change the heading to “Bake With Much Love”.
5. To save the changes you must click on the icon of the 3 dots that are located in the center of the footer. Then click “Save” in the lower right corner of the page.
6. To add an element, place the cursor on the element closest to the place where you want to add it. Click on the “Add new module” icon and you will see a list of all the visual components of Divi that you can insert. For this example, we will use the Button element.
7. Then click on the Element Design tab to align it to the center. In the Content tab, you can modify the text for what you want the button to say.
8. Click on the green “Done” button, then on the purple one that says “Save” and, finally, on the link in the top administration bar under “Exit Visual Builder”.
9. Now you can see all the changes made and verify that they are saved correctly.
For more tutorials related to Divi and its visual builder:
https://www.elegantthemes.com/documentation/divi/visual-builder/
0 Comments