> ## Documentation Index
> Fetch the complete documentation index at: https://help.scribe-mail.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Canvas

> Selecione, edite, reordene e redimensione blocos diretamente no canvas, o espaço de trabalho visual dentro do editor de assinaturas da Scribe para criar assinaturas.

O canvas é a área central do editor onde você vê e interage com sua assinatura conforme ela toma forma. Funciona como uma ferramenta visual de design: clique para selecionar, arraste para reordenar e edite o texto direto no local, tudo enquanto o painel de árvore e o painel de estilo permanecem sincronizados.

<Frame>
  <img src="https://mintcdn.com/scribe/Z_G2D9X-Tlrxu_Eh/images/canvas-editor-overview-full.png?fit=max&auto=format&n=Z_G2D9X-Tlrxu_Eh&q=85&s=43103cb126a92c2c6b71e934c69bc1fc" alt="Canvas do editor da Scribe com blocos de assinatura e painéis" width="3456" height="1928" data-path="images/canvas-editor-overview-full.png" />
</Frame>

## Selecionar blocos

Clique em qualquer bloco no canvas para selecioná-lo. Uma borda azul aparece ao redor do bloco selecionado, e:

* O item correspondente é destacado no **painel de árvore**
* O **painel de estilo** à direita é atualizado para exibir as configurações desse bloco

Isso funciona nos dois sentidos. Clicar em um bloco no painel de árvore também o seleciona no canvas e o traz para a visualização.

<Frame>
  <img src="https://mintcdn.com/scribe/Z_G2D9X-Tlrxu_Eh/images/canvas-block-selected-blue-border.png?fit=max&auto=format&n=Z_G2D9X-Tlrxu_Eh&q=85&s=c8cc218981ed8bf4dcfc88c135fcae8b" alt="Bloco do canvas selecionado com borda azul e painel de estilo" width="3456" height="1928" data-path="images/canvas-block-selected-blue-border.png" />
</Frame>

<Tip>
  Para blocos aninhados (como um elemento de texto dentro de uma coluna), clique uma vez para selecionar o contêiner pai e clique novamente para selecionar o bloco filho dentro dele.
</Tip>

## Editar texto no local

Para blocos de texto, você edita o conteúdo diretamente no canvas. Clique em um bloco de texto para selecioná-lo e clique novamente para posicionar o cursor e começar a digitar. É possível selecionar palavras ou trechos para aplicar a formatação pelo painel de estilo.

Ao editar texto no local, o painel de estilo exibe controles de nível de texto: fonte, tamanho, cor, altura de linha e opções de formatação (negrito, itálico, maiúsculas, tachado, sublinhado).

<Frame>
  <img src="https://mintcdn.com/scribe/Z_G2D9X-Tlrxu_Eh/images/canvas-text-inline-editing.png?fit=max&auto=format&n=Z_G2D9X-Tlrxu_Eh&q=85&s=f672931097ae87ea925ca6ebf2780fb1" alt="Bloco de texto no modo de edição em linha no canvas" width="3456" height="1930" data-path="images/canvas-text-inline-editing.png" />
</Frame>

<Note>
  Blocos de texto conectados a um Smartfield (como Nome ou Cargo) mostram o valor do Smartfield no canvas. Você não consegue editar o valor em si aqui, já que ele vem da sua fonte de dados. Mas ainda dá para estilizar como ele aparece.
</Note>

## Adicionar linhas e colunas

Clique com o botão direito em qualquer bloco no canvas para abrir um menu de contexto com duas opções: **Adicionar linha** e **Adicionar coluna**. Isso permite agrupar blocos rapidamente sem sair do canvas.

<Frame>
  <img src="https://mintcdn.com/scribe/Z_G2D9X-Tlrxu_Eh/images/canvas-right-click-context-menu.png?fit=max&auto=format&n=Z_G2D9X-Tlrxu_Eh&q=85&s=a5df92eb1060a397f1cc6381858ef144" alt="Menu de contexto do clique com o botão direito mostrando as opções Adicionar linha e Adicionar coluna" width="3456" height="1928" data-path="images/canvas-right-click-context-menu.png" />
</Frame>

Por exemplo, se quiser dois botões lado a lado, selecione um deles, clique com o botão direito e escolha **Adicionar coluna**. Isso envolve o bloco selecionado em um novo contêiner de coluna, facilitando a inserção de outro bloco ao lado. Escolha **Adicionar linha** quando quiser empilhar elementos verticalmente dentro de um contêiner compartilhado.

É especialmente útil para montar layouts como uma linha de ícones de redes sociais, um par de botões de call-to-action ou qualquer seção em que vários blocos precisem ser agrupados e alinhados juntos.

## Reordenar blocos

Arraste qualquer bloco no canvas para reordená-lo dentro do seu contêiner. Durante o arrasto, uma borda azul tracejada mostra onde o bloco vai parar ao soltar.

Também dá para reordenar blocos arrastando-os no painel de árvore. O resultado é o mesmo.

<Frame>
  <img src="https://mintcdn.com/scribe/Z_G2D9X-Tlrxu_Eh/images/canvas-block-drag-reorder.png?fit=max&auto=format&n=Z_G2D9X-Tlrxu_Eh&q=85&s=a510ddd4e8c403d6fa94a35d7d6eb44c" alt="Bloco sendo arrastado para reordenação com indicador de soltura tracejado azul" width="3456" height="1929" data-path="images/canvas-block-drag-reorder.png" />
</Frame>

## Redimensionar

Alguns blocos (como imagens) mostram alças de redimensionamento (pequenos quadrados azuis) nas bordas e cantos quando selecionados. Arraste essas alças para redimensionar o bloco diretamente no canvas. As dimensões exatas se atualizam em tempo real no painel de estilo.

<Frame>
  <img src="https://mintcdn.com/scribe/Z_G2D9X-Tlrxu_Eh/images/canvas-image-resize-handles.png?fit=max&auto=format&n=Z_G2D9X-Tlrxu_Eh&q=85&s=43adfd56f04195f6f0092cf1e6dcc7e0" alt="Bloco de imagem com alças de redimensionamento azuis no canvas" width="3456" height="1930" data-path="images/canvas-image-resize-handles.png" />
</Frame>

## Navegação no canvas

O canvas é um espaço de trabalho infinito. Use a [barra de ações](/pt-BR/editor/action-bar) na parte inferior para aplicar zoom ou ative a ferramenta de mão para se movimentar sem selecionar blocos por engano.

<Frame>
  <img src="https://mintcdn.com/scribe/Z_G2D9X-Tlrxu_Eh/images/canvas-action-bar-zoom-controls.png?fit=max&auto=format&n=Z_G2D9X-Tlrxu_Eh&q=85&s=21abcbc64fe94aad3a79258f30c95881" alt="Barra de ações com controles de zoom e ferramenta de mão na parte inferior do canvas" width="3448" height="1908" data-path="images/canvas-action-bar-zoom-controls.png" />
</Frame>
