Criar e personalizar modelos usando o Shopify Order Printer

É possível criar e personalizar modelos usando o app Shopify Order Printer no admin da Shopify. Por padrão, o app Shopify Order Printer inclui os seguintes modelos:

  • Fatura: uma fatura que você pode enviar para um cliente.
  • Guia de remessa: uma impressão do endereço da sua loja e do endereço de entrega do cliente.

Use o Liquid para criar seus modelos personalizados de outros elementos da embalagem, como cupons, etiquetas ou comprovantes.

Considerações sobre a criação de modelos no app Shopify Order Printer

Leve em conta o seguinte antes de criar modelos no app Shopify Order Printer:

Criar modelo

Crie um modelo para o documento do pedido.

Etapas:

  1. No admin da Shopify, clique em Configurações > Apps e canais de vendas.

  2. Na página Apps e canais de vendas, clique em Order Printer.

  3. Clique em Abrir app.

  4. Clique em Modelos.

  5. Clique em Criar um modelo.

  6. No campo Nome, insira um nome para o modelo, como etiqueta ou cupom.

  7. Na seção Editar código, adicione código HTML, CSS ou Liquid para criar o modelo.

  8. Opcional: para ver o modelo, clique em Pré-visualizar.

  9. Clique em Salvar.

Editar modelo

Você pode editar um modelo existente. Se quiser saber mais, consulte Exemplos de personalizações de modelo.

Etapas:

  1. No admin da Shopify, clique em Configurações > Apps e canais de vendas.

  2. Na página Apps e canais de vendas, clique em Order Printer.

  3. Clique em Abrir app.

  4. Clique em Modelos.

  5. Clique no modelo que você quer editar.

  6. Na seção Editar código, adicione ou edite código HTML, CSS ou Liquid.

  7. Opcional: para ver o modelo, clique em Pré-visualizar.

  8. Clique em Salvar.

Exemplos de personalizações de modelo

Confira os exemplos a seguir para saber como personalizar modelos do Shopify Order Printer:

É possível adicionar um logo ao modelo.

Etapas:

  1. No admin da Shopify, acesse Conteúdo > Arquivos.
  2. Clique em Fazer upload de arquivos e selecione o arquivo de imagem que você quer enviar.
  3. Para copiar o URL da imagem do logo, clique no ícone de link.
  4. Clique em Configurações > Apps e canais de vendas.
  5. Clique em Order Printer.
  6. Clique em Modelos.
  7. Clique no nome do modelo que você quer editar.
  8. No editor de código, cole este bloco de código:

liquid <div style="text-align: center;"> <img style="width: 4em;" src="YOUR_IMAGE_URL_HERE"> </div>

  1. Substitua YOUR_IMAGE_URL_HERE no código pelo URL da imagem.
  2. Opcional: para alinhar o logo, altere o valor text-align para left, right ou center.
  3. Opcional: para ajustar a largura do logo, altere width para um valor maior ou menor, como 8em ou 2em.
  4. Opcional: para ver o modelo, clique em Pré-visualizar.
  5. Clique em Salvar.

Exemplo:

Confira no exemplo a seguir como o HTML precisa aparecer depois que você adiciona o logo ao modelo:

Exemplo que exibe um bloco de código de como adicionar um logo a um modelo

Espaçar totalmente as larguras das tabelas

É possível adicionar margens à tabela e ampliá-la até 100% de largura, basta adicionar a classe table-tabular.

Etapas:

  1. No admin da Shopify, clique em Configurações > Apps e canais de vendas.

  2. Na página Apps e canais de vendas, clique em Order Printer.

  3. Clique em Abrir app.

  4. Clique em Modelos.

  5. Clique no modelo que você quer editar.

  6. No editor de código, encontre a tabela que você quer editar e adicione a classe table-tabular à tabela.

  7. Opcional: para ver o modelo, clique em Pré-visualizar.

  8. Clique em Salvar.

Exemplo:

<table class="table-tabular">
    ...
</table>

Exibir miniaturas de produtos

É possível adicionar miniaturas de produtos ao modelo de pedido. Mas, para isso, você precisa inserir um bloco de código personalizado.

Etapas:

  1. No admin da Shopify, clique em Configurações > Apps e canais de vendas.

  2. Na página Apps e canais de vendas, clique em Order Printer.

  3. Clique em Abrir app.

  4. Clique em Modelos.

  5. Clique no modelo que você quer editar.

  6. Adicione o bloco de código liquid {{ line_item.product.featured_image | product_img_url: 'thumb' | img_tag }} ao modelo.

  7. Opcional: para ver o modelo, clique em Pré-visualizar.

  8. Clique em Salvar.

Adicionar informações do pedido

É possível adicionar informações do pedido aos modelos, como nome, quantidade e preço dos itens comprados.

Etapas:

  1. No admin da Shopify, clique em Configurações > Apps e canais de vendas.

  2. Na página Apps e canais de vendas, clique em Order Printer.

  3. Clique em Abrir app.

  4. Clique em Modelos.

  5. Clique no modelo que você quer editar.

  6. No editor de código, use variáveis do Liquid para incluir as informações do pedido e HTML para adicionar a formatação. Por exemplo, {{ line_item.price | money }} exibe o preço do item.

  7. Opcional: para ver o modelo, clique em Pré-visualizar.

  8. Clique em Salvar.

Exemplo:

Nayara quer editar o modelo de guia de remessa para incluir uma lista dos itens a serem enviados. Ela adiciona o código abaixo ao final do modelo Guia de remessa no app Shopify Order Printer. Agora, as guias de remessa de Nayara incluem uma tabela que lista os itens comprados.

liquid <br> <br> <table class="table-tabular" style="margin: 0 0 1.5em 0;"> <thead> <tr> <th>Quantity</th> <th>Item</th> {% if tax_lines.size > 0 %} <th>Taxes</th> {% endif %} <th>Price</th> </tr> </thead> <tbody> {% for line_item in line_items %} <tr> <td>{{ line_item.quantity }} x</td> <td><b>{{ line_item.title }}</b></td> {% if line_item.tax_lines %} <td> {% for tax_line in line_item.tax_lines %} {{ tax_line.price | money }} {{ tax_line.title }}<br/> {% endfor %} </td> {% endif %} <td>{{ line_item.price | money }}</td> </tr> {% endfor %} </tbody> </table>

Tudo pronto para começar a vender com a Shopify?

Experimente de graça