Pular para o conteúdo
GloboGlobo Docs
Instalar app
Português (Brasil)

Lista de links

Adicione uma coluna de links, o bloco clássico de mega menu, com ícones, imagens e selos opcionais.

Referência Todos os planos 3 min de leitura

Um título e uma lista de links, divididos em uma ou mais colunas. Use para categorias, marcas, tamanhos ou qualquer lista de páginas.

Adicione o bloco

  1. Escolha um layout

    No painel do mega menu da pré-visualização, clique em Adicionar bloco. Clique em Lista de links, passe o mouse sobre um layout e clique em Selecionar.

    (1) Clique em Lista de links, (2) escolha um layout.

  2. Clique em Adicionar itens abaixo da lista na pré-visualização ou na lista Elementos. Clique no bloco para abrir Editar item e preencha cada link; clique em Remover para excluir um.

    O bloco Lista de links na prévia, com as configurações em Editar item.

  3. Salve e publique

    Clique em Salvar e depois em Publicar.

Layouts

A aba Lista de links começa com quatro layouts especiais: Hover image links (links com imagem ao passar o mouse), Feature list (lista de recursos), Feature list row (lista de recursos em linha) e Button. Veja Links com imagem ao passar o mouse, Lista de recursos e Botão. Os layouts clássicos de lista de links são:

2 colunas
Um título com os links divididos em 2 colunas.
3 colunas
Um título com os links divididos em 3 colunas.
Simples
Um título com uma coluna de links.
Links com ícone
Um ícone antes de cada link.
Links com imagem
Uma imagem pequena antes de cada link.

Configurações

Bloco

LarguraPadrão: Depende do layout
Quanto da linha do mega menu o bloco ocupa: Automático ou de 8,33% a 100%.
Número de colunasPadrão: 1 (2 ou 3 nos layouts de colunas)
Distribui os links em 1 a 6 colunas.
Cor de fundoPadrão: Transparente
Fundo do bloco inteiro.
VisibilidadePadrão: Desativado
Ocultar no desktop, Ocultar no celular, Ocultar quando estiver logado, Mostrar somente quando estiver logado, Agendar publicação. Veja Configurações que todo bloco tem.
Nome de classe extraPadrão: Vazio
Em Avançado. Uma classe CSS para o CSS personalizado.
É título
Estiliza o link como título de coluna. Um título sem link aparece como texto simples.
Ícone
Um ícone exibido antes do link. Veja Ícones dos itens do menu.
Largura do ícone
Aparece quando o ícone é uma imagem enviada: Automático ou Personalizado (%, px, em ou rem).
Título
O texto do link.
Link
Pesquise uma página, produto, coleção ou post de blog, ou cole uma URL. Marque Abrir em nova aba para abri-lo em uma nova aba.
Image icon / Image width
Em layouts com imagens, como Links com imagem: a imagem pequena antes do link e seu tamanho (Automático ou Personalizado).
Descrição
Uma linha curta de texto abaixo do link.
SeloPro
Um pequeno rótulo, como “Novo” ou “Promoção”, ao lado do link. Ative Alternar selo e defina o Título do selo, a Cor do texto do selo e a Cor de fundo do selo.

Dicas

  • Coloque um link com É título no topo de cada lista.
  • Termine a lista com um link View all que leve à coleção completa.

Esta página foi útil?

Relatar um problema