Basic concepts

This page is an overview of how to use the plugin, the basic concepts which will help you to use Builderius more efficiently.

Builder panel

When loaded the page in the builder mode you should see a small logo icon on the left edge of the screen. This icon opens the builder panel (Panel) where you can get access to all the settings of the builder, possibility to add new modules, drag'n'drop them, save changes etc.

Builder panel

Adding modules/layouts

In the builder panel there are buttons + Module/+ Layout that opens a new panel page with modules/layouts which can be added to the page. These buttons add items to the root of the Modules Tree. At the moment only Row can be added to the root of the Modules Tree.

There are modules-containers - Row and Column - which can host another modules. Hovering over Row/Column item in the Tree reveals additional management buttons:

  • + for adding modules/layouts into the targeted
  • hamburger icon for accessing settings/duplicating
  • trash bin icon for deleting the module

Module's settings

Hover over a Module's Tree item, then hover over hamburger icon to open a small overlay with two links Settings and Duplicate. Click on Settings link to enter the chosen module's settings tab of the Panel.

Nested modules

Row and Column modules are containers, so they can have children (nested) modules. At the moment only these two modules are containers!

Adding children modules can be achieved in two ways:

  1. by creating a new module inside Row/Column;
  2. by drag'n'drop operation, so existing module becomes children for Row or Column;

Option 1:

  • hover over a Module’s Tree item, then hover over + icon and choose what to add: module or container; click on either choice opens the panel page with all the items of teh chosen type available;
  • pick a certain item from the list and click on it;

The chosen module/layout will be added to the targeted module.

Option 2:

  • hover over a Module’s Tree item, specifically hover over vertical lines handler and start dragging the item;
  • drag the item over another module: if it is a non-container type of module the sort operation will be performed (the overlay below the item will tip if the dragging module will be added before or after the targeted one); if it is a container, then hovering over targeted container and waiting for ~2 seconds revels green hover overlay that says 'move';
  • release the module and it will be moved into the targeted container
Drag and drop modules

Save, commit, publish changes

In order to save changes made click on green diskette icon in the Panel, so Version Control System tab will be opened. Hover over master: HEAD graph item and click Save. This is called "saving without commiting". Use it when you want to save current progress.

In Version Control System tab hover over a graph item and click on Commit to create a kind of restoration point. Commits can be previewed and published. So, if you are ready to publish changes on the post/page and make them visible to everybody – create a commit and publish it. Commits are useful when you want to save for later any significant progress made. Later you can create a new branch from a certain commit which can be like an alternative version of your design.