Como ocultar um item por Editor CSS?

Tem um item em sua página que está te incomodando ou você simplesmente não deseja exibi-lo? Fique tranquilo, nesse manual você irá aprender a ocultar itens através do editor css.

Nesse exemplo vamos ocultar o título da vitrine (TESTE NOVIDADES)

1° passo:

Vamos clicar com o botão direito do mouse e selecionar a opção "inspecionar" (ou Ctrl+Shift+I):

Assim irá ser exibido um painel com os códigos do site:

Você pode trabalhar com o painel ao lado direito, esquerdo, abaixo ou até em outra tela separada, basta selecionar o modo de exibição:

Nesse exemplo vamos escolhes o modo abaixo da tela, mas fica de sua preferência.

2° passo:

Clique na opção de selecionar um elemento, assim é só selecionar um elemento desejado, onde nesse exemplo é o título da vitrine:

3° passo:

Após selecionado o elemento nós vamos adicionar uma função para ocultá-lo, que será display: none

Encontramos o elemento que é .products-section-hd, como mostra na figura abaixo:

Agora vamos adicionar o display: none nos códigos deste elemento, abaixo de "font size" e "color" :

Nesse primeiro momento você irá visualizar que realmente o título da vitrine não está sendo mais exibido, mas ainda devemos salvar essa alteração. Faremos isso através da plataforma.

4° passo:

Em seu painel administrativo selecione a opção Aparência Editor CSS;

5° passo:

Agora vamos copiar o código que editamos e colar no campo do editor:

Lembrando que sempre que for copiar algum código é de muita importância entender que a ordem é:

 I:  .nome-do-elemento

II: abrir colchetes { 

III: dados do elemento

IV: fechar colchetes }

Então quando for copiar o código é sempre até o final dos colchetes, onde determina o final do código:

 COPIA

 COLA

SALVA

Pronto! O elemento está oculto. 

**Lembrando que devido a cache de navegador as alterações podem demorar para serem exibidas no site.

Se deseja aprender como alterar a cor de um elemento clique aqui.