Blocks

What Are Blocks?

In a website layout, a block is a ready-made section that you can use to build your website, such as a banner, footer, pricing, or contacts section.

Using blocks, you don't have to add every single button, icon, photo, or menu option to your webpage by hand. These larger building blocks of a webpage layout, common to all websites, are preconfigured for you. Select your header, footer, banner, or menu from the library of ready-made blocks, drag-and-drop it onto an available placeholder and modify it to suit your needs.

Adding Blocks

You can access the library of ready-made blocks from the left-hand sidebar: Click BUILD and switch to the BLOCKS tab.

Drag the block from the BLOCKS library:

Drop it onto one of the available placeholders, which are highlighted in red when you drag the selected block over them.

A block consists of a set of configurable elements (buttons, icons, photos, text items, forms) called Features in the Site Editor.

Click or select a feature to display the menu to modify the item.

Moving Blocks

To move a block, hover over it with the mouse cursor and click Move in the right-hand floating sidebar that appears.

In the MOVE BLOCKS panel that appears to the right, click the block and drag-and-drop it into the correct location.

After moving the block, give a focus to the site by clicking the site area or the x in the right-hand corner of the MOVE BLOCKS panel.

Resizing Blocks

To resize a block, hover over it with the mouse cursor and click the resizing control that appears at the very bottom of the block.

Drag the resizing control upwards or downwards to resize the block. The resizing control displays the height of the padding on either side of the block.

When resizing is done, drop the control to save the change and stop resizing.

Deleting Blocks

To delete a block, hover over it with the mouse cursor and click Delete in the right-hand floating sidebar that appears.

The block will immediately disappear.

Duplicating Blocks

To duplicate a block, hover over it with the mouse cursor and click Duplicate in the right-hand floating sidebar.

The duplicated block will immediately appear below the original block.

Modify Settings of a Block

To modify the layout and design of a block, hover over it with the mouse cursor and click the Settings icon in the right-hand floating sidebar: