Saltar para o conteúdo principal
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. O painel esquerdo tem três separadores: 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.
  • 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.
  • 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.
  • 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.

Artigos relacionados