> For the complete documentation index, see [llms.txt](https://docs.wfolio.pro/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.wfolio.pro/site/en/blocks/block-settings.md).

# Block settings

Wfolio lets you customize each block individually to achieve the design and structure you want.\
Blocks can be added to both **composite pages** and **landing pages**.

### Spacing <a href="#indents" id="indents"></a>

You can set indents from **very small** to **extra large**, or **remove indents entirely**. To do this, open the **block settings** and adjust the top and bottom spacing.

<i class="fa-up-down">:up-down:</i> A **spacing icon** on the right side of the block indicates that spacing is enabled.

<figure><img src="/files/xPWZRQdAu2TW0GmkacWn" alt=""><figcaption></figcaption></figure>

### Block background <a href="#background" id="background"></a>

You can highlight blocks on the page to draw attention to them. Click on the **palette icon** and choose a background color.

* **Accent**—the accent color of your color scheme.
* **Contrast**—a contrasting color based on your color scheme.
* **Image**—add an image background (available for text blocks, button blocks, and some widgets).

<i class="fa-paintbrush">:paintbrush:</i> A **brush icon** on the right side of the block indicates that a background is applied.

<figure><img src="/files/7QqG8o4r7xi9yzEqJMyu" alt=""><figcaption></figcaption></figure>

#### Content alignment <a href="#align" id="align"></a>

If a block has multiple columns, you can control their vertical alignment. In the **block settings**, choose how to align columns relative to the top and bottom of the block.

<figure><img src="/files/U8li7WHN5odSRsakhrgX" alt=""><figcaption><p>A two-column block with alignment settings. 1) top-aligned, 2) center-aligned, 3) bottom-aligned.</p></figcaption></figure>

### Copying a block <a href="#copy" id="copy"></a>

To copy a block, click on the **Copy block** icon. Choose whether to copy it to the **current page** or to a **different page**.

<figure><img src="/files/03DS3FBG0z5Ei7gFDvZd" alt=""><figcaption></figcaption></figure>

### Moving a block <a href="#move" id="move"></a>

You can change the order of blocks on the page in two ways:

* Using the **Up** and **Down** arrows.
* By changing the **block number** displayed between the arrows. To do this, click on the number, enter a new value, and press **Enter** to confirm.\
  Example: To move the third block to the top, replace `3` with `1` and press Enter. The block will move to the first position.

<figure><img src="/files/D0gSRU4QHwlpLtvSa7cs" alt=""><figcaption></figcaption></figure>

### <mark style="color:red;">Deleting</mark> a block <a href="#delete" id="delete"></a>

Click the <mark style="color:red;">**Delete block**</mark> icon to remove the block.

{% hint style="warning" %}
This action cannot be undone.
{% endhint %}

<figure><img src="/files/XhHPa14ObrtRLAY3Ur8n" alt=""><figcaption></figcaption></figure>

### Anchor link to a block <a href="#anchor" id="anchor"></a>

You can create an **anchor link** that scrolls directly to the block on the page. This is useful for navigation menus or linking to specific sections. Learn more here: [Links on the site](/site/en/blocks/links-on-the-site.md#anchor-links-jump-to-a-specific-block-on-a-page).