FULL.

Bem vindo ao
Blog da FULL.

Aprenda, crie e cresça seu negócio na internet.

Encontre conteúdos, dicas, tutoriais e novidades sobre as principais ferramentas Wordpress

Siga a FULL.

Como usar o WordPress Theme Customizer como um profissional (Guia definitivo)

Você está em:

Como usar o WordPress Theme Customizer como um profissional (Guia definitivo)

Você sabia que o WordPress vem com um personalizador de temas integrado que permite que você faça alterações facilmente no design do seu site em tempo real.

Embora todos os temas tenham algum nível de suporte para as opções do personalizador padrão, muitos temas incluem guias e opções adicionais para o personalizador de temas do WordPress, para que você possa personalizar facilmente seu tema sem nenhum conhecimento de codificação.

Neste artigo, guiaremos você pelos painéis padrão e mostraremos como usar o personalizador de temas do WordPress como um profissional.

Como usar o Guia definitivo do personalizador de temas do WordPress

Como acessar o personalizador de temas do WordPress

O personalizador de temas é um recurso padrão do WordPress e faz parte de todos os sites do WordPress .

Você pode acessá-lo fazendo login na área de administração do WordPress e, em seguida, acessando Aparência » Personalizar na barra lateral esquerda do painel de administração do WordPress. Isso abrirá a interface do Customizer com seu tema atual.

Como acessar o Personalizador do WordPress

Você também pode usar a página do personalizador de temas do WordPress para qualquer um dos temas instalados em seu site, mesmo quando não estiverem ativos.

Isso permite que você veja uma visualização ao vivo desse tema e faça alterações antes de ativá-lo.

Para fazer isso, você precisa ir para a página Aparência » Temas .

Em seguida, passe o cursor do mouse sobre qualquer tema instalado e clique no botão Visualização ao vivo para abrir a página do personalizador de temas do WordPress.

Opção de visualização ao vivo do tema WordPress

Como usar o personalizador de temas do WordPress

Depois de abrir o personalizador de temas do WordPress, você verá todas as configurações de personalização no lado esquerdo da tela e a visualização ao vivo do seu site no lado direito.

Personalizador de temas WordPress

O personalizador de temas do WordPress vem com um conjunto de painéis padrão, independentemente do tema que você está usando.

Você precisa clicar nos painéis individuais para fazer alterações nele. Você também pode clicar em qualquer um dos ícones de lápis azul no lado direito da tela para abrir as configurações desse item específico.

Nota: os temas avançados do WordPress adicionarão painéis de configuração adicionais para opções extras de personalização (mais sobre isso posteriormente).

Vamos dar uma olhada nas opções padrão disponíveis no personalizador de temas do WordPress.

Painel de identidade do site: adicione título, logotipo e favicon

O painel Identidade do Site no personalizador de temas do WordPress permite adicionar ou alterar o título e o slogan do seu site.

Por padrão, o WordPress adiciona “Apenas outro site WordPress” como o slogan do site.

É recomendável alterá-lo após instalar o WordPress em seu site . Você também pode mantê-lo em branco, se quiser.

Configurações de identidade do site para alterar o título do site, slogan, logotipo e favicon

O painel Identidade do Site no personalizador de temas do WordPress também permite que você adicione o logotipo do seu site. Simplesmente, clique na opção Selecionar logotipo para fazer o upload do logotipo do seu site.

Quer adicionar um favicon ao seu site? Você pode fazer isso clicando na opção Selecionar ícone do site . Para obter instruções detalhadas, você pode seguir nosso guia sobre como criar e adicionar um favicon ao seu site .

WordPress Theme Customizer: mude as cores do seu site

Os controles no painel Cores variam principalmente dependendo do tema do WordPress que você está usando.

Por exemplo, o tema Twenty Seventeen permite que você escolha a cor do texto do cabeçalho e selecione um esquema de cores para todo o seu site.

Mude as cores do seu site

Outros temas do WordPress podem oferecer diferentes opções de cores para os elementos do site, como: títulos, links, corpo do texto, plano de fundo do seu site, etc.

Adicionando menus de navegação no personalizador de temas

O painel Menus permite criar menus de navegação e controlar sua localização em seu site.

Nesta tabela, você encontrará todos os menus existentes do WordPress que você criou anteriormente. Você pode clicar no botão “Ver todos os locais” para verificar os locais de menu disponíveis que seu tema suporta.

Painel de menus no personalizador de temas

Para criar um novo menu, você precisa clicar no botão Criar novo menu .

Depois disso, você precisará dar um nome ao seu menu, para que possa gerenciá-lo facilmente mais tarde. Você também pode selecionar o local do menu e clicar em Avançar para continuar.

Criar um novo menu de navegação

Para adicionar itens a este menu, você precisa clicar no botão Adicionar itens para abrir um novo painel. Agora você pode adicionar links, páginas, postagens, categorias e tags personalizados como itens de menu.

Adicionar itens ao menu de navegação

Para reordenar os itens, você pode clicar no link Reordenar e usar os ícones de seta para ajustar os itens do menu.

Controle Widgets em seu site no personalizador de temas

O painel Widgets permite adicionar e gerenciar os widgets em seu site.

Ao clicar nele, você verá os diferentes locais onde você pode adicionar widgets. Isso irá variar dependendo do tema que você está usando.

Por exemplo, o tema Twenty Seventeen oferece 3 locais de widget, enquanto o tema Twenty Nineteen vem com apenas um local.

Painel de widgets

Ao clicar em qualquer um deles, você verá os widgets que adicionou anteriormente a esse local.

Para adicionar um novo widget, você precisa clicar no botão “Adicionar um widget”. Isso abrirá um novo painel onde você verá uma lista de todos os widgets disponíveis.

Adicione widgets ao seu site

Você precisa clicar naquele que deseja adicionar. Você também pode fazer alterações nos widgets recém-adicionados e ajustar sua posição arrastando-os para cima ou para baixo.

Painel de configurações da página inicial no personalizador de temas

Por padrão, o WordPress exibe as últimas postagens do blog em sua página inicial.

No entanto, para sites de negócios, os usuários preferem usar uma página inicial personalizada. Ele permite que você tenha uma página de destino adequada que exiba seus produtos e serviços.

Para usar uma página inicial personalizada, você precisa selecionar o botão de opção “Uma página estática” no painel Configurações da página inicial .

Configurações da página inicial no personalizador de temas

Isso abrirá dois novos menus suspensos que você pode usar para selecionar uma página para sua página inicial e outra para exibir suas postagens no blog.

Caso você não tenha as páginas em seu site, você pode criar uma nova clicando no link “+ Adicionar nova página” presente abaixo do menu suspenso. Isso criará uma página em branco com o nome de sua escolha.

Painel CSS adicional para adicionar CSS personalizado

Deseja adicionar código CSS personalizado para estilizar seu site? Você pode fazer isso no painel CSS adicional .

Usuários intermediários e avançados do WordPress geralmente personalizam seu site adicionando código CSS diretamente ao arquivo style.css de seu tema. Isso adiciona etapas adicionais, como ter acesso FTP à sua hospedagem WordPress , modificar arquivos de tema, etc.

Uma solução mais fácil para iniciantes é adicionar seu código CSS personalizado ao painel CSS Adicional no personalizador de temas do WordPress. Isso permitirá que você faça alterações em seu site e as veja ao vivo no lado direito da tela.

Adicione o código CSS personalizado ao painel CSS adicional;

Quando você começa a escrever algum código CSS, o WordPress automaticamente sugere atributos para você com base nas letras que você digita. Ele também exibirá mensagens de erro se você não tiver escrito uma instrução CSS adequada.

Nota: Se você quiser personalizar seu site sem escrever nenhum código, continue lendo. Compartilharemos duas opções amigáveis ​​para iniciantes que permitirão que você personalize facilmente seu tema e até crie um tema WordPress personalizado .

Outras opções do personalizador de temas

Alguns temas gratuitos e premium oferecem mais opções de personalização de temas.

Dependendo do tema que estiver usando, você poderá alterar o estilo da fonte, adicionar uma imagem de fundo , alterar o layout, modificar cores, adicionar imagens de cabeçalho aleatórias e muito mais.

Você também pode adicionar recursos específicos ao seu personalizador de temas com a ajuda de plugins. Por exemplo, você pode adicionar fontes personalizadas no WordPress usando o plug-in Easy Google Fonts .

Visualize seu site em diferentes resoluções de tela

É importante que todos os proprietários de sites se certifiquem de que seu site seja responsivo para dispositivos móveis e tenha uma boa aparência em todos os tamanhos de tela.

Graças ao personalizador de temas do WordPress, você pode verificar facilmente a aparência do seu site em diferentes tamanhos de tela.

Na parte inferior do painel do Personalizador de Temas, você encontrará três ícones e o link “Ocultar controles”.

Visualize o site em diferentes resoluções de tela

Esses ícones permitem que você teste seu site em diferentes resoluções de tela, como desktop, tablet e dispositivos móveis.

O link Ocultar controles é útil para ocultar o painel do WordPress Customizer para que você possa visualizar seu site corretamente no modo desktop.

Publique, salve ou agende suas configurações do personalizador

Depois de fazer as alterações necessárias, você precisa aplicá-las ao seu site. Caso contrário, todo o seu trabalho duro será perdido.

Vá em frente e clique no botão Publicar para aplicar as alterações. Uma vez feito, você pode clicar no botão fechar, presente no canto superior esquerdo da tela, para sair do personalizador de temas.

Publicar configurações do personalizador do WordPress

E se você precisar de mais tempo para finalizar seu novo design? Nesse caso, você pode salvá-lo como rascunho e até compartilhar seu novo design com alguém sem dar acesso à sua área de administração.

Para fazer isso, você precisa clicar no ícone de engrenagem ao lado do botão Publicar . Isso abrirá o painel Ação.

Opção Salvar Rascunho do Personalizador do WordPress

Aqui você encontrará três opções: Publicar, Salvar rascunho e Agendar.

Você precisa selecionar o botão Salvar Rascunho no painel Ação e clicar no botão Salvar Rascunho para armazenar suas alterações.

Agora você pode copiar o link de visualização e compartilhá-lo com outras pessoas para obter feedback.

Por outro lado, a opção Agendar permite que você publique suas alterações em uma data e hora específicas. Você pode usar essa opção para agendar suas alterações de tema para serem publicadas no momento em que você receber menos tráfego.

Agendar configurações do Personalizador em uma data específica

Por fim, se você quiser redefinir as alterações não publicadas, clique no link Descartar alterações no painel Ação.

Visualize temas diferentes sem entrar ao vivo

Há momentos em que você deseja verificar como um novo tema ficaria em seu site. No entanto, você não deseja ativá-los em seu site ao vivo.

Nesse caso, você pode abrir o WordPress Customizer para testar novos temas sem entrar no ar.

No painel do Personalizador, você encontrará o nome do seu tema ativo e o botão Alterar .

Alterar o tema do WordPress do personalizador

Se você clicar nesse botão, o WordPress exibirá todos os seus temas instalados no lado direito da página.

Para verificar um tema específico, você precisa clicar no botão Visualização ao vivo .

Visualizar temas instalados no personalizador de temas

Você também pode visualizar temas do Repositório de Temas do WordPress. Para fazer isso, você precisa marcar a caixa de seleção “Temas WordPress.org” no painel esquerdo.

Isso mostrará temas do diretório WordPress.org. Você pode clicar no botão “Instalar e visualizar” para verificar o tema que você gosta.

Diretório de temas do WordPress

Você também pode filtrar os temas clicando no botão Filtrar temas presente no canto superior direito da tela.

Observação: recomendamos o uso de um site de teste do WordPress para testar novos temas em vez de usar o personalizador em um site ao vivo.

Importar ou exportar configurações do personalizador de tema

Você sabia que pode importar e exportar as configurações do personalizador de temas?

Isso é extremamente útil quando você está fazendo alterações em seu tema em seu servidor local ou em um site de teste . Em vez de copiar as configurações manualmente para o seu site ao vivo, você pode simplesmente exportar as configurações do personalizador de temas para economizar seu tempo.

Para obter instruções detalhadas, você pode seguir nosso guia sobre como importar e exportar configurações do personalizador de temas no WordPress .

Alternativas ao personalizador de temas do WordPress

Embora o WordPress Customizer permita que você faça alterações em seu site, o número de controles varia de acordo com o tema que você está usando.

E se você gostar do seu tema, mas desejar que ele tenha opções extras de personalização?

Nesse caso, a melhor solução é usar um dos dois plugins de personalização que funcionam junto com o personalizador de temas do WordPress.

Herói CSS

Plugin herói CSS

CSS Hero é um plugin do WordPress que permite que você personalize seu site sem escrever uma única linha de código. Você tem a liberdade de estilizar cada elemento do seu site sem qualquer aborrecimento.

Deseja personalizar a página de login do seu site WordPress ? CSS Hero permite que você faça isso em poucos minutos.

Você também pode editar e visualizar as alterações no frontend para garantir que seu design fique perfeito em todos os dispositivos.

Construtor de castores

Plugin Beaver Builder

O Beaver Builder é um dos melhores plugins de construção de páginas do WordPress no mercado. Ele permite que você crie páginas impressionantes para o seu site usando uma interface de arrastar e soltar.

A melhor parte é que o Beaver Builder funciona com quase todos os temas do WordPress. Isso permite que você o use com seu tema atual.

O Beaver Builder suporta o uso de códigos de acesso e widgets. Ele também oferece diferentes tipos de módulos que você pode usar para estilizar facilmente seu site. Consulte nosso guia sobre como criar layouts personalizados no WordPress para obter instruções detalhadas.

Você também pode usar o Beaver Builder para criar um tema WordPress completamente personalizado sem escrever nenhum código.

Esperamos que este guia tenha ajudado você a aprender como usar o WordPress Theme Customizer como um profissional. Você também pode querer ver nosso guia sobre os melhores plugins e ferramentas do WordPress para o seu site .

Se você gostou deste artigo, assine nosso canal do YouTube para mais tutoriais em vídeo do WordPress. Você também pode nos seguir no Twitter e no Facebook .

Aprenda com a FULL.

Junte-se a mais de 50 mil pessoas que recebem em primeira mão as principais ferramentas e tecnologia para desenvolvimento web

O meu carrinho
🎁 Faltam 300,00 para liberar o Cupom Secreto
O seu carrinho está vazio.

Parece que ainda não tomou uma decisão.