Como Adicionar Modo Escuro ao Seu Site WordPress (Maneira Fácil)

Adicionar o modo escuro a sites WordPress se tornou um tópico quente entre nossos leitores. 🌙

Não se trata apenas de seguir tendências – pesquisas mostram que o modo escuro pode reduzir o cansaço visual para leitores noturnos e potencialmente economizar bateria em dispositivos móveis.

Através da nossa experiência ajudando milhares de usuários WordPress a personalizar seus sites, descobrimos as maneiras mais eficientes de implementar este recurso.

Embora muitos proprietários de sites assumam que isso requer conhecimento técnico, as ferramentas modernas do WordPress o tornaram muito mais acessível.💡

Neste guia, compartilharemos a maneira mais simples de adicionar o modo escuro no WordPress. Testamos esta solução em vários temas e configurações para garantir que seja confiável e fácil de adicionar.

O Que é o Modo Escuro e Por Que Adicioná-lo ao Seu Site?

Muitos dispositivos móveis e computadores usam o modo escuro para minimizar a quantidade de luz branca que sai da tela. Isso pode reduzir o cansaço visual, especialmente em condições de pouca luz.

Algumas pessoas até acreditam que isso permite usar computadores e dispositivos móveis até tarde da noite sem que a luz branca e azul estrague seu sono.

Alguns dispositivos vêm com um modo noturno integrado que simplesmente usa tons de cores mais quentes. No entanto, o modo escuro realmente adiciona cores escuras ao fundo do dispositivo.

Alguns sites populares como o YouTube oferecem um esquema de cores escuras integrado.

Em computadores desktop, você pode visitar sites no modo escuro usando uma extensão do Chrome como o Night Eye.

Veja como o site WPBeginner fica usando essa extensão:

Ao adicionar um alternador de modo escuro ao seu site, os usuários podem escolher o modo que preferem sem precisar instalar uma extensão especial de navegador.

Você pode até adicionar o modo escuro à sua área de administração do WordPress. Isso pode ser útil se você trabalha em seu site à noite ou se está sofrendo de fadiga ocular.

Com isso em mente, vamos ver como você pode adicionar o modo escuro à interface pública do seu site e à área de administração do seu site WordPress.

Dica: Quer usar um esquema de cores escuras, mesmo quando o dispositivo do visitante estiver no modo normal ou diurno? Então confira nossa lista dos melhores temas escuros para WordPress.

Como Adicionar o Modo Escuro ao Seu Site WordPress

A maneira mais fácil de criar um modo escuro para o seu site é usando o WP Dark Mode.

Após os testes, descobrimos que este plugin adiciona um alternador para que os visitantes possam ativar o modo escuro em seu site. Ele pode até adicionar um alternador à área de administração, para que você possa ativar o modo escuro para o painel do WordPress.

Você pode saber mais sobre ele em nossa análise detalhada do WP Dark Mode.

Primeiro, você precisará instalar e ativar o plugin gratuito WP Dark Mode. Para mais detalhes, consulte nosso guia sobre como instalar um plugin do WordPress.

Após a ativação, visite a página WP Dark Mode » Configurações no painel do WordPress e alterne o interruptor 'Ativar Modo Escuro no Frontend' para 'LIGADO'.

Depois de fazer isso, você também pode escolher um modo padrão para o frontend do seu site. Depois disso, clique no botão ‘Salvar Alterações’ para armazenar suas configurações.

Em seguida, mude para a aba ‘Personalização’, onde você pode personalizar o layout, tamanho e posição do switch.

Você também pode alterar a cor do switch do modo escuro, mas precisará da versão pro do plugin para isso.

Quando terminar, basta clicar no botão ‘Salvar Alterações’ para armazenar suas configurações. Agora, visite seu site WordPress para ver o toggle do modo escuro em ação.

Se você visualizar a versão mobile do seu site, verá que o modo escuro funciona em smartphones e tablets também.

Adicionando Modo Escuro à sua Área de Administração do WordPress

Você pode alterar o esquema de cores do administrador no WordPress usando as configurações integradas. No entanto, nenhum dos esquemas de cores padrão reduz a luz branca vinda da tela.

Se você trabalha até tarde da noite ou sofre de fadiga ocular, pode tentar adicionar um modo escuro à área de administração do WordPress e ao editor de blocos.

Para fazer isso, visite a página WP Dark Mode » Configurações e mude para a aba ‘Modo Escuro do Painel de Administração’ na coluna da esquerda.

Aqui, ative o interruptor para a opção ‘Ativar Modo Escuro do Painel de Administração’ para ‘LIGADO’ e clique no botão ‘Salvar Alterações’.

Assim que fizer isso, você notará que o interruptor do modo escuro estará na parte superior do seu painel do WordPress.

A partir daqui, você pode ativar o interruptor para ativar este modo sempre que desejar.

Se você também quiser adicionar um modo escuro para o editor de blocos, então você deve ativar o interruptor ‘Modo Escuro do Editor de Blocos’ para ‘LIGADO’.

Em seguida, clique no botão ‘Salvar Alterações’.

Agora abra uma página ou postagem no editor de conteúdo. Você notará um ícone de modo escuro na parte superior. Clique nele para expandir a aba e selecione a opção ‘Modo Escuro’.

É assim que seu editor de blocos ficará no modo escuro.

Tutorial em Vídeo

Inscreva-se no WPBeginner

Esperamos que este artigo tenha ajudado você a aprender como adicionar o modo escuro ao seu site WordPress. Você também pode querer ver nosso guia sobre como escolher um esquema de cores perfeito para o seu site WordPress ou ver nossas escolhas de especialistas para os melhores construtores de temas WordPress para personalizar seu site.

Se você gostou deste artigo, por favor, inscreva-se em nosso Canal do YouTube para tutoriais em vídeo do WordPress. Você também pode nos encontrar no Twitter e no Facebook.