How To Manage Blocks in Website Builder

One of the Website Builder tools that will help you create your website is called a Block. Blocks on the website builder are the elements of your website page that contains the texts, design, media, etc. Each type of BLOCK is specific to what kind of content you want to put in. Below are the things that you can do on each BLOCK:

• Add a Website Block
• Remove a Website Block
• Select and Move a Block
• Clone a Website Block

Add a Website Block

This is useful if you want to insert something on your website that is not included in the Website Builder template you chose. Follow the steps below to add a website block:

1. Log in to your Website Builder editor.
2. On the Website Builder, click BUILD on the Side Menu, and then select BLOCKS.

3. Hover your cursor over to the type of BLOCK you want to add and choose a layout on the right.

4. Drag and drop the chosen block to the part of the webpage where you want to place it. The block will show on the part of the webpage where you put it. Modify it by following the guide on how to Customise a Website Block.

Remove a Website Block

Follow the steps below to remove a website block. This will remove all texts and images that are in it, from left to right.

1. On the Website Builder, go to the webpage that you want to edit.
2. Hover your cursor over to the website block that you want to remove.
3. Click the [X] button on the right-most side to Delete. That part of the webpage will disappear and the next block below it will automatically replace it.

Select and Move a Block

The steps below will guide you on how to select and move a block within the webpage.

1. Select the website block by hovering your cursor to that part on the webpage.
2. Click the arrow cross icon on the right-most side to Move.

3. The MOVE BLOCKS window will appear on the right. Arrange the blocks by dragging and dropping them to your desired arrangement.

4. The rearrangement takes effect right away. Close the MOVE BLOCKS window and publish the website to apply the changes publicly.

Clone a Website Block

Cloning a website block is helpful if you want to have the same style of website block on any other part of your website. This can be done for the same webpage or on a different one.

1. Select the website block by hovering your cursor to that part on the webpage.
2. If you want to add the duplicate on the same webpage, click the copy icon to Duplicate. This duplicates the same website block right below it. Move the block if necessary. But if you want to put the same website block on another webpage, click on the download icon to Save Block.

3. Add the website block to the webpage where you want to put it and access it from Saved Blocks. Make the necessary changes to the duplicate block. Learn how by reading the guide How to Customise a Website Block.

Website Builder is a platform that allows you to create powerful websites without the need for any technical background, or hiring a developer for that matter. With >Website Builder, you are given access to easily customisable templates, a drag-and-drop editor, a mobile editor, and a quick-setup social media integration.

One of the Website Builder tools that will help you create your website is called a Block.

What is a Block?

A Block is a ready-made section of a website layout, such as a Banner, Footer, Pricing, or Contacts section, which you can use to build your website page in Website Builder.

Accessing the Blocks Library

You can access the Block you need in the library of Blocks, by following the steps below:

1. Click Sign Up / Log In at the top of this page.
2. Select Account Manager from the drop-down menu.
3. Enter your username and password then, click Log In.
4. Click the Visit My Account button.
5. Click Website Builder from the menu at the top of the page.
6. Click on the Website Builder plan that you wish to manage.
   If you only have one Website Builder plan, you will automatically be redirected to its management page.
7. Hover your mouse pointer over the [+] Icon at the upper right-hand section of the page and click Build Now.
8. On the Sites page of your Website Builder Dashboard, hover your mouse pointer over the project/website that you would like to customise and click Edit.
   Or, if you haven't started one yet, click the Create Site button at the top-right corner, then select a template and click Create This Site to start building one.
9. On the Website Builder Editor, click Build from the left-side menu.
10. Click on the Blocks tab to display the Blocks Library.

Now that you’ve learned how to access Blocks, you are free to manage them to suit your needs.

Managing Website Builder Blocks

Website Builder gives you the freedom to choose which Blocks you wish to use and manage by yourself. You can add, customise, resize, move, duplicate, and delete Blocks to help you build your website the way you want it.

Adding Blocks
From the Blocks Library, hover your mouse pointer over a Block name and move your pointer over the extended menu on its right to scroll down and view more Block templates, then drag and drop your chosen Block onto a section placeholder on your website page.

Customising Blocks
Website Builder also allows you to customise the Layout and Background of the Blocks you want to use on your website.

1. To customise a Block’s Layout, hover your mouse pointer over a Block then, click the Layout Icon that appears on its far-right side to customise the following on the pop-up box:
   

   Columns	Click on the bar to set the number of columns you would like your Block to have.
   Align Vertically	Click to enable/disable this option accordingly.

   Note: Customising your Menu Block will have different Layout and Design options. Learn more about it here.

2. To customise a Block’s Background, hover your mouse pointer over a Block then click the Background Icon that appears on its far-right side. You can use a Photo, Video, or Map as your Background, then set its Overlay by dragging the bar on it.
   
   Follow the respective steps below to change your Block's Background:
   

   Photo	Click on the Photo tab on the Background pop-up box, then choose any of the following methods to select a photo: Upload to Website Builder If the Photo is in your computer, drag and drop it into the pop-up window or click Browse to manually look for the image from your list of folders and upload it to Website Builder. Access Website Builder My Photos If the Photo was previously uploaded in Website Builder, click the My Photos tab from the pop-up window and select the picture. Access the Cloud If the Photo is in another online account, click the Clouds tab from the pop-up window, connect to your online account, then navigate and select the picture. Use Free Photos If you want to use a free photo from Website Builder, click the Free Photos tab from the pop-up window, then navigate through the categories and select the picture. Tip: If you want to use a solid colour as your Background, delete the existing photo (if any), then click the box beside Colour, select a colour and click Apply.
   Video	Click on the Video tab on the Background pop-up box, then enter the Link to Video in the space provided.
   Map	Click on the Map tab on the Background pop-up box, then click Edit Map to customise the following: Address - Enter the address to show in the Map. Type - Select the type of Map to use from the drop-down list. Zoom - Click and drag to adjust the zoom visibility of the address in your Map.

Resizing Blocks
To resize a Block, hover your mouse pointer over a Block and click the Resizing Control that appears below it. Drag the Resizing Control up or down to resize, then release when done.

Moving Blocks
To move a Block, hover your mouse pointer over a Block and click the Move Icon that appears on its far-right side. A Move Blocks menu will appear on the right side of the screen. Drag and drop the Blocks inside the Move Blocks menu to move and reorder them, then click the [x] Icon at the top-right corner of the menu to close when done.

Duplicating Blocks
To duplicate a Block, hover your mouse pointer over a Block and click the Duplicate Icon that appears on its far-right side. The Block, including all the Features within it, will automatically be copied and a duplicate Block will appear below the Block.

Deleting Blocks
To delete a Block, hover your mouse pointer over a Block and click the [x] Icon that appears on its far-right side. The Block, including all the Features within it, will automatically be deleted from your website page.

Congratulations! You now know how to manage Website Builder Blocks. Learn all about Website Builder Features by clicking here.