Gerenciador de design | Perguntas frequentes

Encontre rapidamente respostas e informações gerais sobre a ferramenta de gerenciamento de design no HubSpot. Este recurso também inclui links para mais recursos de designers que trabalham no CMS.

Onde posso saber mais sobre fazer projetos no HubSpot?

Para saber mais sobre como projetar no HubSpot, confira a Certificação de Design do HubSpot Academy e a documentação de CMS da HubSpot. 

A Certificação de Design é uma certificação gratuita que inclui treinamento de vídeo e uma prática de design. 

A documentação de CMS da HubSpot inclui:

• Documentos de referência CMS do HubSpot
• Documentos de referência do HubL
• HubSpot Boilerplate CSS
• Tutoriais
• Exemplos de inspiração
• Blog de designers

Há um recurso HubSpot que posso usar para solucionar problemas de design ou HubL personalizado?

O melhor recurso para interagir com a comunidade de designers da HubSpot é o Fórum de design do HubSpot. Esse fórum é monitorado por designers e usuários do HubSpot com experiência em design.

Para perguntas relacionadas ao desenvolvimento da API do HubSpot, confira o Fórum de desenvolvedores. 

Como faço para obter acesso por FTP ao HubSpot?

Em 27 de maio de 2020, o FTP foi descontinuado e substituído pelo CMS CLI. Saiba mais sobre esse anúncio.

Posso editar um grupo global para um único modelo?

Embora os módulos globais possam ser convertidos para um módulo local, os grupos globais não podem. Para editar um grupo global para um modelo único, clone-o; e adicione esse clone ao modelo.

Qual versão do Bootstrap de inicialização o Criador de modelos do HubSpot usa?

O editor de layout da HubSpot usa um sistema de grade de 12 colunas com base noBootstrap 2.x para permitir que os designers do modelo criem rapidamente  páginas Web completamente responsivas  na plataforma de conteúdo do HubSpot.

Posso usar minha própria grade responsiva com modelos do HubSpot?

Todos os layouts de arrastar e soltar do HubSpot incluem layout.css para tornar os módulos responsivos. Se você quiser usar uma grade responsiva diferente ou personalizada, como o Bootstrap 3, precisará substituir o CSS no layout.css ou usar modelos codificados, onde layout.css não está anexado.

Como faço para estruturar o layout de blog e layout de listagem?

Módulos de conteúdo do Blog permitem editar a marcação da publicação e layout de listagem para controlar onde será a renderização de vários elementos de um problema de publicação de um item. 

Posso reverter para uma versão anterior de um modelo?

Todos os layouts de modelos, arquivos codificados e páginas têm um histórico de revisão que permite acompanhar qualquer versão de um modelo ou parte de conteúdo. Para modelos ou arquivos codificados, clique em Ações > Exibir revisões para acessar o histórico de revisão. 

Design Manager v2

Qual é a diferença entre "widget" e "módulo" ao fazer referência a campos de módulo?

A estrutura de módulo v1 referencia os campos de módulo usando {{ widget.field }}. A estrutura v2 referencia os campos de módulo usando {{ module.field }}.

No entanto, o {{ widget.field }} na estrutura v2 continuará a funcionar como esperado. Não é necessário atualizar seus módulos personalizados para referenciar "módulo."

Como posso anexar arquivos JS e CSS sem "get_publication_template_url"?

Em vez de usar "get_public_template_url" para acessar os arquivos do JavaScript e CSS, esses arquivos agora podem ser anexados diretamente ao editor de barra lateral na seção de arquivos vinculados . Os arquivos CSS e JS incluídos aqui serão carregados automaticamente nas páginas usando o módulo.

Como faço para adicionar módulos HTML personalizados ou HubL personalizados ao meu modelo?

Os módulos HTML e HubL foram removidos. Esses módulos forneceram uma maneira rápida de os desenvolvedores adicionarem snippets de HTML e HubL a um modelo. No entanto, eles podem dificultar a compreensão e edição dos modelos. Para tornar os modelos mais previsíveis e fáceis de manter, esses módulos foram removidos para manter todo o código dentro do contexto de módulos personalizados.

Se você precisar adicionar HTML no nível da página em um site, o módulo HTML pode ser baixado do HubSpot Marketplace.

Como posso usar os plug-ins do JS com meu módulo personalizado?

Se você estiver usando um script de terceiros, vinculará o arquivo de script na seção de Arquivos vinculados no editor de módulo. Em seguida, você pode acionar o plug-in na seção do JS do editor de código. Se você precisar transferir parâmetros para o plug-in, poderá usar atributos de dados na seção HTML + HubL do editor para armazenar esses valores.

Ao atualizar, há uma solicitação sobre onde eu gostaria de usar esse módulo. Qual é a diferença entre essas opções?

Se você estiver usando um módulo personalizado em um e-mail, as seções CSS e JS não aparecerão no editor porque as folhas de estilo e o JavaScript não são suportados na maioria dos clientes de e-mail. Para módulos de e-mail, você ainda pode incluir o estilo nas tags <style>.

Se estiver usando um módulo nas páginas ou publicações de blog, as seções JS e CSS serão exibidas como esperado.

Há alguma alteração em como os módulos na v2 do Design Manager são codificados?

Os módulos em v2 do gerente de design são agrupados em tags <div>, mas os módulos no gerenciador de design antigo foram agrupados em tags <span>. Essa alteração afetará apenas seu módulo, se você estiver referenciando o intervalo de módulo em uma folha de estilo. Por exemplo, a seguinte declaração não se aplica ao novo Design Manager:

span #hs_cos_wrapper_widget_5038393204 { Color: blue; }

Você pode substituir a tag <span> por uma tag <div>.No entanto, não é recomendável depender dos envoltórios padrão do HubSpot para escrever seu CSS. Em vez disso, é melhor usar classes de CSS personalizadas, como “my-custom-module”.

Recebo um erro de "Módulos aninhados" ao atualizar meu módulo. Como faço para resolver isso e publicar o módulo?

Saiba mais sobre como identificar e resolver um erro de módulo alinhado. Para módulos aninhados usados em vários modelos, é melhor clonar o módulo primeiro para prevenir a perda de conteúdo no nível da página. Em seguida, solucione os erros no módulo clonado e use esse clone em seus modelos a partir de agora.

Como faço para adicionar um grupo global ao meu módulo?

Em vez de usar {%include %} em seu módulo personalizado para adicionar um grupo global, você pode adicionar um campo de menu ao módulo ou editar o conteúdo global dos módulos. 

Posso usar os meus módulos personalizados no novo Design Manager?

Sim, ou pode editar todos os módulos antigos no editor de módulo. Você verá avisos de validação e sugestões para qualquer código que não seja suportado na estrutura do módulo v2, mas poderá continuar editando e usando esses módulos no HubSpot.

Embora você possa manter todos os módulos personalizados existentes, não poderá criar novos módulos usando a estrutura antiga. Se você clonar um módulo antigo, o módulo clonado será criado na nova estrutura do módulo.