Como Editar Tema WordPress: Explorando o Editor e 5 Maneiras de Personalizar seu Site

Um tema do WordPress é um conjunto de arquivos — incluindo imagens, folhas de estilo e códigos — que define a aparência visual e a funcionalidade básica de um site.

Apesar de no geral serem bastante completos, os temas do WordPress nem sempre incluem os elementos visuais e recursos que você pode precisar. Para resolver esse problema, o WordPress possui um editor de temas integrado, que permite modificar os arquivos de tema do WordPress diretamente do painel de controle.

Se você não conhece este recurso do CMS, não se preocupe: nos parágrafos abaixo, nós explicaremos como personalizar um tema do WordPress usando o editor de temas. Nós também falaremos sobre cinco outros métodos para editar seu site e daremos algumas dicas úteis para você seguir ao editar seu tema no WordPress.

Como Usar o Editor de Tema do WordPress

O editor de temas do WordPress permite que você abra arquivos de qualquer tema instalado. Ele exibe o conteúdo dos arquivos no editor de texto para que você possa ajustar o código do tema diretamente no painel de controle. 

Embora esta ferramenta seja chamada de Editor de Temas nas versões mais antigas do WordPress, o WordPress 5.9 (e posteriores) passou a chamá-la de Editor de Arquivos de Tema.

Para acessar o editor de código dos temas, basta ir até Aparência -> Editor de Arquivos de Tema. No lado direito, será exibida uma lista de arquivos de template que o tema inclui. Clique em qualquer arquivo para ver seu conteúdo e fazer alterações.

Para selecionar outros temas que você queira modificar, simplesmente navegue até o canto superior direito da tela e clique no menu suspenso para encontrar mais opções de tema.

No entanto, selecionar outro tema não mudará o tema ativo no seu site. Vá para Aparência -> Temas para ver o tema atualmente ativo ou ativar outro.

Assim que você terminar de personalizar o arquivo do tema, clique no botão Atualizar Arquivo . O editor de tema do WordPress impede os usuários de salvar o arquivo se houver erros de sintaxe no código. Ele também indicará onde o erro está localizado, tornando mais fácil corrigi-lo.

Considerando que a maioria dos temas usa arquivos CSS, JavaScript e PHP, é importante garantir que você tenha algum conhecimento dessas linguagens. Tenha cuidado ao editar ou colar trechos de código, pois fazer isso de forma incorreta pode resultar em erros ou até mesmo bloquear seu acesso ao site.

Os arquivos de tema variam dependendo do template. No entanto, todo tema do WordPress inclui esses arquivos essenciais:

• Folha de estilo (style.css) – contém elementos relacionados ao design, incluindo fontes, cores e layouts. Você pode adicionar CSS personalizado a este arquivo e alterar a aparência de todo o site.
• Functions.php – determina os recursos e funcionalidades do tema, como widgets, imagens em destaque e logotipos personalizados.
• Arquivos de template – uma combinação de HTML, tags de template e códigos PHP que determina a exibição de conteúdo em qualquer página, como uma postagem, a página 404 e a página de arquivo.

Se você é um desenvolvedor trabalhando para um cliente, talvez seja melhor desativar o acesso ao editor de temas. Fazer isso evitará erros indesejados, pois o cliente pode não conhecer os potenciais riscos de editar o código do tema.

Além disso, desativar o acesso ao editor de código do tema pode impedir que hackers injetem código malicioso no website.

Outras Maneiras de Personalizar um Tema WordPress

O editor de temas do WordPress não é a única ferramenta disponível para personalizar o tema e a aparência do seu site. Nesta seção, falaremos sobre alguns métodos adicionais para personalizar um tema do WordPress. 

1. Editando os Arquivos do Tema através do Gerenciador de Arquivos

Os arquivos de tema do WordPress são armazenados em sua conta de hospedagem, e é possível modificá-los usando um gerenciador de arquivos. Aqui estão os passos para fazer isso usando o hPanel da Hostinger.

1. Vá para o seu painel de controle e clique em Gerenciador de Arquivos.
2. Abra a pasta public_html .

3. Vá para a pasta wp_content -> themes.

4. Esta pasta contém todos os temas que você baixou para o seu site WordPress. Clique duas vezes no nome da pasta do tema que você deseja editar.
5. Selecione um arquivo de tema e clique com o botão direito para selecionar Editar.

6. O gerenciador de arquivos abrirá o editor de texto para que você possa editar o arquivo. Clique no botão ícone Salvar no canto superior direito assim que terminar.

2. Usando o Editor de Site Baseado em Blocos

Os usuários do WordPress também podem personalizar seus temas usando a chamada edição de blocos.

Para usar este editor, você precisará do WordPress 5.9 ou superior e um tema baseado em blocos, como o Twenty Twenty-Two ou o Wabi.

Então, você pode personalizar os templates da página inicial, dos posts e das  páginas. Acesse o editor navegando até Aparência -> Editor do Site.

O editor abrirá o template da página inicial como padrão. Veja todos os templates disponíveis clicando no logo do WordPress no canto superior esquerdo da tela e selecionando Modelos.

Como este é um editor baseado em blocos, é possível personalizar e reorganizar todos os blocos do WordPress existentes. Temos um guia completo sobre como usar o editor de blocos Gutenberg, mas aqui estão as principais ações a ter em mente:

• Clique no botão mais no canto superior esquerdo do editor para abrir a biblioteca de blocos. Selecione um dos blocos para inseri-lo no conteúdo.
• Clique no botão configurações no canto superior direito da tela para abrir o template e as configurações de bloqueio. Sempre que você selecionar um bloco, as ferramentas de design para aquele bloco aparecerão aqui.
• Clique no círculo preto e branco no canto superior direito da tela para abrir o painel de estilos globais. Este painel permite que você personalize a cor, as fontes e os elementos de layout para todo o site sem usar nenhum código CSS.

3. Instalando Criadores de Páginas

Muitos temas do WordPress são compatíveis com criadores de páginas do WordPress, como o Divi, o Elementor e o Beaver Builder. A maioria desses plugins possui funcionalidade de arrastar e soltar, que permite ajustar o tema sem editar o código.

Para personalizar seu site usando um criador de páginas, instale um plugin compatível com seu tema e use as opções fornecidas para editar o design de suas páginas.

Embora os criadores de páginas ofereçam flexibilidade e muitas opções de personalização para o seu site, eles também apresentam desvantagens.

Os criadores de páginas do WordPress convertem o layout do site em shortcodes específicos daquele plugin. Portanto, caso você desative o plugin do criador de páginas, os shortcodes não funcionarão e você perderá suas modificações.

4. Utilizando Plugins do WordPress

Instalar um plugin adicional é uma boa opção se o seu site precisa apenas de um recurso adicional básico. O diretório de plugins do WordPress possui milhares de opções, variando desde e-commerce e plugins de segurança até integrações com mídias sociais e otimização SEO para WordPress.

Antes de instalar qualquer plugin, verifique quando ele foi atualizado pela última vez, dê uma olhada nas avaliações dos usuários e na compatibilidade com a versão mais recente do WordPress. Plugins frequentemente atualizados geralmente têm menos problemas de segurança e compatibilidade, enquanto as avaliações dos usuários podem indicar sua qualidade geral.

Se você só quer fazer edições básicas no estilo e no design do tema, use um plugin como o CSS Hero. Ele gera uma cópia da folha de estilo e substitui a original, permitindo que os usuários modifiquem o design e o estilo do site sem mexer nos arquivos originais do tema.

5. Usando um Tema Filho

Uma das desvantagens de editar diretamente os arquivos do seu novo tema é que você perderá as alterações quando o tema em si for atualizado.

Para não passar por esse problema, sua melhor opção é instalar ou criar um tema filho (child theme). Um tema filho é uma versão adicional do seu tema que herda todas as características do tema pai.

Os temas filhos têm seus arquivos style.css e functions.php armazenados em um diretório separado, então você pode criar novos arquivos para personalizar o estilo, os parâmetros de layout e os scripts dentro do diretório do tema filho. Esses arquivos não serão afetados quando o tema pai for atualizado.

Existem várias maneiras de criar um tema filho no WordPress. Entre elas, você pode configurar uma pasta de tema filho através do gerenciador de arquivos ou instalar um plugin como o WPS Child Theme Generator.

Dicas Extras ao Editar Temas do WordPress

Embora a edição do código original do tema usando o editor de temas lhe dê controle total sobre o resultado, isso também pode fazer com que seu site perca partes necessárias do código e apresente problemas.

Por isso, a seção abaixo cobrirá algumas práticas de segurança a serem seguidas antes de personalizar seu tema do WordPress.

Sempre Crie Arquivos de Backup

Criar um backup do seu site WordPress é essencial ao fazer edições significativas. Com um backup, você evita ter que refazer as configurações e personalizações do zero se algo der errado.

No entanto, você nem sempre precisa de um backup completo. Por exemplo, salvar uma cópia do arquivo stylesheet.css é suficiente se você estiver editando apenas este arquivo. Se algo der errado, faça o upload do arquivo de backup para sobrescrever as alterações.

Configure um Ambiente de Testes Local ou Remoto

Use um ambiente de teste para realizar e visualizar as edições que você faz no seu tema do WordPress. Usar um servidor local ou site de testes evita que erros indesejados apareçam no seu site em si.

Para fazer isso, você precisará instalar o WordPress localmente usando o MAMP ou o WampServer. Com isso, você terá um ambiente para instalar e testar o WordPress no seu computador local.

Outra maneira é usar um ambiente de testes remoto para espelhar seu site. Ao contrário da solução do servidor local, isso é feito na sua conta de hospedagem ou através do painel do WordPress.

Você pode usar um plugin como o WP Staging para configurar um clone do seu site a partir do painel do WordPress. O plugin fornecerá a URL do site clone – basta fazer login e começar a editar o tema.

Também vale a pena notar que o WP Staging armazena os arquivos do site de teste em um subdiretório do seu site.

Por exemplo, se seu site WordPress está instalado no diretório public_html , o site de teste estará na pasta public_html/nome_do_site_de_teste.

\A Hostinger também oferece um ambiente de teste que você pode acessar a partir do hPanel. Este recurso está disponível para usuários da hospedagem Business, hospedagem WordPress Business e nossos planos de hospedagem Cloud.

Assim que estiver satisfeito com as alterações e tiver certeza de que não há erros, cole os arquivos de preparação no banco de dados do site em si.

Use um Controle de Versão

O controle de versão permite que os usuários acompanhem e desfaçam as alterações feitas em um site WordPress, permitindo que eles restaurem versões anteriores do site caso algo dê errado.

Este método de prevenção é ótimo para quem trabalha em equipe, pois também é uma excelente ferramenta para o trabalho colaborativo. O controle de versão facilita a fusão de alterações e o teste de novas ideias sem comprometer a versão ao vivo do site.

Existem várias soluções para implementar o controle de versão no WordPress. Uma deles é usar repositórios Git, como o GitHub e o GitLab, para armazenar e acompanhar alterações de código.

Outra opção é instalar um plugin como o WP Rollback, que permite que você retorne seu site para qualquer estado anterior.

Conclusão

O WordPress oferece aos seus usuários muitas opções de personalização e ferramentas para modificar o código do site, incluindo o editor de código do tema. Ele oferece uma maneira fácil de acessar o código-fonte do tema a partir do painel, permitindo que você ajuste seu web design e adicione novos recursos.

No entanto, recomendamos o uso do editor de temas apenas se você tiver algum conhecimento em linguagens de programação, pois as alterações podem substituir ajustes anteriores e potencialmente causar problemas no seu site.

Portanto, certifique-se de implementar certas precauções para evitar problemas irreversíveis:

• Crie arquivos de backup
• Use um ambiente de testes local ou remoto
• Use o controle de versão para reverter alterações

Alternativamente, use métodos que envolvam menos riscos ao editar o tema do site, como instalar um plugin, usar o editor de blocos ou criar um tema filho. Boa sorte!

Perguntas Frequentes sobre o Editor de Tema do WordPress

Agora que você entende como o Editor de Temas do WordPress funciona, aqui estão algumas perguntas mais frequentes sobre ele.