> For the complete documentation index, see [llms.txt](https://docs.docbits.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.docbits.com/administration-and-setup/workflow/advanced-workflow-builder/toolbar-and-canvas.md).

# Toolbar & Canvas

Every Advanced Workflow toolbar control, canvas interaction, note function and keyboard shortcut.

## Video: Builder and canvas

Mike introduces the example, then checks Workflow List and License and explains his real actions in the English DocBits designer. The demonstration remains unsaved; this account has no Advanced Workflow subscription.

{% embed url="<https://docbits-videos.fra1.cdn.digitaloceanspaces.com/settings-assistant/advanced_workflows_canvas-admin/v7/en.mp4>" %}

[Open video](https://docbits-videos.fra1.cdn.digitaloceanspaces.com/settings-assistant/advanced_workflows_canvas-admin/v7/en.mp4) · [Captions (WebVTT)](https://docbits-videos.fra1.cdn.digitaloceanspaces.com/settings-assistant/advanced_workflows_canvas-admin/v7/en.vtt) · [Transcript (text)](https://docbits-videos.fra1.cdn.digitaloceanspaces.com/settings-assistant/advanced_workflows_canvas-admin/v7/en.txt) · 3:42

| In this film                | Start                                                                                                                             |
| --------------------------- | --------------------------------------------------------------------------------------------------------------------------------- |
| Meet the administrator      | [0:00](https://docbits-videos.fra1.cdn.digitaloceanspaces.com/settings-assistant/advanced_workflows_canvas-admin/v7/en.mp4#t=0)   |
| Check workflow access       | [0:09](https://docbits-videos.fra1.cdn.digitaloceanspaces.com/settings-assistant/advanced_workflows_canvas-admin/v7/en.mp4#t=9)   |
| Name the workflow           | [0:37](https://docbits-videos.fra1.cdn.digitaloceanspaces.com/settings-assistant/advanced_workflows_canvas-admin/v7/en.mp4#t=37)  |
| Configure the amount check  | [0:52](https://docbits-videos.fra1.cdn.digitaloceanspaces.com/settings-assistant/advanced_workflows_canvas-admin/v7/en.mp4#t=52)  |
| Add the Approval action     | [1:16](https://docbits-videos.fra1.cdn.digitaloceanspaces.com/settings-assistant/advanced_workflows_canvas-admin/v7/en.mp4#t=76)  |
| Add the Standard action     | [1:37](https://docbits-videos.fra1.cdn.digitaloceanspaces.com/settings-assistant/advanced_workflows_canvas-admin/v7/en.mp4#t=97)  |
| Arrange the canvas          | [2:00](https://docbits-videos.fra1.cdn.digitaloceanspaces.com/settings-assistant/advanced_workflows_canvas-admin/v7/en.mp4#t=120) |
| Connect the routes          | [2:17](https://docbits-videos.fra1.cdn.digitaloceanspaces.com/settings-assistant/advanced_workflows_canvas-admin/v7/en.mp4#t=137) |
| Prepare test cases          | [2:44](https://docbits-videos.fra1.cdn.digitaloceanspaces.com/settings-assistant/advanced_workflows_canvas-admin/v7/en.mp4#t=164) |
| Validate, save and activate | [3:10](https://docbits-videos.fra1.cdn.digitaloceanspaces.com/settings-assistant/advanced_workflows_canvas-admin/v7/en.mp4#t=190) |

<details>

<summary>Transcript</summary>

**Meet the administrator**

I look after DocBits here. Let me show you how I build an invoice check and connect its two routes.

**Check workflow access**

I start on Workflow Dashboard and open Workflow List. Then I check License. Workflow and Advanced Workflow both need active access. With those enabled, New Workflow offers Advanced Workflow. This documentation account has no active workflow subscription, so this video continues with an unsaved designer preview.

**Name the workflow**

I'm working in the real DocBits designer. First, I give this draft a clear name. We'll check an invoice amount, then use two simple actions to show the possible routes. This demonstration stays unsaved.

**Configure the amount check**

I open Add and choose And. Under Document Field, I select the Docfield condition. I set the field to total amount. Then I choose Greater Than. And enter one thousand. Use your own document field key. Exactly one thousand does not pass this comparison.

**Add the Approval action**

Now I add a Then card from Document Field. The action sets a document field. I use the demonstration key approval route, and enter Approval. This labels the route. A real approval process needs its own business actions.

**Add the Standard action**

I add a second Then card using the same action. The action sets a document field. I use the demonstration key approval route, This time, the demonstration field gets the value Standard. Both cards are configured. They still need connections to define which action runs.

**Arrange the canvas**

I drag the cards into a readable layout. The two actions go on the right. The condition sits in the middle, with Start on the left. Moving cards changes their position. It does not create a connection.

**Connect the routes**

I drag from Start's output to the condition's input. The Success route goes to Approval, with a blue connection. The orange Failed Condition route goes to Standard. Red Error is a separate output for evaluation failures. Here it remains unconnected. In a production workflow, decide how you will handle those failures.

**Prepare test cases**

The toolbar Test button opens Select Test Document. I can select a demonstration document, or prepare complete Custom Data. Test amounts above, below, and exactly at one thousand. Check a missing amount too. This account has no Advanced Workflow subscription. I'm showing test preparation, not an executed result.

**Validate, save and activate**

I locate Validate to check connections and card settings. This account blocks validation because the subscription is unavailable. In an enabled account, I would save explicitly to the server. Then check activation separately. The switch is disabled before the first save. The automatic draft indicator refers to a local browser copy. It does not mean this workflow is saved or enabled.

</details>

[Watch all five chapters](/administration-and-setup/workflow/advanced-workflow-builder/videos.md)

Use the bottom toolbar to configure the workflow and the canvas to arrange nodes. Panning, zooming and card positions change the view or layout. Connections determine execution.

## Every toolbar control

Controls follow their left-to-right order.

| Control                            | Purpose and result                                                                                                                                    |
| ---------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------- |
| **+ Add**                          | When, And, Then, existing Start, Wait ALL, Wait ANY, OR and Note. See [Nodes](/administration-and-setup/workflow/advanced-workflow-builder/nodes.md). |
| **Undo / Redo**                    | Undo or repeat supported canvas edits. Does not roll back executed actions or independently saved organization variables.                             |
| **Zoom out / Zoom in**             | Change the view scale.                                                                                                                                |
| **Workflow Name**                  | Name the workflow before saving.                                                                                                                      |
| **Edit description**               | Explain the business purpose and exceptional routes.                                                                                                  |
| **Automatic-save indicator**       | Shows the last local draft save after changes; not a server-save confirmation.                                                                        |
| **Variables — { }**                | Open the organization-wide [variables](/administration-and-setup/workflow/advanced-workflow-builder/variables.md).                                    |
| **Help — ?**                       | Shortcuts, path highlighting and connection legend.                                                                                                   |
| **Validate — check-circle**        | Report graph errors and warnings.                                                                                                                     |
| **Test — play-circle**             | Choose test input for the current canvas. See [testing](/administration-and-setup/workflow/advanced-workflow-builder/validation-and-testing.md).      |
| **Snap to grid**                   | Toggle alignment when moving nodes.                                                                                                                   |
| **Mini-map**                       | Show or hide an overview for large graphs.                                                                                                            |
| **Export Image**                   | Download a diagram image. This is not an importable workflow configuration or execution recording.                                                    |
| **Save — disk**                    | Write the workflow to the server. Wait for confirmation.                                                                                              |
| **Activate / Deactivate — toggle** | Change the enabled state of a saved workflow. Unavailable before the first save; review any unsaved-change prompt.                                    |
| **Hide toolbar — down arrow**      | Hide it. Use the remaining up arrow to restore it.                                                                                                    |

The current toolbar does not expose a separate Logs or Save as Template button. Open [Workflow Logs](/administration-and-setup/workflow/workflow-logs.md) from the document. Workflow List configuration import/export is separate from Export Image.

## Navigate and select

* Drag the blank background to pan; use wheel, pinch or zoom buttons to change scale.
* Drag a node to move it. Connections remain attached.
* Click a node to highlight incoming and outgoing paths; unrelated nodes dim.
* **Shift + drag** selects an area. **Cmd/Ctrl + click** adds/removes a node from the selection.
* Right-click the background for Add. The node context menu offers editing actions for the selection.

Connectivity highlighting is different from [execution evidence](/administration-and-setup/workflow/workflow-logs.md).

## Edit nodes and notes

Copy, paste or duplicate a selection to reuse a configured section, then check its fields and connections. Review the selection before deleting: removing a node also removes its connections and can disconnect a downstream path. Undo/redo corrects canvas edits.

Use **Note** to explain a decision, owner or configuration context. Edit its text and use the available color and size controls to keep it readable. Notes are annotations, not execution steps or logs.

## Keyboard shortcuts

Use **Cmd** on macOS and **Ctrl** on Windows/Linux. Finish typing in an input before using canvas-editing shortcuts. **?** opens the application's current reference.

<figure><img src="https://578966019-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FT2n2w4uDCJvv7CJ5zrdk%2Fuploads%2Fgit-blob-4de76747be7b2c4619af9a1cbd034204e837bd1e%2Fadvanced_workflows_help_en.png?alt=media" alt="Help dialog showing the keyboard shortcut reference"><figcaption><p>Built-in help provides the current editing shortcuts. Scroll to the connection legend or select Card setup for field-name guidance.</p></figcaption></figure>

| Shortcut                  | Action                                   |
| ------------------------- | ---------------------------------------- |
| **Cmd/Ctrl + S**          | Save to server.                          |
| **Cmd/Ctrl + Shift + V**  | Validate.                                |
| **Cmd/Ctrl + Shift + T**  | Open testing.                            |
| **Cmd/Ctrl + Z**          | Undo.                                    |
| **Cmd/Ctrl + Shift + Z**  | Redo.                                    |
| **Cmd/Ctrl + C / V / D**  | Copy / paste / duplicate selected nodes. |
| **Cmd/Ctrl + A**          | Select all nodes.                        |
| **Shift + drag**          | Area selection.                          |
| **Cmd/Ctrl + left-click** | Add/remove one node from selection.      |
| **Right-click**           | Open context menu.                       |
| **Delete**                | Delete selection.                        |
| **?**                     | Open help.                               |

Before leaving, [validate, test and save](/administration-and-setup/workflow/advanced-workflow-builder/validation-and-testing.md). A local draft and an exported image do not replace a saved workflow.


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation by asking a question.

Perform an HTTP GET request on the following URL with the `ask` and `goal` query parameters:

```
GET https://docs.docbits.com/administration-and-setup/workflow/advanced-workflow-builder/toolbar-and-canvas.md?ask=<question>&goal=<user_goal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is what the user is ultimately trying to achieve, the reason they need the answer. Sharing it helps GitBook give you a better, more relevant answer. A goal is most helpful when it describes the outcome the user wants rather than restating the question. For example, with `ask=how do I create an API token`, a goal like `automate deployments from our CI pipeline` lets GitBook tailor the answer to that use case.

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.
