Websites- Cloud: Blocks

In Cloud Sites, every webpage begins with a block, which serves as the foundational container for all content. Whether starting from scratch or using a pre-designed layout, blocks provide the structure needed to build and organize a page effectively.

Adding a Block to the Page

To begin building a page:

  1. Select the “Start Building Your Page” option.
     

  2. Choose between creating a custom block or using one of the pre-made blocks.
    • Pre-made blocks allow quick setup by replacing placeholder content, images, fonts, and colors.
    • Custom blocks offer a blank canvas for full creative control.

This opens the Block Manager, which includes:

  • Blocks: Individual sections for various purposes.
  • Layouts: Complete pre-designed websites.
  • Saved Blocks: Previously created and saved custom blocks.
  • Global Blocks: Reusable blocks across multiple pages.

Navigating the Block Manager

On the left side of the Block Manager:

 

  • Kits: Choose between Kit 1 and Kit 2, which can be used interchangeably.
  • Styles: Select between light or dark themes, or mix both.
  • Categories: Filter blocks by purpose, such as:
    • Hero sections
    • Features
    • Contact forms
    • Galleries
    • Footers, headers, testimonials, and more

To add a block (e.g., a hero section), select the desired block and it will automatically appear on the page.

Managing Blocks

Each block includes an Options Toolbar  in the top-right corner with the following controls:

  • Delete: Removes the block from the page.

  • Duplicate: Creates an exact copy of the block for reuse.

  • Settings: Adjusts block width, canvas size, padding, margins, and visual effect.

  • Links: Allows you to link content to a page, URL, block, or other content. Note- the priority of links is set from the highest to the lowest level (i.e., pages down to Elements, a Block with a link would override an Element in that same Blocks link.
     

  • Save Block: Stores the block for future use in the Block Manager.

  • Colors: Allows you to customize the colors of the block.

      To remove overlay colors from a background image, simply deselect the overlay option.

  • Background: Allows the addition of background colors, borders, images, videos, or maps.
     

Advanced Block Features

On the far left of the toolbar, additional features include:

  • Global Block: Makes the block reusable across multiple pages.
  • Membership: This feature is not applicable to Cloud Sites.
  • Multilingual Support: Enables translation and localization.
  • Block Slider: Converts the block into a slider format.

These features are covered in dedicated tutorials for deeper exploration.

Adding Content to a Block

To insert content:

  1. Click the plus (+) icon in the center of the block.
  2. This opens the Elements Drawer, where layout elements (columns, rows) and content elements (text, images, buttons) can be added.
  3. Drag and drop elements onto the page.

Blue bars at the top and bottom of the block indicate padding areas, which can be adjusted by clicking and dragging to increase or decrease spacing.

Block Layout Options

Blocks can be set to:

  • Boxed: Content is centered with adjustable canvas width.
  • Full Width: Content stretches across the entire screen.

Height settings include:

  • Auto: Adjusts based on content.
  • Custom: Set manually in pixels or percentages.
  • Full Height: Fills the entire viewport vertically.

Content alignment within the block can be set to:

  • Top
  • Center
  • Bottom

Using Block Dividers

Block dividers add visual separation between sections:

  1. Access via Settings > Styling.
  2. Choose from a variety of divider styles.
  3. Customize divider color and placement (top or bottom of the block).

Dividers enhance the visual flow of the page and can be tailored to match the site’s design theme.

 

In our Cloud Websites documentation, you may come across the name "Brizy" or links to articles found on the Brizy website. Brizy is a technology partner that helps us provide an enhanced, user-friendly website editing experience. The Brizy partnership is explicitly designed for ministries, ensuring we offer the best solution to meet your church's website needs.

 

Updated

Was this article helpful?

0 out of 0 found this helpful

Have more questions? Submit a request