Como configurar o SSL no WordPress (https)

Configurar SSL no WordPress

Se você está lendo este artigo, provavelmente já sabe da importância de ter um site que utilize um certificado SSL. Entre as vantagens de usar tal recurso, podemos destacar a segurança como sendo a principal. Ao configurar o seu site para rodar completamente sobre o protocolo seguro (HTTPS), você garante que nenhuma troca de dados será interceptada por terceiros durante a navegação. Isso vale tanto para situações de baixo risco, como a exibição de anúncios sem o seu consentimento, quanto de alto risco, como a troca de informações sensíveis diversas (ex.: senhas e dados de cartão de crédito).

Este artigo é dedicado àqueles que utilizam o WordPress instalado (.org) e que desejam aprender como configurar o SSL no WordPress, para que ele rode 100% sobre a criptografia do protocolo HTTPS. Apesar de parecer um pouco intimidador, a princípio, você verá que se trata apenas de uma coleção de procedimentos simples, cuja maioria pode ser realizada com facilidade.

Fique conosco e descubra como configurar o SSL no WordPress. 🔒😀

Antes de começar, obtenha e instale um certificado SSL em seu domínio

Estamos partindo da premissa que você já possui um certificado SSL instalado em seu domínio. Se você ainda não o fez, saiba que existem certificados SSL gratuitos e pagos. Eles podem ser instalados automaticamente ou sua instalação pode ser solicitada para o seu provedor de hospedagem.

Após a instalação do certificado SSL no seu domínio, você poderá acessar as URLs de seu site usando tanto o protocolo HTTP (ex.: http://meusite.com) quanto o HTTPS (ex.: https://meusite.com). O ideal é que apenas a versão criptografada (HTTPS) seja acessível para seus visitantes. Esse objetivo pode ser alcançado com a configuração de um redirecionamento. Assim, quando um visitante acessar o seu site por uma URL insegura (ex.: http://meusite.com), ele será redirecionado automaticamente para a versão segura (ex.: https://meusite.com) em milissegundos.

Veremos a seguir como configurar o SSL no WordPress, corrigindo eventuais erros e redirecionando todos os visitantes para as versões seguras das URLs.

1. Comece a configurar o SSL no WordPress pelo painel de administração

O primeiro passo para configurar o SSL no WordPress é forçar o painel de administração a rodar a versão segura. Isso pode ser facilmente configurado com a inserção de uma linha de código no arquivo wp-config.php. Este arquivo encontra-de na raiz da instalação do seu WordPress. Acesse o servidor de hospedagem do seu WordPress e baixe o arquivo em questão, ou edite-o usando o gerenciador de arquivos de sua hospedagem.

Abra o arquivo wp-config.php com o seu editor de código favorito e localize o trecho “Isso é tudo, pode parar de editar” ou “That’s all, stop editing“. Acima desta linha, insira o código define('FORCE_SSL_ADMIN', true);, como exibido na imagem abaixo.

Configurando o SSL no WordPress - painel de adminitração

Salve o arquivo e substitua-o no servidor de hospedagem. Ao fazer isso, acesse a página de login do seu WordPress. Você poderá notar que a página foi redirecionada para a versão segura, que pode ser reconhecida por um cadeado verde na barra de navegação.

Cadeado verde na barra de endereços

Use o seu login e senha para acessar a área de administração. Repare que o cadeado verde aparecerá em todas as páginas do painel de administração.

Importante: Antes de realizar qualquer alteração no seu site, faça um backup de todos os arquivos e do banco de dados.

2. Ative o HTTPS em apenas uma página

Agora que já temos o SSL configurado no painel de administração, chegou a hora de começar a configurar a parte do seu site que é visível para os visitantes. Como podem existir erros, minha sugestão é ativar o SSL temporariamente em apenas uma página, para que você possa analisá-la e verificar se a mudança poderá ser feita em todo o site.

Existem diversos plugins que fazem o redirecionamento do site inteiro para o SSL. No entanto, não desejamos isso neste momento, porque precisamos nos certificar de que o conteúdo do site está livre de erros. Geralmente estes erros estão relacionados aos elementos da página que estão sendo carregados por uma URL HTTP. Assim, mesmo que a página seja carregada de modo seguro (ex.: https://site.com/pagina), se ela carregar em seu código-fonte imagens, CSSs ou scripts que não utilizem o HTTPS (ex.: http://site.com/imagem.jpg), um alerta será exibido para o usuário. Dependendo do conteúdo da página, o carregamento pode até ser bloqueado pelo navegador, o que certamente causaria uma impressão muito negativa em seus visitantes.

Aviso página não segura

Dica: use o plugin WordPress HTTPS (SSL)

Como mencionamos, existem muitos plugins, melhores inclusive do que esse, para configurar o SSL no WordPress. No entanto, em nenhum deles encontrei a opção de ativar o SSL em apenas uma página. Nesse ponto, o plugin WordPress HTTPS (SSL) cumpre exatamente esta função. Apesar do aviso de que o plugin não é atualizado há algum tempo, não encontrei problemas de compatibilidade com a versão mais recente do WordPress no momento em que escrevo este post (4.8).

Instale o plugin como preferir (via FTP ou painel) e faça sua ativação. Você notará que aparecerá, no menu lateral do WordPress, o item “HTTPS”. Não altere nenhuma configuração do plugin neste momento. Ao invés disso, navegue até uma página ou post qualquer, de preferência um que contenha imagens, e abra o editor da página. Na barra lateral, marque a opção “Secure post e atualize a página.

Habilitando o SSL em uma página do WordPress

Acesse a página no navegador, através do link “ver página”. Se o cadeado no navegador estiver verde, é porque todos os itens estão sendo carregados via HTTPS. Se, ao invés disso, o cadeado verde não aparecer, a página pode conter alguns elementos que estão sendo carregados com a URL insegura (HTTP). Nesse caso, inspecione o código-fonte (botão direito -> inspecionar elemento; ou F12 no Windows) para visualizar possíveis avisos de erro. Caso existam ícones de erro, clique nos avisos e verifique quais elementos estão causando o problema.

URLs inseguras sendo exibidas na tela de ferramentas do desenvolvedor

Esse procedimento lhe dará uma lista do que precisa ser atualizado no seu conteúdo e também no seu tema. Se as URLs inseguras estiverem presentes apenas no conteúdo (post ou página), então os passos seguintes provavelmente resolverão todas estas questões.

3. Faça a atualização da URL base do WordPress para conter o HTTPS

Entre as configurações do WordPress, uma delas grava o local de instalação do WordPress e a outra a URL base do site. Estas informações são utilizadas pelo sistema do WordPress para formar diversas das URLs que serão carregadas nas páginas do seu site. Por isso, elas são fundamentais para configurar o SSL no WordPress e devem ser atualizadas, como veremos a seguir.

No painel de Administração do WordPress, vá em Configurações -> Geral e atualize os campos Endereço do WordPress (URL) e Endereço do site (URL), inserindo o https no início da URL.

Alteração da URL base do WordPress

Salve a página após a alteração. Você será redirecionado para a página de login. Faça o login e acesse o painel de administração novamente. Nesse momento, se você clicar dentro do painel no link “Visitar site”, já será direcionado para a versão HTTPS da página inicial.

4. Atualize as URLs de imagens, CSSs e scripts no banco de dados

Muito provavelmente, seu site terá diversas imagens e scripts carregados de modo não-seguro, provenientes de quando o seu site ainda não possuía a URL HTTPS como padrão nas configurações gerais do WordPress. O que precisamos fazer, então, é varrer e o banco de dados em busca destas URLs, substituindo as que estiverem sob essa condição.

Usuários mais experientes poderão fazer essas substituição diretamente no banco de dados. Para facilitar esse trabalho, no entanto, usaremos a ferramenta incrivelmente útil Database Search and Replace Script in PHP. Ao contrário dos plugins para WordPress, este não precisa ser instalado. Ele deve ser inserido na raiz de sua instalação do WordPress.

Faça o Download do arquivo .zip que contém o script e descompacte-o. Em seguida, insira-o em uma pasta na raiz de seu WordPress. Essa pasta pode ter o nome que você desejar.

Script para alteração de URLs no banco de dados

Em seguida, faça o upload da pasta que contém o script para o seu servidor de hospedagem e acesse o script através da sua URL. O endereço será algo como meusite.com/Search-Replace-DB-Script.

A tela de substituição do script será exibida. No campo replace, insira a versão de seu domínio que contém apenas http. No campo with, insira o mesmo domínio, mas desta vez com o https na URL, como na imagem abaixo.

Substituição das URLs no banco de dados

Para iniciar a substituição, clique no botão live run. Uma tela de confirmação aparecerá. Confirme e aguarde o script finalizar o procedimento. Repita a operação para a versão sem www do seu domínio (ex.: replace: http://site.com with https://site.com).

Importante: Antes de realizar qualquer alteração em seu banco de dados, faça um backup.

Após a finalização do procedimento, apague o script do seu servidor. Isso é muito importante, porque este script contém acesso ao banco de dados do seu site.

5. Faça uma varredura no site em busca de “mixed content

Neste momento, seu site deverá estar acessível tanto pelo endereço antigo, com HTTP, quanto pelo novo, com HTTPS. Esta é a hora de varrer seu site em busca de elementos carregados de maneira insegura, e corrigi-los.

Para isso, abra a tela de ferramentas de desenvolvedor do seu navegador. No Google Chrome, ela está disponível no menu (três pontinhos), em Mais ferramentas -> Ferramentas do desenvolvedor. Navegue pela versão HTTPS do seu site com a tela de desenvolvimento aberta. Caso existam erros, eles serão indicados no canto direito da tela de desenvolvimento. Ao clicar sobre o número de erros, a lista de problemas será exibida na base, como na imagem abaixo.

Conteúdo misto (mixed content) no WordPress

Estes erros de carregamento recebem o nome de “mixed content“, ou, em português, conteúdo misto. Eles indicam que alguns elementos estão sendo carregados com uma URL sem criptografia (HTTP).

Em muitos casos, essas URLs estão inseridas diretamente no código-fonte do template que está sendo usado pelo WordPress. Mas também é possível encontrar este cenário quando usamos plugins externos (ex.: redes sociais) ou quando inserimos conteúdo externo via iframe, como um vídeo, por exemplo.

Você deve descobrir a origem destas URLs e corrigi-las manualmente.

6. Configure um redirecionamento de HTTP para HTTPS

Como passo final da configuração do SSL no WordPress, você deverá fazer um redirecionamento no servidor para que todos os visitantes acessem apenas a versão segura (HTTPS) do seu site. Este redirecionamento é bem simples de se fazer, mas exige atenção.

Se sua hospedagem usa um servidor do tipo Apache, insira o código abaixo no arquivo .htaccess que está presente na raiz do WordPress. Se não houver um arquivo .htaccess, crie um em branco.

# Redirecionamento para HTTPS
RewriteEngine On
RewriteCond %{HTTPS} off
RewriteRule (.*) https://%{HTTP_HOST}%{REQUEST_URI} [R=301,L]

Se você usar um servidor do tipo NGINX, o código será um pouco diferente:

server {
listen 80;
server_name meusite.com www.meusite.com;
return 301 https://meusite.com$request_uri;
}

No exemplo acima, lembre-se de substituir o trecho meusite.com pelo seu domínio.

Se você estiver em dúvida sobre qual servidor seu WordPress utiliza, entre em contato com o suporte técnico de sua hospedagem. Eles com certeza saberão informar.

7. Remova o plugin WordPress HTTPS (SSL)

Após alterar a URL padrão do WordPress, você deve remover o plugin WordPress HTTPS (SSL). Ele não será mais necessário, uma vez que fizemos todos os ajustes manualmente.

Para remover o plugin, no painel de administração, vá até a seção Plugins -> Plugins instalados e desative o plugin. Em seguida, clique em Excluir e confirme a exclusão do plugin.

Dica de SEO: Informe ao Google sobre a alteração de sua URL

Se você já possui o site há algum tempo, provavelmente várias URLs estão indexadas no Google e em outros buscadores. Como a URL padrão do seu site foi alterada, é necessário informar ao Google sobre essa alteração. Este passo é importante para que não haja nenhuma mudança na posição de suas páginas nos resultados de busca. Site que possuem muito tráfego orgânico devem dar uma atenção especial para esta etapa.

A primeira coisa a se fazer é gerar dois mapas do site: um com as URLs antigas (com HTTP) e outro com as novas URLs (com HTTPS). Não entrarei em detalhes sobre como gerar um sitemap, mas existes diversos plugins que o fazem. O que usamos por aqui é o Yoast SEO. Recomendo fortemente o uso deste plugin, não apenas para gerar sitemaps, mas também por todas as configurações de SEO que ele possui.

Após realizar o procedimento de configuração do SSL no WordPress, você deverá criar um novo perfil no Google Search Console. Na criação deste perfil, informe a URL do seu site na versão com HTTPS (ex.: https://www.meusite.com). É importante informar o domínio exatamente como aparece na URL base do WordPress.

Após a criação do perfil no Search Console, navegue até a área Rastreamento -> Sitemaps e adicione os dois sitemaps que gerou anteriormente. Esse procedimento é muito importante para que o Google entenda que se trata do mesmo site, mas que ele sofreu uma alteração de URL.

Sitemap no Google Search Console

Para saber mais sobre este procedimento e ver outros detalhes sobre a mudança, leia esta página de ajuda do Google.

Atenção: curtidas no site poderão ser zeradas

Se você usa algum plugin social em seu site, saiba que você poderá zerar a contagem de curtidas e compartilhamentos, apenas no site. Isso ocorre porque os plugins utilizam a URL da página para contar o número de curtidas/compartilhamento. Como houve uma alteração na URL das páginas, a contagem será perdida.

Felizmente isso ocorrerá apenas no site, ou seja, se os links do seu site foram compartilhados e curtidos nas redes sociais, a contagem nestas redes permanecerá a mesma. Isso já ajuda bastante, não é mesmo?

Conclusão

Cada vez mais, ter um site com um certificado SSL está se tornando uma obrigação. Além da questão da segurança, o Google já indicou que o SSL é um dos fatores de ranqueamento de um website, o que torna a mudança ainda mais urgente.

Como vimos aqui, configurar o SSL no WordPress, para que ele rode 100% em modo seguro, é um procedimento relativamente fácil e que pode ser realizado por qualquer pessoa que administre um site WordPress.

Ainda assim, é normal surgirem dúvidas durante o processo, que pode variar um pouco dependendo do cenário. Se este for o seu caso, deixe um comentário e farei o possível para ajudá-lo.

Por:

Designer, desenvolvedor web e um dos fundadores do Tudo sobre Hospedagem de Sites. Entusiasta do WordPress e apaixonado por tecnologia em geral. Acredita que a internet está ajudando a tornar o mundo um lugar melhor de se viver. =)

4 Comentários

  1. AC

    Boa noite, parabéns pelo tutorial, muito útil.
    Eu tenho uma dúvida: Se estou configurando um site novo e já fiz a instalação do ssl mais os redirecionamentos no servidor e as URLs no WordPress estão corretas com https inclusive funcionando perfeitamente no login do painel e em todo o resto ainda assim devo inserir o código no wp-config.php?

    Agradeço antecipadamente,

    AC

    Responder
    • Redação

      Olá! Ao fazer o redirecionamento no servidor, forçando todas as URLs do domínio a serem carregadas via HTTPS, “por tabela”, você também está forçando o painel do WordPress a ser carregado somente via HTTPS. Nesse caso, mesmo que alguém tente acessar a URL insegura (HTTP), será redirecionado para a segura. Em teoria, você não precisa inserir o código para forçar o carregamento da área admin via HTTPS. Apesar disso, pode ser uma boa prática fazer a alteração, para cobrir eventuais situações não previstas pelo outro redirecionamento.
      Apenas relembrando, a alteração é bem simples, basta inserir o trecho define('FORCE_SSL_ADMIN', true); no arquivo wp-config.php, antes do comentário que diz “Isso é tudo, pode parar de editar”. E lembre-se de fazer um backup do arquivo antes de realizar qualquer alteração, ok?
      Qualquer outra dúvida, basta entrar em contato!
      Um abraço e boa sorte.

      Responder
  2. Ezequiel Damaceno

    Olá Bill, gostaria de agradecer pelo excelente trabalho, essa postagem esta perfeita 100% o passo a passo. muito obrigado e sucesso!

    Responder
    • Bill Bordallo

      Olá, Ezequiel!
      Obrigado pelo comentário. Fico feliz em saber que o artigo foi útil para você. 🙂
      Um abraço.

      Responder

Deixe um comentário