Personalizar configurações do gerenciador de design

O gerenciador de design tem uma variedade de configurações para que você possa personalizar sua experiência de desenvolvedor. Essas configurações incluem o comportamento padrão de inicialização do gerenciador de design, as configurações de código para arquivos codificados personalizados e o linting para JavaScript.

Para acessar essas configurações:

• Na sua conta da HubSpot, navegue até Marketing > Arquivos e modelos > Ferramentas de design.
• No canto inferior direito, clique em Configurações e selecione Abrir configurações.

• Clique no menu suspenso Configurações para selecionar o tipo de configurações que deseja ajustar.
  
  

Configurações gerais

• Abrir localizador ao iniciar: quando o gerenciador de design for aberto pela primeira vez, o localizador à esquerda sempre abrirá.
• Atualizar o visualizador ao alternar arquivos: quando o visualizador estiver aberto, ele mostrará o arquivo atualmente selecionado. Ative essa configuração se quiser visualizar um arquivo por vez.

Configurações do código

Aparência

• Tema: o esquema de cores usado por editores de código.
• Fonte: a fonte principal e o tamanho da fonte usados pelo editor de código.

Fonte:

• Tamanho da tabulação: a largura de um caractere de tabulação ao pressionar a tecla Tab no editor de código.
• Recuar unidade: o número de espaços que um bloco de código deve ser recuado pelo recuo inteligente.
• Soft tabs: ao pressionar a tecla Tab, insira caracteres de espaço iguais ao tamanho da tabulação, em vez de um caractere de tabulação.
• Recuo inteligente: quando ativado, as novas linhas seguirão o recuo definido da linha anterior.
• Recuar na entrada de formatação: recue a mesma linha na entrada sensível ao contexto. Por exemplo, uma instrução case x: ou uma } de fechamento será recuada corretamente ao ser inserida.
• Recuar com tabulações: use tabulações com recuo automático por meio do recuo inteligente ou da entrada de formatação.
• Quebra de linha: quebre linhas em vez de rolar horizontalmente.
• Fechar automaticamente colchetes: feche automaticamente os caracteres entre colchetes e aspas, como:
  
  () [] {} ’’ ””
• Fechar automaticamente tags: feche automaticamente as tags XML.
• Corresponder colchetes: quando o cursor estiver ao lado de um caractere de colchete, destaque o colchete de abertura ou fechamento correspondente.
• Corresponder tags: quando o cursor estiver ao lado de uma tag, destaque a tag de abertura ou fechamento correspondente.
• Continuar a bloquear os comentários: continue a bloquear os comentários automaticamente ao criar uma nova linha.

Configurações de linting para JavaScript

• Clique para ativar ou desativar a opção Ativar ESLint. A ativação da ESLint executará a ESLint para JavaScript ao exibir a saída em arquivos codificados.
  
  
• No painel esquerdo, defina as configurações de ESLint. Saiba mais sobre como configurar a ESLint.
• No painel direito, uma demonstração de JavaScript refletirá as alterações feitas à esquerda.
• Clique em Restaurar padrão eslintrc para restaurar a configuração padrão.