> ## Documentation Index
> Fetch the complete documentation index at: https://docs.odella.ai/llms.txt
> Use this file to discover all available pages before exploring further.

# Blocks

> Master adding, moving, connecting, and editing blocks in Odella workflows

Blocks are the essential elements of Odella workflows. Whether you're building simple sequences or intricate logic, blocks help bring your workflows to life. Here's everything you need to know to add, arrange, and customise them.

## Adding a Block

To add a block, right-click in any empty space on the flow canvas (or press **Space**) to open the **Add Menu**.

<Frame>
  <img src="https://mintcdn.com/odella/8q0Jmq22MJVvZ-1d/assets/block_add_light.gif?s=e837da2c5b043b659a945f17841a0186" alt="Adding a block (Light Mode)" className="dark:hidden" width="868" height="624" data-path="assets/block_add_light.gif" />

  <img src="https://mintcdn.com/odella/8q0Jmq22MJVvZ-1d/assets/block_add_dark.gif?s=2d48170c88b2ed86d83573e71c84ede3" alt="Adding a block (Dark Mode)" className="hidden dark:block" width="906" height="528" data-path="assets/block_add_dark.gif" />
</Frame>

<CardGroup cols={2}>
  <Card title="Search & Select">
    Start typing to quickly find the block you need in the menu.
  </Card>

  <Card title="Organised by Category">
    Blocks are grouped by category for easy browsing. Select a block to place it at the location you right-clicked.
  </Card>
</CardGroup>

For details on all available blocks, check out the [Block Reference](/block-reference/all-blocks).

## Moving Blocks

Repositioning blocks is quick and easy:

* **Drag & Drop**: Click and hold the title bar of a block, then drag it to your desired position.
* **Multi-Select**: Hold **Shift** and click on multiple blocks to move them as a group.

<Frame>
  <img src="https://mintcdn.com/odella/8q0Jmq22MJVvZ-1d/assets/block_move_light.gif?s=b55f027c8795146778811f584ee5bf15" alt="Moving a block (Light Mode)" className="block dark:hidden" width="814" height="404" data-path="assets/block_move_light.gif" />

  <img src="https://mintcdn.com/odella/OqShP_EA8jdrBHYT/assets/block_move_dark.gif?s=9ce0339da3fb0401aded5397b933c614" alt="Moving a block (Dark Mode)" className="hidden dark:block" width="814" height="404" data-path="assets/block_move_dark.gif" />
</Frame>

## Deleting Blocks

Right-click on a block and select **Delete** to remove it from the flow.

<Frame>
  <img src="https://mintcdn.com/odella/8q0Jmq22MJVvZ-1d/assets/block_delete_light.gif?s=48e18dd18737d3f37abc06f875d4e035" alt="Deleting a block (Light Mode)" className="block dark:hidden" width="448" height="356" data-path="assets/block_delete_light.gif" />

  <img src="https://mintcdn.com/odella/8q0Jmq22MJVvZ-1d/assets/block_delete_dark.gif?s=4e88d8e5433ceab5448fe2fa1b276d0e" alt="Deleting a block (Dark Mode)" className="hidden dark:block" width="796" height="612" data-path="assets/block_delete_dark.gif" />
</Frame>

<Callout type="warning">
  Deleting a block is permanent, and there's no undo option. Double-check before you delete!
</Callout>

## Connecting Blocks

<Frame>
  <img src="https://mintcdn.com/odella/8q0Jmq22MJVvZ-1d/assets/block_connect_light.gif?s=777468c45b61fd29e64b72eb10fad74d" alt="Connecting a block (Light Mode)" className="block dark:hidden" width="724" height="294" data-path="assets/block_connect_light.gif" />

  <img src="https://mintcdn.com/odella/8q0Jmq22MJVvZ-1d/assets/block_connect_dark.gif?s=16eb8934cdbf673b10c73879bbb17e01" alt="Connecting a block (Dark Mode)" className="hidden dark:block" width="906" height="528" data-path="assets/block_connect_dark.gif" />
</Frame>

Connections define the data flow between blocks. Here's how to link them:

<CardGroup cols={2}>
  <Card title="Create Connections">
    Click and drag from an output port on one block to an input port on another. Outputs are on the right side, inputs are on the left.
  </Card>

  <Card title="Port Rules">
    Outputs can connect to multiple inputs, but each input can only connect to one output. Ensure data types match for smooth operation.
  </Card>
</CardGroup>

For more details on port data types, refer to the [Block Reference](/block-reference/all-blocks).

## Disconnecting Blocks

Need to adjust a connection?

* **Move Connection**: Click and drag on a connected port to change the connection to a different port.
* **Delete Connection**: Drag the connection line to an empty space to remove it.

## Creating a Subflow

<Frame>
  <img src="https://mintcdn.com/odella/8q0Jmq22MJVvZ-1d/assets/block_create_subflow_light.gif?s=e5a9c09cb62729213ceeff4c9359dd19" alt="Creating a subflow (Light Mode)" className="block dark:hidden" width="906" height="528" data-path="assets/block_create_subflow_light.gif" />

  <img src="https://mintcdn.com/odella/8q0Jmq22MJVvZ-1d/assets/block_create_subflow_dark.gif?s=d6e1a56b51d67e1ad6a9339c762da99d" alt="Creating a subflow (Dark Mode)" className="hidden dark:block" width="1010" height="858" data-path="assets/block_create_subflow_dark.gif" />
</Frame>

Subflows allow you to group blocks for cleaner, more manageable workflows.

<Steps>
  <Step title="Select Blocks">
    Hold **Shift** and click on each block you want to include in the subflow.
  </Step>

  <Step title="Create Subflow">
    Right-click one of the selected blocks and choose **Create Subflow**. This action moves the selected blocks into a new (*unsaved!*) flow, complete with input and output blocks that link back to the main flow.
  </Step>
</Steps>

<Tip>
  Name and describe your subflow in the flow info section to keep it organised. Don't forget to save with **CMD+S** or **CTRL+S**.
</Tip>

<Note>
  The original blocks in the parent flow remain in place, so you'll need to manually replace them with your subflow if desired.
</Note>

## Editing a Block

<Frame>
  <img src="https://mintcdn.com/odella/8q0Jmq22MJVvZ-1d/assets/block_edit_light.gif?s=75c86170444d7481ab6a4cf600781ef0" alt="Editing a block (Light Mode)" className="block dark:hidden" width="1406" height="884" data-path="assets/block_edit_light.gif" />

  <img src="https://mintcdn.com/odella/8q0Jmq22MJVvZ-1d/assets/block_edit_dark.gif?s=cebca5dcb3011d7806447a4983f1e487" alt="Editing a block (Dark Mode)" className="hidden dark:block" width="1010" height="858" data-path="assets/block_edit_dark.gif" />
</Frame>

To customise a block, click the gear icon in the top-right corner. This opens the **Block Editor**.

<CardGroup cols={2}>
  <Card title="Edit Block Details">
    Adjust the block's title and description for clear documentation.
  </Card>

  <Card title="Fine-Tune Settings">
    Modify settings specific to the block type, such as batch processing or variant options.
  </Card>
</CardGroup>
