Usar temas

Um tema é um conjunto de modelos, módulos, conteúdo global e configurações de estilo que podem ser usados para criar um site. Você pode editar páginas e posts usando um tema com o editor de conteúdo e definir os modelos de blog para usar um tema nas configurações do blog. 

Todas as contas têm acesso a, pelo menos, um tema padrão da HubSpot. Os temas também podem ser baixados no Marketplace de modelos.

Noções básicas sobre os temas

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 de forma personalizada por um desenvolvedor, mas o conteúdo e o layout podem ser personalizados no editor de conteúdo. 
• Módulos: um conjunto de módulos de tema exclusivos que você pode adicionar ao conteúdo usando esse tema. 
• Conteúdo global: conteúdo repetido em várias páginas, como um cabeçalho ou rodapé do site. Você pode editar conteúdo global diretamente do editor de páginas de arrastar e soltar.
• Configurações de tema: configurações de estilo para modelos que usam um tema, incluindo fontes, espaçamento e cores.

Use um tema ativo

Você pode definir um tema ativo para exibir as páginas de tema como as opções padrão para páginas recém-criadas.

A definição ou alteração de um tema ativo não altera o tema utilizado para o conteúdo existente, o que requer a troca do modelo atual do conteúdo. Temas adicionais podem ser comprados no Marketplace de modelos da HubSpot. 

• Acesse seu conteúdo:

  • Páginas do site: Na sua conta da HubSpot, acesse Conteúdo > Páginas do site.
  • Landing pages: Na sua conta da HubSpot, acesse Conteúdo > Landing pages.
• No canto superior direito, clique em Criar.
• Na caixa de diálogo, insira o Nome da página e clique em Criar página.
• Na tela de seleção de tema, passe o mouse sobre um tema e clique em Visualizar tema para abrir uma visualização, ou em Definir como tema ativo para usar este tema como padrão para suas páginas. 

Depois de definir um tema, você será encaminhado para a tela de seleção de modelos sempre que criar uma nova página. Nessa tela, você pode alternar para um tema ativo diferente:

• Clique no menu suspenso Tema e selecione Alterar tema.

• Na tela de seleção de tema, passe o mouse sobre um tema e clique em Visualizar tema para abrir uma visualização, ou em Definir como tema ativo para usar este tema como padrão para suas páginas. 

Criar uma página usando um tema

• Acesse seu conteúdo:

  • Páginas do site: Na sua conta da HubSpot, acesse Conteúdo > Páginas do site.
  • Landing pages: Na sua conta da HubSpot, acesse Conteúdo > Landing pages.
• No canto superior direito, clique em Criar.
• Na caixa de diálogo, insira o Nome da página e clique em Criar página.
• Na tela de seleção de modelo, os modelos do seu tema ativo serão exibidos na seção Modelos do tema. Para visualizar modelos que não fazem parte do tema ativo, clique em Outros modelos.
• Passe o mouse sobre um modelo e clique em Visualizar modelo para visualizar o modelo ou em Selecionar modelo para continuar no editor de conteúdo. 

• No editor de conteúdo, edite o conteúdo da página usando o editor de arrastar e soltar. 

• Para aplicar suas alterações, clique em Publicar ou Atualizar no canto superior direito, depois clique em Publicar agora ou Atualizar agora na caixa de diálogo. 

Aplicar um modelo de tema para blog

Nas configurações do blog, você pode definir um blog para usar o mesmo tema das suas páginas. A modelos de post de blog e de página de listagem de blogs são selecionados separadamente. 

• Na sua conta HubSpot, clique no ícone de configurações settings icon na barra de navegação superior.
• No menu da barra lateral esquerda, navegue até Contente > Blogue.
• Se você tiver vários blogs, clique no menu suspenso Selecionar um blog para modificar e selecione um blog. 
• Clique na guia Modelos.
• Nas seções Modelo de post de blog e Página de listagem de blogs, clique no menu suspenso Ações e selecione Alterar modelo.

• Na tela de seleção de tema, selecione o tema e, em seguida, um modelo usando esse tema. No canto inferior direito, clique em Concluído. 

• Após definir os modelos de post de blog e de página de listagem de blogs, clique em Salvar no canto inferior esquerdo. 

Observação: para páginas de listagem de blogs que podem ser editadas no editor de conteúdo, essas etapas levarão ao editor de conteúdo e não à tela de seleção do tema. 

Editar configurações de tema

Nas configurações de tema, você pode personalizar o estilo do seu tema, incluindo fonte, cores e espaçamento. Os estilos editados aqui são aplicados a todas as páginas e módulos de temas incluídos neste tema. Aprender mais sobre gerenciando configurações de tema.

Gerenciar temas

No gerenciador de design, você pode editar, clonar ou copiar um tema para outra conta da HubSpot. Você também pode excluir temas padrão da HubSpot, temas clonados e temas personalizados, bem como criar temas secundários. 

Você pode editar as configurações de tema de um tema filho sem afetar o tema pai, mas isso não criará cópias adicionais dos ativos do tema. Para copiar os ativos de um tema pai, é recomendável clonar o tema. 

Clonar um tema

Para editar os arquivos codificados de temas padrão no gerenciador de design, clone-os primeiro. Os temas comprados node Marketplace de modelos não podem ser clonados; em vez disso, é recomendado criar um tema secundário. 

• Na sua conta da HubSpot, acesse Conteúdo > Design Manager.
• No Finder, clique na pasta @hubspot. Esta pasta contém todos os temas e módulos padrão, incluindo arrastar e soltar módulos de e-mail . 
  
• Clique com o botão direito do mouse em uma pasta do tema e selecione Clonar tema. 

• Na caixa de diálogo, insira um nome para o tema e clique em Criar.

O tema será copiado na pasta raiz e listado no localizador com suas outras pastas. 

Criar um tema secundário

No gerenciador de design, você pode criar um tema secundário (uma cópia de um tema comprado) com base em um tema comprado no Marketplace de modelos ou em um tema padrão da HubSpot. Você pode editar as configurações de tema de um tema filho sem afetar o tema pai. 

Os desenvolvedores também podem crie temas filho com base em temas personalizados e crie temas filho usando a CLI usando nossa documentação para desenvolvedores. Saiba mais sobre trabalhando com temas filhos. 

Copiar um tema para outra conta

Você pode copiar uma pasta de tema de uma conta para outra. Você deve ser um usuário com Ferramentas de design permissões em ambas as contas.

Observação: as pastas de tema nos diretórios @hubspot ou @marketplace não podem ser copiadas entre contas.

Para copiar um tema para uma conta:

• Na sua conta da HubSpot, acesse Conteúdo > Design Manager.
• No localizador, passe o cursor do mouse sobre a pasta do tema que deseja copiar, clique com o botão direito do mouse na pasta e selecione Copiar para outra conta. 
  
  
• Na caixa de diálogo, selecione uma conta e clique em Copiar ativo. A pasta aparecerá na conta especificada assim que o processo de cópia for concluído. 

Carregar um tema

Usuários em Centro de conteúdo as contas podem comprar temas HubSpot no ThemeForest Marketplace da Envato e, em seguida, carregá-los no HubSpot a partir da tela de seleção de temas: 

• Acesse a seção HubSpot CMS Hub do Marketplace doe ThemeForest da Envato. 
• Compre um tema do mercado.
• Você receberá um e-mail com um código de compra para o seu tema comprado. Copie o código de compra. 

• Acesse seu conteúdo:

  • Páginas do site: Na sua conta da HubSpot, acesse Conteúdo > Páginas do site.
  • Landing pages: Na sua conta da HubSpot, acesse Conteúdo > Landing pages.
• No canto superior direito, clique em Criar.
• Na caixa de diálogo, insira o Nome da página e clique em Criar página. 
• Na tela de seleção do modelo, clique no menu suspenso Tema e selecione Alterar tema. 

• No canto superior direito, clique em Instalar um tema do ThemeForest.

• Na caixa de diálogo, cole o código de compra do e-mail e depois clique em Instalar tema. 
• Na nova guia, faça login no Marketplace do ThemeForest da Envato para concluir o processo de instalação. 

Quando você tiver conectado com sucesso, será exibido um banner no HubSpot. O tema pode levar alguns minutos para ficar disponível. 

Excluir um tema

Os temas padrão da HubSpot, os temas clonados e os temas carregados podem ser excluídos no gerenciador de design:

• Na sua conta da HubSpot, acesse Conteúdo > Design Manager.
• No localizador , Clique no pasta com os ativos do tema.
• Clique no menu suspenso Arquivo e selecione Excluir [nome da pasta]. 
• Na caixa de diálogo, marque a caixa de seleção Estou certo de que quero excluir esta pasta, em seguida, clique em Excluir esta pasta. 

Os temas comprados devem ser desinstalados do Marketplace de modelos: 

• Na sua conta HubSpot, clique no ícone do Marketplace marketplace na barra de navegação superior e, em seguida, selecione Marketplace de modelos.
• Clique na guia Comprado. 
• Passe o mouse sobre o tema, em seguida, clique no menu suspenso Ações e selecione Desinstalar. 
• Na caixa de diálogo, clique em Desinstalar.