Guias/Criar conteúdo/Design/Adicionar estilos aos grupos

Adicionar estilos aos grupos

Ao usar blocos de grupo, você pode adicionar estilos de design a grupos de conteúdo. Neste guia, você aprenderá a personalizar um bloco de grupo com cores, bordas e elementos visuais.

Tutorial em vídeo

Aplicar um estilo predefinido a um grupo

Os estilos predefinidos são uma funcionalidade inclusa em vários temas de bloco. Para aplicar um estilo predefinido, siga estas etapas:

  1. Clique em Visualização em lista na parte superior da tela de edição.
  2. Selecione o bloco de grupo.
  3. Na barra lateral de configurações do bloco, clique na guia Estilos (o ícone parece um círculo em preto e branco).
  4. Clique em um estilo para aplicá-lo ao seu bloco de grupo.
The Styles section of the Group block sidebar settings.

Se você não tiver estilos predefinidos, ainda poderá estilizar um bloco de grupo (descrito abaixo).

Alterar as cores de um grupo

Você pode alterar as cores padrão de um bloco de grupo, como a cor de fundo, cor do texto e muito mais. Para alterar as cores usadas em um bloco de grupo, siga estas etapas:

  1. Clique em Visualização em lista na parte superior da tela de edição.
  2. Selecione o bloco de grupo.
  3. Na barra lateral de configurações do bloco, localize a seção Cor .
The "Color" section of the Group block's settings sidebar.
  1. Clique no nome do elemento que você deseja alterar e selecione a nova cor.
  2. Clique no ícone de opções de cor () para ativar as opções de alteração das cores padrão de título e botão.
  3. Clique emSalvarouPublicarpara salvar as alterações.

Saiba mais sobre alteração de cores.

Adicionar uma imagem de fundo

Imagens de fundo deixam o seu conteúdo mais interessante e contextualizado. Para adicionar uma imagem de fundo a um bloco de grupo, siga estas etapas:

  1. Clique em Visualização em lista na parte superior da tela de edição.
  2. Selecione o bloco de grupo.
  3. Na barra lateral de configurações do bloco, localize a seçãoImagem de fundo.
  4. Clique emAdicionar imagem de fundopara selecionar uma imagem da Biblioteca de mídia do site ou fazer upload de uma nova.
The "Background image" section of the Group block's settings sidebar.

Para remover uma imagem de fundo, clique nasopções de imagem de fundo, que é o ícone (⋮) , na seçãoImagem de fundoe selecione o linkRedefinir.

Adicionar uma borda ou sombra

Bordas e sombras dão profundidade e ajudam a destacar visualmente as seções do conteúdo. Para adicionar esses elementos a um bloco de grupo, siga estas etapas:

  1. Clique em Visualização em lista na parte superior da tela de edição.
  2. Selecione o bloco de grupo.
  3. Na barra lateral de configurações do bloco, localize a seção Borda e sombra .
  4. Personalize a borda ajustando o seguinte:
    • Largura: a espessura da borda.
    • Estilo: sólida, tracejada ou pontilhada.
    • Cor: escolha uma das cores predefinidas ou crie uma personalizada.
    • Raio: adicione bordas arredondadas ao seu bloco de grupo.
  5. Clique no menu Opções de borda e sombra (⋮) para exibir a opção Sombra e, em seguida, selecione um dos designs de sombra predefinidos.

Saiba mais sobre configurações de borda e sombra.

Reutilizar estilos

Criar designs consistentes no seu site economiza tempo e melhora a harmonia visual. Para definir estilos padrão para todos os blocos de grupo, siga estas etapas:

  1. Navegue até Aparência → Editor → Estilos.
  2. Localize o bloco de grupo na seção Blocos e defina seu plano de fundo, borda e outros estilos de sua preferência.
  3. Clique em Salvar para aplicar essas configurações a todos os blocos de grupo.

Observação: você ainda pode personalizar blocos de grupo individualmente na barra lateral de configurações do bloco.

Saiba mais sobre como configurar estilos para seu site.

Copied to clipboard!