Layout Editor Demo

 

The Layout Editor allows you to have the total control on your Virtual CMS.Let's suppose to create a new layout. From here you can choose if the new layout is for desktop or for mobile use and if is a section template or an article one.Then, just input the name of the new layout and click on the “create button”. The layout will be created instantly with already the top and the bottom inclusions that are mandatory.Now, from the right column we can add as many “layouts blocks" as we want. For example, we can add the header block just clicking on the “plus” button. The block will be automatically added in position. Then, clicking on the “pencil” icon we can enter inside the layout block and edit it. Going back to the layout, now it’s  time to add the content widgets, for example the article "preview full" widget and its stylesheet in the textarea below.Save.Now let's repeat the operation and add three “article medium preview” widgets in the top textarea and link their css into the second one.Save again.I will copy and paste, for example, the other css inclusions from an other layout.Save.Now we are ready to create a section from the panel using our brand new layout. From “create section” we can choose the name of it and apply the “section standard test” layout.Save.Finally it's the moment to see in the front end how our new section’s layout looks like.We can see the elements that we added from the layout editor interface: header, footer, one article preview full, and two article previews medium.let's suppose that we want to edit again and add something more to this layout, we just need to enter again in the interface and click, for example the “box preview auto slider”.Then, as we did before, link its css stylesheet. If we go back to the front end, we will see the new box preview auto slider just  below the medium previews. .Now you are ready to create or edit as many layouts as you want.