Ícones no Elementor - como optimizá-los

O Elementor oferece-lhe uma variedade de ferramentas para conceber o seu sítio WordPress e um dos elementos básicos é o ícone. Os ícones não são apenas elementos decorativos, podem também melhorar as experiências funcionais do utilizador e ajudar a comunicar informações importantes num relance. Saiba como utilizar e personalizar ícones no Elementor para melhorar o seu sítio Web.

Principais conclusões

• Os ícones são elementos versáteis que podem cumprir funções artísticas e informativas.
• Pode personalizar os ícones, incluindo a cor, o tamanho, a forma e a animação.
• Uma opção de ligação permite que os ícones sejam utilizados eficazmente para a navegação.

Guia passo-a-passo

Passo 1: Adicionar ícone

Para adicionar um ícone à sua secção, arraste o widget de ícones para a área pretendida da sua página. Verá que é apresentada uma pré-seleção, normalmente um ícone de estrela.

Passo 2: Alterar o ícone

Clique no ícone existente para abrir a janela de seleção. Aqui pode escolher entre uma variedade de ícones. Por exemplo, escolha um ícone de táxi para atribuir um tema específico ao seu conteúdo.

Passo 3: Selecionar o tipo de ícone

O Elementor oferece três tipos de ícones: ícones regulares, ícones sólidos e ícones de marca. Os ícones regulares têm normalmente apenas um contorno, enquanto os ícones sólidos são completamente preenchidos. Os ícones de marca correspondem a logótipos bem conhecidos, como os da Amazon ou da Apple.

Passo 4: Personalizar as definições de visualização

Pode personalizar a apresentação do seu ícone de diferentes formas - utilizando "Stacked" (completamente preenchido), "Framed" (com contorno) ou "Default" (o fundo é apresentado). Escolha a opção que melhor se adapta à estética do seu sítio Web.

Passo 5: Personalizar o tamanho e a forma do ícone

Outro ponto importante é a forma do ícone. Pode escolher se este deve ser circular ou quadrado. Um círculo é muitas vezes visto como mais harmonioso, enquanto um quadrado deixa uma impressão gráfica diferente.

Passo 6: Definir a ligação

Para criar interatividade, pode definir um link. Por exemplo, introduza o endereço da sua página inicial para que os visitantes sejam direcionados para lá quando clicam no ícone.

Etapa 7: Personalizar o estilo

Em "Estilo", tem a opção de definir a cor primária e secundária. Para os efeitos de foco, também pode especificar como as cores devem mudar. Por exemplo, altere a cor primária para vermelho e a cor secundária para preto.

Passo 8: Definir efeitos de passagem

Se pretender aumentar a interatividade, também pode adicionar efeitos de animação para o elemento de pairar. Estes incluem opções como "Empurrar" ou "Crescer". Selecione o efeito pretendido para melhorar a experiência do utilizador.

Passo 9: Definir o tamanho e o espaçamento

Pode ajustar o tamanho do ícone, enquanto o espaçamento, também conhecido como padding, é responsável pela quantidade de espaço que existe entre o ícone e a sua moldura interior. Experimente estes valores para encontrar o equilíbrio desejado.

Passo 10: Valores de ligação

Se pretender efetuar definições individuais para diferentes cantos de um ícone, pode ligar os valores ou ajustá-los separadamente. Os valores ligados asseguram que as alterações são aplicadas a todos os lados em simultâneo.

Passo 11: Verificar as definições avançadas

Nas definições avançadas, encontra as mesmas opções que nas definições básicas. Certifique-se de que tudo está configurado corretamente para garantir uma apresentação consistente no seu sítio.

Resumo

Neste guia, aprendeu os passos básicos para adicionar e personalizar ícones no Elementor. Desde a seleção de ícones à cor, tamanho e ligação, estas técnicas ajudá-lo-ão a criar sítios Web esteticamente agradáveis e funcionais.