# Canvas functionalities 🎥 Canvas video tutorial Prefer to watch instead of read? In this tutorial, learn how to use the different canvas functionalities by building a quick and easy Pizza bot 👇 {% embed url="" %} If you prefer to read, we'll go through each special functionality of the canvas below 👇 ## Auto layout If you try out the canvas with an existing bot, your bot blocks will appear as overlapping. The Auto layout functionality is there to solve that. To use Auto-layout: 1. From your canvas, click on the **Auto layout** button at the bottom right corner of your screen.

2. Your blocks are now spread over the canvas in a non-overlapping fashion. Feel free now to drag and drop each block where you like it the best! {% hint style="danger" %} Note that once you tidied up your flow using Auto layout, you cannot go back to what your flow looked like before. {% endhint %} ## Drag and drop To add new blocks to your bot with the canvas, simply drag and drop them directly from the top-right corner to anywhere you like in the canvas.

## 🆕 Duplicate blocks To duplicate a block: 1. Select a block by clicking on it. 2. Click on the **Duplicate** icon above it.

3. A copy of this block appears on your canvas! ## Connections There are 2 types of arrow connections on the canvas: Go-to's, and Parent connections. ### Go-to connections The plain arrows represent the [Go-to connections](https://docs.chatlayer.ai/bot-answers/dialog-state/plugins#go-tos-within-dialog-types), i.e. an actual flow connection. This means that the blocked pointed to by the arrow happens right after the first one, guiding the conversation from one component to another.

Go-to dot from where you can draw connections

To link 2 components with a Go-to: 1. Click and hold the **Go-to** dot at the bottom right corner of a node. 2. Connect it with any other existing block by drawing an arrow, or you can just create a new one if you don't have a block available yet.

From the Go-to dots, draw connections between components.

### Parent-child connections The dotted arrows are [Parent-child connections](https://docs.chatlayer.ai/bot-answers/dialog-state#parent-bot-dialog), designed as a visual aid to help you organize your flows. While it doesn't create functional links between components, it offers a tool for visually structuring your block in a coherent manner. To add a parent-child connection: 1. Open your [block](/buildabot/flow-logic/dialog-state.md). 2. Go to its **Settings**. 3. Under **Parent**, define a parent block. 4. Click **Save**. {% hint style="info" %} For instance, Parent-child connections are especially useful when you're using [context](/nlp/natural-language-processing-nlp/using-context.md). {% endhint %}

Parent-child connection enhances visualization.

### Connection settings #### **Delete arrows** Both Go-to and Parent-child arrows can be deleted by hovering over them and clicking the trash icon.

Click on the trash icon from an arrow to delete a flow connection

#### Arrows position and color You have the flexibility to move arrows back and forth at your convenience to achieve the perfect positioning. Additionally, you are able to modify their colours to suit your preferences.

Should you ever want to revert to the previous arrow design, a simple reset option allows you to restore the original arrows instantly.

--- # Agent Instructions: Querying This Documentation If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question. Perform an HTTP GET request on the current page URL with the `ask` query parameter: ``` GET https://docs.chatlayer.ai/navigation/bot-builder/flows/canvas-functionalities.md?ask= ``` The question should be specific, self-contained, and written in natural language. The response will contain a direct answer to the question and relevant excerpts and sources from the documentation. Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.