Como personalizar uma fatura no WooCommerce

Publicados: 2020-04-08

Seja qualquer coisa, as pessoas sempre ficam impressionadas com a aparência e a sensação. Na verdade, quando se trata de vários tipos de documentos WooCommerce, os donos de lojas não podem comprometer sua aparência. O dono da loja pode querer incluir diferentes tipos de informações na fatura, dependendo de suas necessidades de negócios. Da mesma forma, o cliente também gostaria de receber uma fatura que realmente contenha informações relevantes como prova de sua compra.

O plugin WooCommerce PDF Invoices, Packing Slips, Delivery Notes & Shipping Labels consiste em modelos de fatura predefinidos a partir dos quais você pode criar a fatura com os dados relevantes de sua escolha.

[Gap = Vão]

Em primeiro lugar, instale e ative o plugin em sua loja WooCommerce. Navegue até o menu Fatura/Pacote no seu painel, que o redirecionará para a página Configurações gerais.

A página de configurações gerais consiste em diferentes tipos de documentos (fatura, guia de remessa, etiqueta de remessa, etiqueta de remessa, etiqueta de endereço e nota de entrega) que são habilitados por padrão para os usuários. Você pode clicar em Configurações em um tipo de documento para definir as respectivas configurações. Ative/desative o respectivo tipo de documento usando o botão de alternância.

Os valores configurados nas Configurações gerais, como o logotipo da empresa, endereços, etc., contêm informações comuns que são usadas em todos os tipos de documentos. Se esses elementos estiverem configurados nas configurações gerais, esses valores serão preenchidos por padrão em todos os tipos de documentos, sempre que aplicável. No entanto, são fornecidas provisões para substituir as configurações gerais das configurações de tipo de documento individual.

Configurações gerais da fatura do WooCommerce

Configurações gerais da fatura do WooCommerce

Para personalizar o layout da fatura, vá para as configurações da fatura clicando na guia de configurações no tipo de documento da fatura. As opções de personalização juntamente com os layouts integrados são integrados na guia Personalizar das configurações da fatura, conforme mostrado abaixo.

Fatura WooCommerce ou configurações de fatura de embalagem - Personalizar

Fatura WooCommerce ou configurações de fatura de embalagem - Personalizar

Alguns dos modelos de faturas predefinidos disponíveis no plugin são clássicos, reais e imperiais, que podem ser acessados ​​a partir da opção de alteração de layout localizada no canto superior esquerdo da janela.

Layouts de fatura do WooCommerce

Layouts de fatura do WooCommerce

Você pode selecionar qualquer modelo entre as opções disponíveis e prosseguir para personalizá-lo. A visibilidade de cada elemento da fatura pode ser controlada pelo botão de alternância incorporado nesta aba. Além disso, alguns elementos genéricos como tamanho da fonte, estilo, cor e outros atributos específicos de cada elemento também podem ser alterados conforme sua necessidade.

Vejamos alguns atributos de personalização. Alguns elementos genéricos que podem ser encontrados mais comumente em todos os elementos são:

      • Texto: Permite inserir um texto personalizado para o respectivo atributo.
      • Tamanho da fonte: permite definir o tamanho da fonte para o atributo. Insira um valor numérico em termos de pixels.
      • Estilo: Permite selecionar um estilo de texto. Consiste em duas opções; Normal e Negrito.
      • Cor do Texto: Permite selecionar uma cor de texto.

        Atributos comuns da guia de personalização da fatura do WooCommerce

        Atributos comuns da guia de personalização da fatura do WooCommerce

      • Text Align: Permite definir o alinhamento do texto.
        Ele contém duas opções; direita e esquerda.
      • Título: permite definir um título personalizado.

        WooCommerce Invoice-Customize Tab-Common attribute-Text align and Title

        WooCommerce Invoice-Customize Tab-Common attribute-Text align and Title

Outros campos de personalização específicos são:

Logotipo da empresa: Use esta opção para definir o logotipo da empresa especificamente para a fatura. Se o logotipo já estiver carregado nas configurações gerais, ele será preenchido aqui por padrão.

  • Logo da empresa:
    • Exibir : permite adicionar o logotipo da empresa ou o nome da empresa à fatura.
    • Largura e altura do logotipo: permite ajustar a largura e a altura do logotipo em pixels.
    • Detalhes extras : Permite incluir texto adicional, que será colocado abaixo do logotipo ou nome da empresa. Digite o texto “nenhum”, para não incluir nenhum texto adicional.
    • Extra Font Size : Permite definir o tamanho da fonte, aplicável apenas para o nome da empresa.
    • Cor do cabeçalho:

      Campos WooCommerce Invoice-Customize Tab-Company Logo

      Campos WooCommerce Invoice-Customize Tab-Company Logo

  • Número da fatura:  
    • Data da fatura: Data do pedido: Formato de guia de personalização de fatura do WooCommerce

  • Tabela de produtos: esta tabela conterá informações relacionadas a produtos, como SKU do produto, nome do produto, quantidade e preço total. Você pode personalizar o tamanho da fonte, o alinhamento do texto e a cor.
  • Este campo contém os seguintes elementos para personalizar a tabela de produtos:
    • Head Color : Permite definir a cor do cabeçalho da tabela de produtos.
    • Cor do texto : permite definir a cor do texto na seção do cabeçalho da tabela de produtos.
    • SKU Align : Permite definir o alinhamento do SKU na tabela de produtos.
      Ele contém três opções; Direita, Esquerda e Centro.
    • Alinhamento do produto: permite definir o alinhamento do produto na tabela de produtos. As escolhas são; Direita, Esquerda e Centro.
    • Alinhamento de Quantidade: Permite definir o alinhamento para o número de produtos na tabela de produtos. Também oferece; Opções Direita, Esquerda e Central.
    • Price Align: Permite definir o alinhamento do preço dos produtos na tabela de produtos.
    • Total Price Align: Permite definir o alinhamento do preço total dos produtos na tabela de produtos.
    • Cor do corpo : Permite definir a cor do texto do corpo da tabela de produtos.
    • SKU : Permite definir o texto personalizado para a coluna da tabela indicando as informações do SKU.
    • Produto : Permite definir um texto personalizado para a coluna da tabela indicando o nome do produto.

      Tabela WooCommerce Invoice-Customize Tab-Product

      Tabela WooCommerce Invoice-Customize Tab-Product

  • Visualização : Antes de ativar o layout, você pode ter uma amostra da fatura do pedido recente no formato PDF. Para obter a pré-visualização de um pedido específico, digite o respectivo número de pedido no campo fornecido.

    Fatura WooCommerce ou configurações de fatura de embalagem- Personalizar-Visualização

    Fatura WooCommerce ou configurações de fatura de embalagem- Personalizar-Visualização

  • Editor de código : Você pode até alternar para o editor de código, para fazer personalizações adicionais além das listadas no editor visual.

    Fatura WooCommerce ou configurações de fatura de embalagem- Editor de código personalizado

    Fatura WooCommerce ou configurações de fatura de embalagem- Editor de código personalizado

  • Ajuda : Ao fazer alterações por meio do editor de código, seria melhor você consultar a ajuda que informa sobre espaços reservados, classes alternativas para suporte a RTL, etc., conforme mostrado abaixo:

    Fatura WooCommerce ou Configurações de fatura de embalagem- Personalizar-Código Editor-Ajuda

    Fatura WooCommerce ou Configurações de fatura de embalagem- Personalizar-Código Editor-Ajuda

Conclusão

Para obter as faturas com seus próprios detalhes personalizados, como logotipo da empresa, endereços, etc, é definitivamente uma vantagem para os lojistas. Em modelos construídos e recursos de editor de código permite gerar faturas com detalhes personalizados.