Introdução aos temas

Um tema é um conjunto de modelos, módulos, conteúdo global e configurações de estilo que todos podem usar para criar um site. Os temas são arquivos codificados criados por desenvolvedores usando a documentação de desenvolvedores do CMS. As contas do CMS Hub incluem temas padrão da HubSpot que você pode personalizar para qualquer empresa. Há também temas disponíveis no Marketplace de ativos.

O que é um tema?

Um tema é um conjunto de arquivos para seu site, incluindo:

• Modelos codificados: um conjunto de modelos para seu site, incluindo uma página inicial, uma página "sobre", uma landing page e modelos de blog. Esses modelos são codificados e personalizados por um desenvolvedor, mas o conteúdo e o layout podem ser personalizados facilmente no editor de página de arrastar e soltar.
• Módulos: um conjunto de módulos de tema exclusivos que você pode adicionar e personalizar em qualquer modelo de página naquele tema. 
• Conteúdo global: conteúdo repetido em várias páginas, como um cabeçalho ou rodapé do site. Você pode editar o conteúdo global diretamente no editor de página de arrastar e soltar.
• Configurações de tema: configurações padrão para modelos no seu tema, incluindo fontes, espaçamento e cores. Qualquer nova página que use um modelo de tema terá um estilo consistente.

Visualizar um tema

A maneira mais fácil de visualizar o design do tema é criar uma nova página. No criador de conteúdo, você pode escolher entre dois tipos de temas:

• Temas da HubSpot: os temas padrão da HubSpot incluídos nas contas do CMS Hub Professional e Enterprise.
• Seus temas: temas personalizados criados por um desenvolvedor Web usando a documentação de referência do CMS, incluindo: um desenvolvedor Web na sua equipe, um Parceiro de soluções, a Equipe de migração da HubSpot ou um provedor no Marketplace de ativos. Para contas do CMS Hub, qualquer tema da HubSpot usado para criar páginas também será exibido no painel Seus temas.

Edite o conteúdo para as páginas usando um tema

Cada tema inclui seu próprio conjunto de módulos que seguem as configurações de tema para suas fontes, cores e estilos. Esses módulos são agrupados em linhas horizontais e colunas verticais. Essas linhas ou colunas podem ser agrupadas em seções. Você pode mover e reorganizar esses elementos para personalizar a estrutura do layout da página.

Saiba mais sobre como editar o conteúdo em uma página usando um modelo de tema.

Aplicar um modelo de tema para blog

Se você também estiver hospedando seu conteúdo de blog na HubSpot, considere atualizar seu modelo de blog para o mesmo tema do seu site para obter uma consistência visual. Saiba como aplicar um tema ao seu blog nas configurações do seu blog.

Editar configurações do tema

Para garantir que seu site siga as práticas recomendadas de design visual, os temas precisam ter cores, fontes e estilos consistentes aplicados aos botões, formulários e módulos nos modelos.

Você pode acessar suas configurações de tema no editor de página, clicando na guia Design do painel esquerdo. Os estilos editados aqui são aplicados a todas as páginas e módulos de temas incluídos neste tema. Saiba mais sobre como gerenciar as configurações do tema.

Recursos para desenvolvedores de site

Seu desenvolvedor e equipe de TI podem aproveitar os recursos de segurança e desempenho para sites criados no CMS Hub. Os desenvolvedores podem monitorar o desempenho do site de maneira rápida e fácil com alertas de código. Há também um registro de todas as alterações feitas no conteúdo do site que podem ser acessadas com o ponto de extremidade da API de auditoria de conteúdo. Saiba mais sobre o desenvolvimento de site no CMS e as APIs do CMS para desenvolvedores.

Além de criar temas por meio da CLI do HubSpot, você também pode clonar e editar temas existentes no gerenciador de design da HubSpot. Para clonar um tema:

• Na sua conta da HubSpot, navegue até Marketing > Arquivos e modelos > Ferramentas de design.
• No Finder, clique na pasta @hubspot. Esta pasta contém todos os temas e módulos padrão, incluindo os módulos de e-mail de arrastar e soltar.  
  
  
• Clique com o botão direito do mouse em uma pasta do tema e selecione Clonar tema. 
  
  
• Na caixa de diálogo, nomeie o seu tema e clique em Criar.
• O tema será copiado na pasta raiz e listado no localizador com suas outras pastas.

Com o tema clonado, você pode editá-lo como qualquer outro arquivo codificado, e os usuários poderão criar landing pages e páginas do site a partir do tema.