Getting started with Nilead Visual Editor
The Visual Editor allows you to create, update layouts and content without touching the code (unless you want to).
It's important to understand how layouts work on Nilead Platform first to utilize the Visual Editor effectively:
Theme
Themes in Nilead are sets of layouts/views. Themes are usually used on the application level, for example we are currently using a theme named Onyx for your backend application (where you control all your website data and such).
By using themes, it's possible to have completely different views for multiple devices, environments, or even languages and users. The later is not yet supported but theme gives us such possibility if we decide that we need it.
NOTE At the moment, you do not have to worry about the concept of theme since it's used internally only.
Page
There may be one or more pages on your website. Examples include the home page, promotion (landing) page, contact page, about page, services page, blog page, etc.
Pages can be static or dynamic. The dynamic pages are those that use data feeds from Collections to generate their content. For example, if you have 1,000 products, you only need one dynamic product page. Depending on which product is being rendered, the corresponding information will appear.
Style
When styling your website, you will want the same style to be used across different layouts to create a consistent branding image. You could, for example, maintain the same fonts, colors, or spacing across all your layouts.
By using Nilead's style concept, you can easily apply the same style to all your layouts, or you can create different styles and apply them to each layout individually. Style allows you to easily update your brand identity in the future. It takes less than a minute to update a heading's font-family with a style, instead of editing each one individually.
Layout
Whenever you create a page, whether static or dynamic, it is empty. For that specific page, you must create at least one layout. Layouts are used to display content on a page. Moreover, you can apply any style to a layout to ensure consistent styling across your layouts.
Widget
Nilead Platform layouts are composed of smaller elements called widgets. Widgets are usually simple HTML elements (paragraphs, sections, links, buttons, etc.).
The widgets can be easily re-used, rearranged, added, and deleted. Using these widgets, we can create an unlimited number of layout variations to suit any business need.
In order to make it easier to reuse widgets, we have created components, which are pre-styled and pre-configured widget groups. The sophisticated carousel slider found on many websites is a good example of a component.
NOTE Internally, widgets are built from template files and assets such as images, stylesheets, javascripts, etc... You can override and edit these files but it's not recommended to do so.
In Nilead template files are written in Twig language.
Visual Editor
When you want to edit certain part of your layout, lets say you want to edit the content on your homepage's banner, you have to locate the exact widget(s) that makes up that part and edit its configurations. The Visual Editor gives you an easy way (point and click) to quickly edit the exact widget configurations.
Instruction
We have created a video to show you an overview of the Visual Editor:
and how to navigate it:
