Visit our website: https://www.nicepage.com
Read more at https://nicepage.com/doc/article/1318/video-tutorials
Subscribe to find more information:
In this demo we will demonstrate features of Nicepage Website Builder using the Nicepage Joomla extension.
Download Plugin. Uploading Plugin. After the installation, the Nicepage Item appears in the Joomla top menu. Add a new page from the Nicepage Menu - New page.
Add Web Pages
There are three main ways to add pages: blank, builders. design-made templates.
All modern websites and themes have the Global Settings including the Color settings, the Font settings, and the Typography.
Working With Sections
Nicepage allows using the pre-designed sections, as well as building sections using the Builder and from scratch. Let’s Add a New Section.
In the Add Section dialog click the Builder. For the section you can search images online, use images from any social accounts or your local folder. Drag images from your local folder. Select images for the section. Select required texts for the section. Then select a style from the generated variants. And, finally, add this section to your Article.
Building from Articles and Products. The same way, we will add sections auto-generated from the Joomla Articles aтв Products. Switch to Posts tab. Select Article images. Select Article Texts. Select a design.
Starting from Blank. Let’s assume that you need your own idea for a section, a mock-up that you drew in any graphic editor, for example, Adobe Photoshop.
Add Menu. All added controls are located in the Add Menu to the top. In the Add Menu we see Containers, Basic Controls and Functional Controls.
Using Grids. To create this section we need to add a grid to which we will add the texts and images. Select “Grid” and add it to the section.
Replacing Images. Images are changed by dragging and dropping an image from the folder or the desktop into the section.
Highlighting. While dragging containers, cells are highlighted with borders. Also there is a tip above the Destination Container, and it is always clear, where the moved control is located.
To copy a cell or a control, drag the source holding the CONTROL key. To remove a control or all the content in the cell, select the cell, then press the DELETE key.
Start with an Icon, the most commonly used element in the text group design. Let’s add an icon to the cell. Click the “Add”, and select the “Icon”.
Add a Heading. Modify the Heading typing a new text. Add text. Select a part of the text and make it Bold and Italic. Select another part of the text and add a Hyperlink.
Add Button using the alternative way, by clicking the Plus to the right top of the cell.
Alignment and consistency are the important design principles. Moving controls again we see the guiding magnets and sizes, which help to follow those principles.
You can move the Heading, Icon, Text — any element, into the Section above the Grid and into another Cell.
Click the Add menu - Joomla Position. Expand the widget area to the Sheet. Enter the position name into the Position field.
No modern design is complete if shown incorrectly on all modern devices, including mobile ones. The Article made in Nicepage is fully responsive and convenient for reading. In addition, for all Responsive Modes all editing features are supported.
In Joomla Admin open Content - Articles - created Article. As you see, the Article looks differently not like is was designed in Nicepage. To show the Article correctly, select the Nicepage template with the Joomla Header and the Footer.
Edit in Nicepage.
In the Article screen in the admin we see the Nicepage Editor button. Clicking this button launches Nicepage for this Joomla Article. Click the Preview.
You see that working in Nicepage is simple like in Microsoft PowerPoint or Apple KeyNote. The output you get is the clean code and fully responsive HTML.
We hope you have enjoyed this introduction to Nicepage Website Editor for Joomla.