General settings for blocks

General settings

General settings are standard configurations for a block in a section. These settings allow users to define basic visual parameters, including color schemes, text formatting, and alignment, applied to the entire block.

Setup

This setting allows you to choose whether the block should be full width or limited.

  • Limited: The block only uses the width it needs.
  • Full width: The block fills the available width.

Tip!

When using "Limited", this can be combined with maximum width in some blocks, which allows you to set a maximum width for the entire block in pixels.

Colors

Make sure to give the block the look you want by defining color schemes.

  • Background color: The color of the entire block.
  • Text color: All text added to the block will use this setting as long as the text's color scheme is set to "inherit" (inherit color from parent setting). All text also has its own color schemes.

Alignment

Most, but not all, blocks support content alignment. This alignment is based on what is called flex in CSS and is, as the name suggests, incredibly flexible.

For example, you can choose to place the content in one of nine positions and/or choose whether it should be distributed with space between elements, around the elements, or evenly distributed.

More about placement and alignment

9-box

9-box got its name from the division of 9 boxes, where the content can be placed in one of these boxes.
For example, you can place the content at the top right, in the middle, in the middle to the left, etc. This in combination with the alignments explained below provides many placement options.

Alignment type

  • Space-between is a setting that distributes space between the elements, so that there is no space on the outer edges.

  • Space-around gives equal space around each element, creating a balanced layout.

  • Space-evenly distributes the space evenly between the elements, including on the outer edges.

Text alignment

Choose whether the texts in the selected block should be aligned to the left, center, or right.
The text alignment in the general settings will be reused by all text fields in the block.

Vertical alignment

Adjust the placement of elements vertically.

Visibility

With this setting, you can set which device the block should be visible on:

  • Vis på alle enheter
  • Show only on desktop (PC/Mac)
  • Show only on mobile

Different design on different devices
Thanks to the visibility setting, you can insert unique blocks per device. For example, you can insert a block where the image and text are adapted to mobile devices and choose that it should only be visible on mobile.
This provides a flexible design with very good customization options.

Icon

Find a suitable icon for the block.

Adjust size
Adjust the size of the icon in the block.

Info

Icon is only available on selected blocks, such as "Icon Box"

Choice of star rating

Choose between 1 - 5 stars. The setting is only available for the "Customer Reference" block where you can upload an image, set stars and add a quote from customers.


Advanced settings

Under advanced settings, you will find adjustment options that may not always be used as much, or for some will be more advanced.
These are therefore placed in a separate drop-down menu for easier handling.

Adjust size (pixel)

Drag to adjust how many pixel edge radius you want on the block. The higher the number, the rounder the corners of the block will be.

Column width

Customize how many columns the block should occupy of the section's total number of columns.

If both the section and block are set up with the same number of columns, the block will take up the entire width of the section. If the block has half of the available columns, it will take up half the width.

Related articles

Padding and margin

Activate to set padding and/or on the block.
Padding determines how much distance there should be from the content to the edge of the block, while the margin determines the distance to the blocks around.

Related articles

Distance control

Drag to adjust how many pixels there should be between each element in the block. This is used in combination with alignment.

Was this article helpful?