1. Blocks

Do you want to bring life to your web page with minimal effort? Meet blocks, your go-to tool for website creation and customization. In this guide, we'll walk you through using blocks in our website builder, Stylie.

Creating Blocks

Blocks serve as containers for your content. You can initiate the block creation process by clicking on the "start building your page" option. Stylie provides two options: building from scratch or using premade blocks. These blocks can be easily personalized with your content, images, fonts, and colors.

Navigating the Block Manager

The Block Manager is your hub for block creation and organization. It houses options for blocks, layouts, saved blocks, and global blocks. You can select from two kits that can be used interchangeably, and different styles (light and dark) that can also be mixed and matched. The categories feature aids in filtering through blocks to find those that suit your specific purpose.

Implementing Blocks

To implement a block, simply choose the one that fits your requirements and select it. The block will automatically populate onto your page. If you want to remove a block, select the delete option from the options at the top right-hand corner of the block.

Block Settings and Options

In the options toolbar, you can access several settings to customize your blocks. Here are some notable ones:

• Delete: Removes the block from the page.
• Duplicate: Useful when you want to replicate a block with the same style.
• Settings: Controls the block's width, canvas, and styling options.
• Save Block: Useful for saving a well-designed block for future use. Saved blocks can be accessed in the Block Manager.
• Colors: Allows you to apply background colors and borders.
• Background: Add images, videos, or maps to the block's background.

Unique Block Features

Stylie provides a host of unique features that make blocks even more versatile. These include the option to turn a block into a global block, use it for multilingual websites, create a block slider, or set it for membership-only access.

Adding Content to Blocks

To add content within your block, click on the plus sign in the middle to open the elements drawer. You can add structural elements like columns and rows or content elements like text and images by simply dragging and dropping them onto the page.

Block Padding

As you hover over the top or bottom of a block, a blue bar appears, indicating the applied padding. This padding can be increased or decreased by clicking, holding, and dragging within the padding area.

Controlling Block Dimensions

Blocks offer the ability to control their dimensions in terms of width and height. You can set the block's width to boxed or full, and the height to auto, custom, or full height. The content within the block can be vertically aligned to the top, middle, or bottom.

Block Dividers

Add a touch of creativity with block dividers. These unique elements can be added to the top or bottom of the blocks, offering an interesting way to transition between different sections of your website.

So, start exploring blocks, and revolutionize your web design process with Stylie!