Você está procurando uma maneira fácil de editar HTML em seu site WordPress?
A linguagem de marcação de hipertexto ou HTML é um código que informa a um navegador da web como exibir o conteúdo das suas páginas da web. A edição de HTML é útil para personalização avançada e solução de problemas.
Neste artigo, mostraremos como editar HTML no editor de código do WordPress usando diferentes métodos.
Por que você deve editar HTML no WordPress?
O WordPress oferece milhares de temas e plug-ins para alterar a aparência do seu site e personalizar diferentes elementos sem tocar em uma única linha de código.
No entanto, plug-ins e temas têm suas limitações e podem não oferecem os recursos exatos que você está procurando. Como resultado, você pode não conseguir estilizar seu site da maneira que deseja.
É aqui que a edição de HTML é realmente útil. Você pode realizar facilmente a personalização avançada usando o código HTML. Ele fornece muita flexibilidade e controle sobre a aparência e o funcionamento de seu site.
Além disso, aprender a editar HTML também pode ajudá-lo a identificar e corrigir erros em seu site WordPress quando você não tem acesso ao painel.
Observação: se você não deseja editar HTML, mas ainda deseja opções de personalização completas, recomendamos arrastar e soltar construtor de páginas do WordPress como SeedProd .
Dito isso, vamos examinar as diferentes maneiras de editar HTML em um site do WordPress .
Cobriremos como editar HTML usando o editor de blocos e o editor clássico, e também mostraremos uma maneira fácil de adicionar código ao seu site. Você pode clicar nos links abaixo para ir direto para a seção de sua preferência.
Como editar HTML no WordPress Block Editor Como editar HTML no editor clássico do WordPress Como editar HTML em widgets do WordPress Como editar HTML no WordPress Theme Editor Como editar HTML no WordPress usando FTP Fácil Maneira de adicionar código no WordPress
Como editar HTML no Editor de blocos do WordPress
No editor de blocos do WordPress , existem várias maneiras de editar o HTML de sua postagem ou página.
Primeiro, você pode usar um bloco de HTML personalizado em seu conteúdo para adicionar código HTML.
Para começar, vá até o painel do WordPress e adicione um novo post/página ou edite um artigo existente. Depois disso, clique no sinal de mais (+) no canto superior esquerdo e adicione um bloco”HTML personalizado”.
Em seguida, vá em frente e insira seu código HTML personalizado no bloco. Você também pode clicar na opção’Visualizar’para verificar se o código HTML está funcionando corretamente e como seu conteúdo aparecerá no seu site ativo.
Outra maneira de adicionar ou alterar o código HTML no editor de blocos do WordPress é editando o HTML de um bloco específico.
Para fazer isso, basta selecionar um bloco existente em seu conteúdo e clicar no menu de três pontos. Em seguida, vá em frente e clique na opção ‘Editar como HTML’.
Agora você verá o HTML de um bloco individual. Vá em frente e edite o HTML do seu conteúdo. Por exemplo, você pode adicionar um link nofollow , alterar o estilo do seu texto ou adicione outro código.
Se quiser editar o HTML de toda a sua postagem, você pode usar o’Editor de código’em o editor de blocos do WordPress.
Você pode acessar o editor de código clicando na opção de três pontos no canto superior direito. Em seguida, selecione ‘Editor de código’ nas opções suspensas.
Como editar HTML no Editor do WordPress Classic
Se você estiver usando o editor clássico do WordPress , então você pode editar facilmente o HTML na visualização Texto.
Para acessar a visualização Texto, basta editar uma postagem do blog ou adicionar uma nova. Quando você estiver no editor clássico, clique na guia ‘Texto’ para ver o HTML de seu artigo.
Depois disso, você pode editar o HTML do seu conteúdo. Por exemplo, você pode usar negrito em palavras diferentes para torná-las proeminentes, usar o estilo itálico no texto, criar listas, adicione um índice e muito mais.
Como editar HTML em widgets do WordPress
Você sabia que pode adicionar e editar o código HTML na área de widgets do seu site?
No WordPress, usando um O widget HTML personalizado pode ajudá-lo a personalizar sua barra lateral, rodapé e outros áreas de widget . Por exemplo, você pode incorporar formulários de contato , Google Maps, botões de call to action (CTA) e outros conteúdos.
Você pode começar indo para o painel de administração do WordPress e ir para Aparência »Widgets . Depois disso, vá em frente e adicione um widget de HTML personalizado clicando no botão ‘Adicionar’.
Em seguida, você precisará selecionar onde deseja adicionar o widget HTML personalizado e escolher uma posição. A área do widget dependerá do tema WordPress que você está usando. Por exemplo, você pode adicioná-lo ao rodapé, cabeçalho ou outras áreas.
Depois de selecionar a área e a posição do widget, vá em frente e clique no botão’Salvar widget’.
Depois disso, você pode clicar no widget HTML personalizado, inserir o código HTML e clicar no botão’Salvar’.
Agora você pode visitar seu site para ver o widget de HTML personalizado em ação.
Como editar HTML no Editor de temas do WordPress
Outra maneira de editar o HTML do seu site é por meio do WordPress Theme Editor (Code Editor).
No entanto, não recomendamos que você edite o código diretamente no Editor de temas. O menor erro ao inserir o código pode corromper o seu site e impedir que você acesse o painel do WordPress.
Além disso, se você atualizar o seu tema, todas as suas alterações serão perdidas.
Dito isso, se você está pensando em editar HTML usando o editor de temas, é uma boa ideia faça backup do seu site antes de fazer qualquer alteração.
Em seguida, vá para Aparência »Editor de temas no painel do WordPress. Agora você verá uma mensagem de aviso sobre a edição direta de arquivos de tema.
Depois de clicar no botão’Eu entendo’, você verá seus arquivos de tema e código. A partir daqui, você pode escolher qual arquivo deseja editar e fazer as alterações.
Como editar HTML no WordPress usando FTP
Outro método alternativo para editar HTML em os arquivos de tema do WordPress usam FTP, também conhecido como serviço de protocolo de transferência de arquivos.
Este é um recurso padrão que vem com todos os Contas de hospedagem WordPress .
A vantagem de usar FTP em vez do editor de código é que você pode facilmente corrigir problemas usando o cliente FTP. Dessa forma, você não ficará bloqueado no painel do WordPress se algo quebrar durante a edição de HTML.
Para começar, primeiro você precisa selecionar um Software FTP . Usaremos o FileZilla neste tutorial, pois é um cliente FTP gratuito e fácil de usar para Windows, Mac e Linux.
Depois de selecionar seu cliente FTP, você precisará fazer login em servidor FTP do seu site. Você pode encontrar os detalhes de login no painel de controle do seu provedor de hospedagem.
Depois de fazer login, você verá diferentes pastas e arquivos do seu site na coluna ‘Site remoto’. Vá em frente e navegue até seus arquivos de tema acessando wp-content »theme .
Agora você verá diferentes temas em seu site. Vá em frente e selecione o tema que deseja editar.
Em seguida, você pode clicar com o botão direito em um arquivo de tema para editar o HTML. Por exemplo, se você deseja fazer alterações no rodapé, clique com o botão direito do mouse no arquivo footer.php.
Muitos clientes FTP permitem que você visualize e edite o arquivo e faça upload deles automaticamente depois de fazer as alterações. No FileZilla, você pode fazer isso clicando na opção’Exibir/Editar’.
No entanto, sugerimos que você baixe o arquivo que deseja editar em sua área de trabalho antes fazendo quaisquer alterações.
Depois de editar o HTML, você pode substituir o arquivo original. Para obter mais detalhes, recomendamos seguir nosso guia em como usar o FTP para fazer upload de arquivos no WordPress .
Maneira fácil de adicionar código no WordPress
A maneira mais fácil de adicionar código ao seu WordPress é usando o Inserir cabeçalhos e rodapés Plug-in do WordPress.
A equipe do WPBeginner projetou este plug-in, para que você possa adicionar facilmente o código ao seu site em minutos, e o tornamos 100% gratuito para usar.
Ele também ajuda a organizar seu código, já que está armazenado em um só lugar. Além disso, evita erros que podem ser causados ao editar o código manualmente.
Outro benefício é que você não precisa se preocupar com o apagamento do código se decidir atualizar ou alterar o tema.
A primeira coisa que você precisa fazer é instalar e ativar o Insira o plugin Cabeçalhos e Rodapés em seu site. Para obter mais detalhes, você pode seguir nosso tutorial detalhado em como instalar um plug-in WordPress .
Depois que o plug-in estiver ativo, você pode ir para Configuração» Inserir cabeçalhos e rodapés no painel de administração.
Em seguida, você pode adicionar o código HTML ao seu site nas caixas de cabeçalho, corpo e rodapé.
Por exemplo, digamos que você deseja exibir uma barra de alerta em seu site. Você pode simplesmente inserir o código HTML na caixa ‘Scripts no corpo’ e clicar no botão Salvar.
Além disso, você pode adicione um código de rastreamento do Google Analytics e um pixel do Facebook no cabeçalho ou adicione um botão do Pinterest no rodapé do seu site usando o plug-in.
Para obter mais detalhes, consulte nosso guia em como adicionar código de cabeçalho e rodapé no WordPress .
Esperamos que este artigo tenha ajudado você a aprender como editar HTML no editor de código do WordPress. Você também pode consultar nosso guia em quanto custa realmente construir um site WordPress ou veja os motivos mais importantes que você deve usar WordPress para o seu site .
Se gostou deste artigo, inscreva-se no nosso Canal do YouTube para tutoriais em vídeo do WordPress. Você também pode nos encontrar no Twitter e no Facebook .