CMS-General

Crie um modelo codificado personalizado no HubSpot

Ultima atualização: November 21, 2018

Disponível para

Marketing Hub
marketing-basic-pro-enterprise
Professional, Enterprise
Basic

Embora seu criador de modelos forneça aos seus criadores de conteúdo mais flexibilidade em termos de estruturação de coneúdo e salva designers de ter que escrever o HTML, sua ferramenta de gerenciamento de design também permite designers construir modelos com HTML do zero.  

Este artigo mostra onde codificar modelos personalizados no HubSpot e quais variáveis incluem em modelos de e-mail personalizados. Se você não for um designer que codifica modelos de planilhas do zero confortavelmente, use um dos modelos de planilhas prontos para a sua conta da HubSpot ou confira omodelo de mercadoparacomprar modelos pré-preparados.

Observe: Os sites HTML ou e-mails do zero não garantem que seu modelo seja responsivo

Criar um novo arquivo HTML_e HUBL

Na sua conta da HubSpot, navegue até Marketing > Arquivos e modelos > Ferramentas de design.

Crie um novo arquivo clicando em Ações>Novo arquivo (pode ser necessário clicar na pasta ícone da pasta para expandir o localizador).

Na caixa de diálogo, clique em HTML_e HUBL.

Editor de código

Insira os detalhes do seu novo arquivo:

  • O que você está construindo?: Escolhamodeloou modelo parcial
  • Tipo de modelo: Selecione o tipo de modelo que você está vendo (página, blog ou e-mail).
  • Nome de arquivo Dê um nome ao arquivo.
  • Clique em Criar.

Em seguida, escreva o HTML para sua página ou modelo de e-mail. O editor de código da HubSpot, destaca seu HTML sincronizado e fecha suas tags para você. Qualquer erro no seu código será sinalizado em uma mensagem de erro quando você tentar publicar alterações. O console de erros na parte inferior do editor de código exibirá os detalhes de erro ou aviso, além de sugestões sobre como corrigir esses erros e avisos.

- console de erro

Para recursos adicionais em design personalizado, você pode consultar a documentação do HubSpot designer. Há documentação adicional nas opções de módulo codificados, como tags de filtro e ícones.

Quando terminar, clique em Publicar alteraçõespara publicar o arquivo ou o arquivo HTML.

Adicionar as tags de HubL obrigatórias

Assim que você tiver seu HTML aberto, você verá uma mensagem de erro indicando que o seu código está perdendo tags da HubL se você tentar publicar seu arquivo. As tags do HubL conectam seu código às configurações e editor de conteúdo da HubSpot. Saiba sobre as variáveis de modelo obrigatórias e tags do módulo HubL.

Para modelos de e-mail, inclua o e-mail obrigatório eo tokens do CAN-SPAM. Confira a documentação do HubL para saber mais sobre o tokens do CAN-SPAM.

Os tokens de can necessários podem ser incluídos de duas maneiras:

1. Incluir um token que puxará na seção do CAN de cancelamento de assinatura: "". Quando esse token é usado, você não tem a capacidade de formatar o idioma e estilo do texto e links. Aqui está um exemplo do que "" pareceria assim:

Você precisa adicionar os seguintes tokens individualmente:

25 1st St.
Cambridge
MA
02141

2. Inclua o link de cancelamento individual necessário e endereço toktos:
HubSpot
ou (inclua pelo menos um)
HubSpot
25 1st St.
Cambridge
MA
02141

Usar o tokens individualmente permitirá a flexibilidade para adicionar palavras ao redor dos tokens e links e para formá-los no estilo desejado e lingua.

Clonar para HTML

Uma alternativa à codificação do zero é clonagem de modelos da HubSpot para HTML. Clonar um modelo para HTML dá acesso a um modelo HTML/HubL de um modelo é uma excelente maneira de reverter o engenheiro de um modelo do HubSpot que você tem construído.

Para criar uma versão codificado de um modelo existente, clique em Ações > Clonar para HTMLno editor de layout. O arquivo HTML será aberto em uma nova guia do seu gerenciador de design. O nome será corresponde ao nome do modelo da planilha original comcópia anexado a ele.

Captura de tela do artigo de Ajuda da HubSpot