Scroll Top

WordPress

Como mudar as cores de um Tema WordPress

Como mudar as cores de um Tema WordPress

Todo desenvolvedor mais cedo ou mais tarde vai se deparar com a necessidade de personalizar o tema do seu cliente ou do seu próprio negócio.

Gravei essa vídeo aula para explicar 2 maneiras de mudar as cores de um tema WordPress que servem para qualquer template.

Vídeo Aula: Como mudar as cores de um Tema WordPress

Nessa aula usamos o Tema Premium Avada para exemplificar as alterações, mas esse tutorial serve para qualquer tema WordPress.

1. Alterar as cores usando o painel de opções do tema

A grande maioria dos templates WordPress vem com um painel de opções do tema, onde você pode trocar cores, exibir ou ocultar opções, e personalizar seu tema. A maneira mais fácil é quando você pode alterar as cores diretamente nesse painel.

Normalmente esse painel se encontra no menu configurações -> Theme Options, ou também no menu Aparência -> Personalizar. No caso do Avada fica no menu Avada -> Theme Options.

2. Alterar as cores usando CSS

O CSS é o código de estilização de um site, e todo elemento de um tema tem uma classe ou ID que pode ser usado como referência para alterar cores, tamanho e outras opções.

Para alterar as cores do tema usando CSS (usando o Chrome) vamos clicar com botão direto no elemento que queremos alterar e selecionar a opção “inspecionar”. Isso irá abrir o developer tools do Chrome e do lado direto vamos poder localizar qual a classe do elemento em questão. Copie essa classe selecionando e usando o CTRL C.

Agora abra o painel do WordPress e vá no menu Aparência -> Personalizar. Clique na guia CSS Adicional. Nessa guia cole a classe selecionada e utilize a propriedade CSS background-color para mudar a cor, como no código abaixo:


.fusion-footer-widget-area{
background-color: #000 !important;
}

Em alguns casos o !important vai ser necessário para sobscrever outras propriedades CSS declaradas no tema.

A cor do background deve ser sempre adicionada com o código hexadecimal, você pode obter esse código no site: HTML color picker.

Depois é só aplicar as alterações e fazer a festa 😉

Como se tornar um Especialista no Desenvolvimento WordPress

Agora quero falar com quem quer dominar o desenvolvimento WordPress e ser capaz de criar sites, sistemas, templates e plugins incríveis.

Eu criei um curso chamado Dollar Developer, onde você vai aprender a se tornar um Especialista no Desenvolvimento WordPress, e dessa forma ser bem remunerado e valorizado pelo seu serviço.

Para saber mais sobre o curso e fazer sua inscrição no Dollar Developer clique aqui

 

adamsilva

Sobre o autor | Website

Bacharel em Análise de Sistemas, trabalha com TI há 7 anos. Especializado em web, programador, blogueiro, baterista e entusiasta de tudo que envolva tecnologia.

Seja o primeiro a comentar!

Para enviar seu comentário, preencha os campos abaixo:

Ebook Gratuito:

Desenvolvimento WordPress Para Iniciantes

Aprenda como configurar seu ambiente de Desenvolvimento WordPress e dar os primeiros passos para começar a desenvolver sites, blogs, temas e plugins.

BAIXAR EBOOK GRÁTIS: