Inserindo um código CSS personalizado na sua Cometa Page

O CSS personalizado é uma poderosa ferramenta para quem deseja personalizar ainda mais o design do seu site na Cometa Page. Ele permite ajustes finos que vão além das configurações padrão do Elementor, oferecendo controle total sobre a aparência dos elementos da sua página. A seguir, você aprenderá como inserir CSS personalizado globalmente e diretamente em elementos específicos.

Acessando o Editor Elementor

 

1 . Para começar, acesse o editor Elementor na página que deseja personalizar. Clique no ícone de três linhas horizontais no canto superior esquerdo para abrir o menu principal.

2. Acessando o CSS Personalizado nas Configurações do Site

 

 

3. No menu aberto, selecione a opção “Configurações do site”. Isso abrirá as configurações globais, onde você pode definir CSS que se aplicará a todo o site.

4. Dentro das configurações, clique na opção “CSS personalizado”. Aqui, você pode adicionar qualquer código CSS que será aplicado globalmente em todas as páginas do seu site.

 

No campo que se abre, você pode digitar ou colar o código CSS desejado. Esse código afetará todos os elementos que corresponderem ao seletor CSS utilizado.

Alternativa: Inserindo CSS em Elementos Específicos

Além de adicionar CSS globalmente, você pode aplicar CSS personalizado diretamente a elementos específicos usando o painel de opções do próprio Elementor.

 

Selecionando o Elemento:

  • Selecione o elemento que deseja personalizar na sua página. No menu lateral, clique na aba “Avançado” e, em seguida, role para baixo até encontrar a opção “Custom CSS”.

Usando o Seletor “selector”:

  • Dentro do campo “Custom CSS”, você pode usar o prefixo selector para direcionar o estilo exclusivamente para o elemento selecionado. Por exemplo, selector {background-color: #000;} aplicará uma cor de fundo preta apenas ao elemento selecionado.

O que é o Selector?

O prefixo selector no Elementor é uma referência ao elemento específico que você está editando. Quando você utiliza selector {}, o código CSS dentro dessas chaves será aplicado diretamente ao elemento selecionado, sem a necessidade de escrever classes ou IDs complexos. Isso torna a personalização mais eficiente e direcionada, especialmente útil quando você quer aplicar estilos únicos a um único elemento sem afetar outros elementos na página.

Com essas duas abordagens, você pode personalizar completamente o visual do seu site na Cometa Page, seja aplicando mudanças globais ou ajustes detalhados em elementos específicos.

WhatsApp
Email
X
Facebook
LinkedIn
Telegram