WordPress: como editar templates CSS e PHP

Pensando em customizar templates CSS e PHP no WordPress? Este tutorial irá ajudá-lo a editar arquivos de tema como functions.php ou style.css através do editor de skins.

WordPress: Como personalizar modelos CSS e PHP

Editar PHP através do editor de temas

No WordPress, a ferramenta Theme Editor é usada para editar arquivos de modelo. Esse recurso permite editar diretamente os arquivos CSS e PHP individuais do modelo que você está usando. Você pode usá-lo, por exemplo, para editar o arquivo functions.php .

Aparência do tema do editor WordPress
Editor de Temas – Aparência
💡 Tip: Choosing the right hosting is crucial for a fast website ⏱ . I recommend betting on verified quality ➡️ Bluehost, SiteGround or GoDaddy.

Aviso sobre os riscos da edição direta de modelos

A ferramenta Editor deve ser usada com cautela. Isso ocorre porque se você fizer alterações nos arquivos que afetam a aparência da sua página de maneira incorreta, a página pode não ser exibida. Na melhor das hipóteses, ele será exibido incorretamente.

O próprio WordPress notifica você com uma janela pop-up com a mensagem:

Parece que você está fazendo edições diretas no seu tema por meio do painel do WordPress. Recomendamos não fazê-lo! A edição direta de temas pode tornar seu site inoperante e pode ser perdido durante a atualização. Se você precisar ajustar mais do que apenas temas CSS, tente criar um tema derivado .

Se você decidir continuar com suas edições diretas, use o gerenciador de arquivos para criar uma cópia com um novo nome, deixando o original como está. Dessa forma, você pode restaurar a versão funcional se algo der errado.

Modelo de editor de notificação do WordPress
Notificação de edição direta do modelo

Se você não tem conhecimento de HTML, CSS ou PHP, as alterações que você fizer podem deixar a página completamente fora do ar. Portanto, recomendo usar esse recurso somente se você tiver o conhecimento necessário.

Dica: se você conseguir largar o site, faça login via ftp no arquivo que você editou e desfaça a alteração.

Como editar modelos CSS do WordPress

É melhor usar o recurso de edição CSS para editar o estilo do tema, onde você também pode acompanhar as alterações ao vivo. Você pode usá-lo, por exemplo, para editar o arquivo style.css .

Você pode chegar lá clicando em Editar CSS no menu:

Modelo WordPress - Como editar CSS
Modelo WordPress – Como editar CSS

Clique para ir diretamente ao editor (também chamado de Customizador):

Editor CSS do WordPress
WordPress: editor de CSS

Adicione seu próprio código CSS aqui para personalizar a aparência e o layout do seu site. Saiba mais sobre CSS .

Você pode usar o teclado para mover:

  • Na área do editor, a tecla Tab insere uma guia.
  • Para sair da área do editor, use a tecla Esc seguida da tecla Tab.
  • Usuários de leitores de tela: talvez seja necessário pressionar Esc duas vezes para sair do modo de formulário.

A caixa de edição destaca automaticamente a sintaxe do código. Você pode desabilitar isso no modo de texto em seu perfil de usuário.

💡 Tip for themes: From premium themes, I have good experience with themes Divi, Avada and with page builder Elementor.

Editando CSS e PHP no WordPress – conclusão

É melhor usar o tema filho para editar arquivos PHP , pois as alterações feitas diretamente no modelo serão perdidas durante a atualização. Além disso, existe o risco de você jogar fora o site.

Também é aconselhável usar o tema filho para editar CSS , mas isso requer conhecimento de programação, portanto, o editor mencionado acima será suficiente para os usuários .

💡 Do you want a faster ⏱ website? Website speed is important for both visitors and SEO. I got the best results thanks to the WP Rocket plugin, which I highly recommend.
Was this article helpful for you? Support me by sharing, please. 👍
WordPress Návod v PDF

LEAVE A REPLY

Please enter your comment!
Please enter your name here