DIVI (YOUR CMS) BASICS
Divi is a unique theme in our collection. Differing from every other Elegant Theme, Divi is built on a page builder platform that we designed and developed from the ground up. Using Divi’s drag and drop builder you can create beautiful layouts with ease and control over every part of your site.
The builder uses three main building blocks: Sections, Rows, and Modules. Using these things in unison allows you to create a countless amount of page layouts. The basic hierarchy of these elements is as follows:
The most basic and largest building blocks used in designing layouts with Divi are sections. These are used to create large groups of content, and they are the first thing you add to your page. There are three types of sections: Regular, Specialty and Full Width. Regular sections are made up of rows of columns while Full Width Sections are made up of full width modules that expand the entire width of the screen. Specialty sections allow for more advanced sidebar layouts.
Rows sit inside of sections and you can place any number of rows inside a section. There are many different column types to choose from. Once you define a column structure for your row, you can then place modules into a desired column. There is no limit to the number of modules you can place within a column.
Modules are the content elements that make up your website. Every module that Divi has can fit into any column width and they are all fully responsive.
WHAT IS THE DIVI LIBRARY?
The Divi Library is your ultimate web design toolkit. Here you can store your favorite layouts, sections, rows or modules for later use. Whenever you save an item to your Divi Library, you can access it easily from within the modal window when adding a new layout, module, section or row to the page. Save yourself hours of design time by creating collections of your favorite module combinations. Why not save all of those customized modules to your Library so that you can use them in the future without having to re-create them!
The Divi Library is more than just a collection of saved layouts. Each library item can also be made “Global.” Global modules are synced and mirrored wherever they are placed. Whenever a Global module is altered, it updates automatically on all of the pages you have added it to! In this sense, Divi becomes more than just a page builder, it becomes a website builder. For example, you could create a Global section that is added to the footer of every page on your site. Update that Global Section once and have the footer of your entire website updated instantly.
Modules in the library can also have their settings selectively synced. For example, if you have customized a module heavily using the Advanced Design and Custom CSS tabs, you can save the module to the library while only saving the settings in these two areas. If this module is made Global, your Advanced Design and Custom CSS settings will be synced, but the General Settings (containing your module content) can be different on each page the module is used on.
- We have has populated the Divi library with all of the saved layouts you’ll see on the Layouts page. Always reference that page for design setting and stylings that have been pre-populated specifically for your design.
- To add these to a page, you can simply copy from the Layouts Page and paste to the page you are creating/editing. You can also use the “+Add from library” found under any section and load the saved section from the Divi Library.
***TIP! You can copy (CTRL+C) and paste (CTRL+V) in Divi! It’s great to have the Layouts page open, so you can copy an entire section (rows & modules included) and paste where applicable on your open page.
QUICK ACCESS TO DIVI BUILDER FUNCTIONS
Whenever you right-click on something inside the Divi Builder, whether it be a Module, Row or Section, you will get a list of different actions that can be performed. These actions include: Rename, Save to Library, Undo & Redo, Disable, Lock, Collapse & Expand, Copy & Paste. You may be familiar with many of these functions already, and they have been added to the Right-Click controls for your convenience! This way you don’t have to dig into the module settings to access commonly-used features. Some of the functions, however, are unique to Right-Click, and are only available when right clicking. These include: Copy, Paste, Lock, Collapse and Disable.
COPY & PASTE
Copying and Pasting is another function that is only available via Divi’s right click controls. You can copy and module, row or section from one area, and then paste it into another area. You can even copy and paste items from one page onto another page. This can save you a tone of time, and it can often be much more convenient than saving items to the library (especially when you only want to re-use that item on a new page once).
The preview option has recently been removed from the Right-Click options. Now, at the top of the divi builder you will see icons for desktop/tablet/mobile. By clicking on these you will get a preview of the front end visual of this page at that breakpoint. You can return to the wireframe view by clicking the icon again or clicking on the far left icon (wireframe view). Remember, you will still need to save or publish the page before viewing any changes on the font end. Remember, do not leave this page until you have saved or published.
You can rename any Module, Row or Section by double clicking on the “text (module name), row, section” and typing in the new name. This name appears in the builder only for administrative use, and it can be used to identify the item on the page. When editing big pages, this can help you organize elements within the builder. For example, if you have 20 different text modules on the page, you might want to give each of them a name so that you know what they are before opening up their settings window.
SAVE TO LIBRARY
The option to save an element to the Divi Library has been added to Divi’s right click controls for convenience. Using this feature you can save items to the library without having to open up the relevant settings box.
UNDO & REDO
Any action you take within the Divi Builder can be undone, and any undo can also be re-done. Undo & Redo controls, which are also available using the undo and redo button at the top of the Divi Builder interface, can also be accessed when right clicking.
DISABLE / ENABLE
Disabling is an option that is available via Divi’s right click controls. Any Module, Row or Section can be disabled. Once an item is disabled, it will no longer appear on the page on the front-end of your website. However, the item will remain active inside the Divi Builder interface. Disabling is a way to remove things from the front-end without actually deleting them in the builder. They can then be re-enabled in the future. Items that have been disabled appear at 50% opacity within the builder to signify that they have been disabled. You can still edit the content and preview it (shown at 50%) before enabling it and republishing
Do you need more help?
Should you need further assistance, you can find specific instructions on the Divi Theme Documentation Website
If you cannot find your answer, submit a ticket to the Orbit Support team for assistance.