A regular website is not enough. It takes a winning combo of elements and an intuitive user experience to delight visitors. One of the Sitebeat 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 Menu, Banner, Footer, Pricing, or Contacts section — which you can use to build your website page in Sitebeat.

Accessing the Blocks Library

Follow the steps below to access the Block you need:

1. Log In to access the Sitebeat dashboard.
2. Under My Sites, click the Edit Site option of the website that you wish to manage.

Note: If you want to edit a new site, you have to unpublish the current website and make your new site as your primary website.

Under My Sites, click the [...] Ellipsis Icon on the top-right corner of the website to unpublish the current site. Click Unpublish Site, and then click Yes, Unpublish to confirm.

Under My Domains, click the [...] Ellipsis Icon of the website that you want to replace as your primary website, then click Replace Primary. In the pop-up window, select the domain of the new website in the New Primary Domain list, then click Replace Primary. You can also click the Domains tab under My Sites to perform the necessary steps mentioned.

You can now edit the new site that you wish to manage.

3. On your Site Editor, click Build in the left-side menu, and then click the Blocks tab. You are now viewing the Blocks Library.

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

Managing Sitebeat Blocks

With Sitebeat, you have the freedom to choose which Blocks to use and manage by yourself. You can add, customise, resize, move, duplicate, and delete Blocks to help 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 Blocks, and then drag and drop your chosen Block onto a section placeholder on your website page.

Customising Blocks
Customise the layout and background of each Block on your website page using these steps:

1. To customise a Blocks Layout, hover your mouse pointer over a Block, and then click the Layout Icon on its top-right edge to set the following:
   

   Columns	Click on the bar to set the number of columns you would like your Block to have.
   Align Vertically	Click to enable or disable this option, if preferred.

   Note: Customising your Menu Block will have different layout and design options.

2. To customise a Block's Background, hover your mouse pointer over a Block, and then click the Background Icon on its top-right edge.
   
   Follow the corresponding steps below to use a Photo, Color, Video, Slider, or Map as your background:
   

   Photo	Click on the Photo tab on the Background pop-up box, click Add Photo, and then choose any of the following methods to select a photo: Upload to Sitebeat — 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 then upload it to Sitebeat. Access Sitebeat My Photos — If the photo was previously uploaded in Sitebeat, click the My Photos tab from the pop-up window, and then select the image. 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, and then navigate and select the image. Use Free Photos — If you want to use a free photo from Sitebeat, click the Free Photos tab from the pop-up window, and then navigate through the categories and select the image. You may also add a color overlay to your photo. Simply click on the box beside Overlay, select a color, and then click Apply. Adjust its opacity using its corresponding bar.
   Color	Click on the Photo tab on the Background pop-up box and delete the existing photo, if any. Click the box beside Color, select a color, and then click Apply.
   Video	Click on the Video tab on the Background pop-up box, and then enter the video link in the space provided. You may adjust the opacity of the video by using the bar under Color. You may also add a color overlay to your video. Simply click the box beside Color, select a color, and then click Apply. Adjust its opacity using its corresponding bar.
   Slider	Click on the Slider tab on the Background pop-up box, and then click Edit Slider to access the following options: Settings — Under the Settings tab on the pop-up box, click to enable or disable the Loop Slides and Autoplay functions. If Autoplay is enabled, click and drag the bar below it to adjust its speed. Navigation — Click the Navigation tab on the pop-up box to select a Navigation theme from the drop-down list, and then enable or disable the Show Dots and Show Arrows options. If the latter options are enabled, select a preferred position from their corresponding drop-down lists. Hover your mouse pointer over your Block again to access the Slides + option on its top-left corner and the Background Icon beside the Edit button on its top-right corner. Slides + Icon — Click the [+] Icon to add more slides or the [-] Icon to remove slides. Background Icon — Click on the Background Icon beside the Edit button to set a background for each slide. You can set a Photo, Color, Video, or Map background on each slide.
   Map	Click on the Map tab on the Background pop-up box, and 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. You may also add a color overlay to your map. Simply click on the box beside Color, select a color, and then click Apply. Adjust its opacity using its corresponding bar.

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

Moving Blocks
To move a Block, hover your mouse pointer over a Block, and then click the Move Icon on its top-right edge. 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, and then click the [x] Icon above the menu when done.

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

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

Hit the play button below to view the quick start guide we've prepared for you:

You can also check out more video guides by visiting our YouTube How-To Playlist.