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

# Editar o código de um modelo

> Edite o Liquid, o HTML e o CSS de um modelo no editor de código, insira campos da encomenda, use a referência de variáveis e corrija erros de código.

O editor de código dá-lhe controlo total sobre um modelo. Os modelos são HTML e CSS com Liquid, a mesma linguagem de modelos que a Shopify usa: `{{ order_name }}` imprime o nome da encomenda, `{% for line_item in line_items %}` repete para cada artigo. As variáveis de encomenda do Foliant seguem as do Shopify Order Printer, por isso os modelos escritos para ele funcionam, na maioria, tal como estão. O editor de código está disponível em todos os planos.

## Abrir o editor de código

Abra o modelo no editor e clique no separador **Código**. Os modelos de código abrem diretamente aí. Num modelo visual, vê primeiro o código compilado; clique em **Editar código** para o alterar. Consulte [Alternar entre Visual e Código](https://foliant-help.iforiti.com/pt-PT/template-editor/visual-and-code-modes.md).

O painel esquerdo tem três separadores:

| Separador | O que mostra |
| - | - |
| **Código** | O código do modelo, com realce de sintaxe. A linha e a coluna atuais aparecem na parte inferior. |
| **Variáveis Liquid** | As variáveis e os filtros que pode usar, agrupados (variáveis gerais, detalhes dos artigos de linha, detalhes do cliente…), com **Pesquisar na referência**. |
| **Metacampos** | Como imprimir metacampos de encomendas, clientes, produtos e variantes. Consulte [Metacampos nos modelos](https://foliant-help.iforiti.com/pt-PT/template-editor/metafields.md). |

O painel direito é a pré-visualização em direto. Atualiza-se pouco depois de parar de escrever.

## Inserir um campo

1. Coloque o cursor onde o campo deve ficar.
2. Clique em **Inserir campo**.
3. Procure o campo (por exemplo, "tracking" ou "SKU") em **Pesquisar campos** e clique nele.

O Foliant insere o respetivo Liquid na posição do cursor, por exemplo `{{ shipping_address.city }}`. Os campos dos artigos de linha, como `{{ line_item.sku }}`, só funcionam dentro do ciclo dos artigos de linha: insira **Artigos de linha** para obter o próprio ciclo.

## Pesquisar no código

Clique no botão de pesquisa ao lado de **Inserir campo** (ou prima ⌘F / Ctrl+F no código) para encontrar texto no modelo.

## Erros de código

O editor verifica o código enquanto escreve e assinala os problemas na margem:

* Os **erros** impedem-no de guardar e colocam a pré-visualização em pausa. Um `{{` ou `{%` por fechar é um erro. São listados num aviso **Erros de Código** acima do editor, cada um com **Ir para a linha**.
* Os **avisos** indicam o que pode estar errado, mas não o impedem de guardar, por exemplo um filtro, etiqueta ou objeto Liquid desconhecido, uma etiqueta HTML ou propriedade CSS desconhecida, ou uma etiqueta HTML por fechar.

Ao guardar, o Foliant também verifica o modelo: o Liquid tem de ser legível, as etiquetas HTML têm de estar equilibradas e o SVG inline só pode conter elementos de desenho. Se algo estiver errado, a gravação falha e um aviso **Falha ao atualizar** lista até cinco problemas, com os números de linha quando são conhecidos.

Se o modelo for guardado mas não for possível gerar a pré-visualização, um aviso mostra a mensagem do Liquid e a linha, quando é conhecida.

## Escrever bons modelos

* Os valores monetários estão em cêntimos: imprima-os sempre com um filtro de dinheiro, como `{{ total_price | money }}`. Consulte [Dinheiro e moeda nos modelos](https://foliant-help.iforiti.com/pt-PT/template-editor/liquid-money-and-currency.md).
* Use `| escape` no texto escrito pelos clientes, como notas e moradas: `{{ note | escape }}`.
* Use `{{ 'subtotal' | t }}` para textos que acompanham o idioma do documento. Consulte [Datas, idiomas e traduções](https://foliant-help.iforiti.com/pt-PT/template-editor/liquid-dates-and-languages.md).
* Use os snippets incorporados do Foliant para o IVA: `{% include 'vat_breakdown' %}` imprime a tabela de discriminação do IVA e `{% include 'legal_notes' %}` as notas legais (autoliquidação, exportação, IOSS…).

## Bom saber

* Se um modelo numerado (fatura, nota de crédito ou orçamento) não imprimir `document_number` em lado nenhum, o Foliant acrescenta uma pequena linha com o número no fim do documento. Consulte [Números de documento nos modelos](https://foliant-help.iforiti.com/pt-PT/template-editor/liquid-document-numbers.md).
* Os números de página e os cabeçalhos de tabela repetidos dos modelos de código estão na página de definições do modelo, em **Esquema da página**.
* Para trazer um modelo do Shopify Order Printer ou do Order Printer Pro, use **Importar um modelo** na página Modelos. Consulte [Importar um modelo do Order Printer](https://foliant-help.iforiti.com/pt-PT/templates/import-from-order-printer.md).

## Artigos relacionados

* [O objeto da encomenda e as variáveis comuns](https://foliant-help.iforiti.com/pt-PT/template-editor/liquid-order-variables.md)
* [Filtros Liquid](https://foliant-help.iforiti.com/pt-PT/template-editor/liquid-filters.md)
* [Alternar entre Visual e Código](https://foliant-help.iforiti.com/pt-PT/template-editor/visual-and-code-modes.md)
* [Pré-visualização, tamanho do papel e zoom](https://foliant-help.iforiti.com/pt-PT/template-editor/preview-paper-and-zoom.md)


This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.