Understanding the Control Panel



MODULES SHOWCASE (blue area): 

Here you can find all available modules to use when building your pages or portfolios. By default Assembly comes with several modules spread across 3 main tabs: Layout, Media and Elements, however modules are extendable as well as tabs.

Drag and drop any module to the “Building Stage” to begin assembling your page. Modules can be categorized by type, there are three possible types:

– Parent: Basic containers of other certain type of modules, they actually need offspring to be able to operate in the front-end. E.g.: “Container” is parent of “Column”, “Title”, “Image”, and some more.

– Child: They are dependent of one or more specific type of modules; their parents. Children require a parent to be placed in. They can be placed hierarchically one level deep. E.g.: “Column” requires a “Container” or “Header” module.

– Hybrid: They act like “Child” modules so they can be placed inside “Parent” modules, but they also have the ability to operate as a standalone module and be placed in the root level. E.g.: “Title” modules can be placed in both “Container” modules and at root level.


PAGE SETTINGS (red area):

This button will open up the page settings popup, in which you can setup several options for the current page your are in. A more detailed explanation of how to use “Settings Popups” may be found latter in this documentation.

“Page Settings” button

The “Page” tab includes the settings available for customizing the looking of the current page. As an example, in this case “Page Layout” can be setup to be boxed or full width, and so on.

These buttons will enable you to change the current scope to a different responsive mode, as you can see in the picture there are four buttons one for each responsive modes which are: Desktop, Tablet, Landscape Mobile and Portrait Mobile.

When activating any of those modes any change you make to any responsive setting or module size within the current page will take effect only for that responsive mode.


SAVE BUTTON (green area):

This button will save the current page in a very fast manner via AJAX, so you don’t have to wait for the page to reload every time you want to do an amendment to your page, this will save you very much time, as any change you do will take literally, a couple or three seconds to be saved (it is subject to server performance) and ready to test in the front-end.