LESSON 03

Sections.

Sections are large containers which act as the building blocks of each page. By default, they span the width of the browser, and you can set the height as you wish. 

Adding sections.

You can have as many sections as you want on each page. Add an empty section by selecting a section and clicking the + icon. You can also choose from tons of pre-designed sections inside the Add panel.

Moving sections.

To reorder sections, select a section and from the 3 dots on the floating action bar, choose Move Up or Move Down. You can also reorder sections from the Layers panel. 

Background colors.

Also from the floating action bar, click the Design icon to change the background color of your section.

Duplicating sections.

You can duplicate a section to use the same design somewhere else on the page. Select the section, then from floating action bar, click the 3 dots and choose Duplicate.

Vertical sections.

You can turn any horizontal section into a vertical section. Select the section and from the 3 dots, click Flip to Vertical. You can also add a full length vertical section by selecting Page from the breadcrumbs, and clicking the + icon on either side. 

TRY IT YOURSELF

Exercise on sections.

​Open Academy X from desktop to complete this exercise.

01

Duplicate a section. Select the black section and from the floating action bar, click the 3 dots, then select Duplicate.

02

Change the background color. Select the duplicated section and click Change Design. Make the background color white.

03

Move a section. Select the white section and from the floating action bar, click the 3 dots, then select Move Down.

04

Flip a section to vertical. Select the purple section and from the floating action bar, click the 3 dots, then select Flip to Vertical.

Watch related videos.

Editor X

The rest is up to you.