Você já sentiu que o WordPress está te segurando? Como se quisesse fazer mais com seu site, mas está preso aos mesmos velhos temas, plugins e limitações? Você não está sozinho. Muitos desenvolvedores e proprietários do WordPress sentem o mesmo. Eles amam o WordPress, mas também querem explorar novas possibilidades.
É por isso que você deve considerar usar o WordPress como um CMS headless.
Um CMS headless é uma maneira de usar o WordPress como um backend para gerenciar seu conteúdo e um frontend diferente para exibi-lo. Ele oferece mais flexibilidade, desempenho e segurança. Ele permite que você use o melhor dos dois mundos.
Neste guia, vamos lhe contar várias maneiras de usar o WordPress como um CMS headless, passo a passo. Você aprenderá o que é um CMS headless, por que você deve usá-lo e como configurá-lo com o WordPress.
Create Amazing Websites
Com o melhor criador de páginas gratuito Elementor
Comece agoraBônus: você também receberá algumas dicas e práticas recomendadas para tornar seu site WordPress headless incrível.
Pronto para começar? Vamos começar.
O que é um CMS sem cabeçalho?
Sistemas convencionais de gerenciamento de conteúdo, como o WordPress, normalmente consistem em dois componentes principais que estão intimamente conectados.
- Front-end: esta é a parte do seu site que os visitantes visualizam.
- Back-end: é aqui que você pode ajustar a aparência, o conteúdo, as configurações e muito mais do seu site.
Um Headless CMS, no entanto, desacopla essas duas partes, deixando apenas o back-end intacto. A separação do front-end do back-end se mostra benéfica porque:
- Ambas as extremidades podem ser manuseadas independentemente.
- Não há dependência entre o front-end e o back-end.
- Qualquer alteração em uma extremidade não afeta a funcionalidade principal da outra.
O sistema Theme é usado por um CMS típico, que é uma estrutura orientada a banco de dados, para exibir dados exclusivamente em navegadores da web. Você tem que seguir as diretrizes e usar linguagens de programação específicas ao usar esse método.
Em contraste, um sistema de gerenciamento de conteúdo (CMS) headless é alimentado por uma API e permite que você use qualquer tecnologia front-end escolhida para publicar seu conteúdo em vários canais simultaneamente.
Um CMS sem cabeçalho essencialmente remove o front-end da plataforma, deixando apenas o back-end e uma API necessária para a operação.
CMS WordPress sem Cabeça
Como o WordPress vincula estreitamente o front-end e o back-end, ele é frequentemente chamado de Sistema de Gerenciamento de Conteúdo "Monolítico".
Quando um visitante visita seu site, o PHP é usado para recuperar os dados do banco de dados e apresentá-los dinamicamente no navegador do usuário. Os dados são armazenados em um banco de dados MySQL .
Os recursos dinâmicos do WordPress podem exigir muitos recursos, principalmente se você deseja postar material em vários canais ao mesmo tempo e seu site recebe muito tráfego. O método Headless/Static/Serverless WordPress é útil nessa situação. O WordPress não é um sistema de gerenciamento de conteúdo (CMS) headless por padrão; mas você pode torná-lo um usando a REST API incluída. Vários benefícios seguem.
Ao usar o WordPress estático, você só precisa publicar o material uma vez; a API REST do WordPress cuidará da publicação consistente em uma variedade de mídias.
Uma maneira de traduzir material é usar o Headless WordPress como uma camada e depois enviar o texto traduzido para vários CMSs.
Você pode escolher seu framework de design front-end preferido usando a REST API, mesmo que você ainda possa publicar usando o backend do WordPress. Pode ser algo completamente diferente, como Gatsby , ReactJS , VueJS ou Angular .
Como usar o WordPress como um CMS Headless?
Existem alguns bons métodos que você pode tentar se quiser utilizar o WordPress como um CMS Headless:
1. A abordagem DIY
Você precisará destes três itens para configurar manualmente o WordPress como um CMS headless:
- Uma nova instalação do WordPress
- Um tema em branco que redireciona para seu site estático
- Obter os dados dos endpoints da API REST do WP
O estágio final é converter seu site WordPress dinâmico em HTML estático e exibir seu conteúdo do Headless WordPress usando uma variedade de estruturas JavaScript:
ReactJS , AngularJS , VueJS , GatsbyJS e Next.js.
Provavelmente você desejará criar campos de conteúdo personalizados se quiser aproveitar ao máximo o potencial que sua configuração estática do WordPress oferece.
Usar o plugin Advanced Custom Fields (ACF) é a melhor opção nessa situação.
Mas observe que você também pode precisar utilizar o ACF para REST API plugin para estruturar corretamente as chamadas de API quando você estiver chamando campos personalizados por meio de uma API RESTful.
2. Provedores de hospedagem WordPress estática
Outra opção é assinar com um provedor de hospedagem estática do WordPress e deixar que ele faça todo o trabalho pesado para você.
A seguir estão alguns dos melhores hosts estáticos do WordPress que você pode escolher:
Shifter , HardyPress , Strattic e Pagely .
Outro benefício de escolher esse caminho é que você pode continuar usando seu Painel do WordPress normalmente.
3. Plugins WordPress sem Cabeça
Assim como acontece com tudo relacionado ao WordPress, uma nova instalação regular do WordPress pode ser transformada em um sistema de gerenciamento de conteúdo (CMS) sem interface usando um plugin.
Mas esteja ciente de que não há muitos plugins disponíveis para a tarefa, e os que estão não receberam nenhuma avaliação ou tiveram muitas instalações ativas. Isso ocorre porque o Headless WordPress ainda não é amplamente usado.
Os 3 melhores plugins para criar um site WordPress headless são:
I) Modo sem cabeça
Quando uma pessoa tenta acessar seu site, este plugin a redireciona automaticamente. Para criar ou atualizar posts, use o editor de post padrão. Apenas solicitações feitas por meio da API GraphQL e da API REST do WordPress serão atendidas.
II) WP sem cabeça
Com o WP Headless , você pode converter sua instalação do WordPress em um Headless CMS removendo o front end. Quando habilitado, os permalinks de post serão abertos diretamente no editor de post, permitindo que usuários e colaboradores continuem produzindo material normalmente.
Já que o front end desapareceu graças a este plugin, você pode usar a API para enviar seu conteúdo para outros aplicativos ou servi-lo em outras plataformas como Facebook, Medium, telas de tecnologia e mais. Isso torna o tema desnecessário.
III) Estrutura WP Headless CMS
Com a ajuda do plugin WP Headless CMS Framework , você pode configurar sua instalação do WordPress para funcionar como um sistema de gerenciamento de conteúdo headless. Com as várias configurações do plugin, você pode configurar o WordPress precisamente como quiser.
As opções de estrutura incluem:
- Autenticação de Token Web JSON
- A capacidade de adicionar dados de bloco Gutenberg às respostas REST
- Você pode proteger solicitações REST com nonce
- Permite que você limpe objetos de resposta REST
- A capacidade de remover endpoints REST não necessários
- Por fim, ele desabilita o frontend
Você pode usar o WordPress como um CMS headless com projetos nativos React, React Native, Angular e iOS ou Android depois de habilitar os recursos necessários.
Benefícios de usar um WordPress Headless
Usar o WordPress como um CMS Headless oferece vários benefícios para empresas, desenvolvedores, proprietários de sites e usuários finais, incluindo:
1. Publicação de conteúdo multicanal
Ter a capacidade de publicar automaticamente seu material em vários canais ao mesmo tempo é um dos maiores benefícios de usar uma arquitetura headless.
O Static WordPress é um sistema de gerenciamento de conteúdo único, então você não precisa se preocupar em formatar seu material de forma diferente para cada plataforma. Em vez disso, tudo o que você precisa fazer é publicar as informações uma vez, e o Headless Architecture cuida do resto.
2. Redesenhos mais leves e simples
Você perde muito peso quando fica sem cabeça. Com apenas um banco de dados de conteúdo e chamadas de API restantes em seu sistema, você pode servir conteúdo de forma rápida, fácil e com um alto nível de responsividade.
3. Desempenho super rápido
Outra área em que a arquitetura headless é realmente útil é na velocidade do site.
O método headless elimina tudo o que é supérfluo, especialmente coisas do front-end que podem fazer com que seu site carregue mais lentamente.
Mesmo que você publique o conteúdo em um site estático, o Headless WordPress permite que seu site WordPress carregue rapidamente, pois ele requer apenas o banco de dados de conteúdo e solicitações de API.
4. Maior controle
De uma perspectiva de desenvolvimento, você tem controle quase infinito quando desvincula o WordPress. O JavaScript pode ser usado criativamente por desenvolvedores frontend para criar experiências que vão "além do template".
5. Segurança mais rigorosa
WordPress sem cabeçalho é um método seguro!
Verdade seja dita, a abordagem Headless para a segurança do WordPress é muito mais segura do que qualquer plugin ou mecanismo de segurança.
Ao manter o front-end e o back-end separados, você dificulta que hackers acessem ou abusem do seu material, pois ele não faz parte do front-end.
6. Melhor escalabilidade
Devido à sua escalabilidade, muitas empresas estão adotando a metodologia do WordPress estático.
Você pode aumentar a escala rapidamente sem que seus usuários sofram grandes períodos de inatividade porque o conteúdo é enviado por meio de chamadas de API.
Agora você está priorizando a API, o que lhe permite interagir rapidamente com praticamente qualquer outra tecnologia para atender às suas crescentes demandas comerciais e, ao mesmo tempo, permitir que seu banco de dados de conteúdo se desenvolva.
Possíveis desvantagens do WordPress sem cabeçalho
- Nenhum editor WYSIWYG (o que você vê é o que você obtém)
- Programação mais complexa
- Manutenção mais difícil
Algumas dicas e práticas recomendadas para usar um WordPress sem cabeçalho
- Selecione a tecnologia front-end que funciona melhor para seu projeto. Qualquer ferramenta de desenvolvimento web que possa extrair dados de uma API pode ser usada, assim como um gerador de site estático como Gatsby, Next ou Nuxt, ou um framework JavaScript como React, Angular ou Vue. Pense nos recursos, desempenho, curva de aprendizado e compatibilidade com WordPress.
- Para conectar seu front-end ao seu back-end do WordPress, use um plugin ou uma solução personalizada. Para expor seus dados do WordPress via GraphQL ou REST API, respectivamente, você pode usar um plugin como WPGraphQL ou WP REST API Controller. Como alternativa, você pode usar hooks e funções do WordPress para criar seus endpoints personalizados.
- Torne seu backend do WordPress amigável ao headless. Você pode desabilitar plugins e recursos extras, utilizar um tema em branco que não produz nenhum conteúdo front-end e personalizar as configurações de API e permalinks de acordo com suas especificações.
- Proteja tanto sua API quanto seu site WordPress. Para se proteger contra ataques maliciosos e acesso não autorizado ao seu site WordPress e API, você pode empregar técnicas de HTTPS, autenticação e autorização. Para ficar de olho e auditar a segurança e a atividade do seu site, você também pode utilizar plugins como Sucuri Security ou WP Security Audit Log.
- Observe e melhore a funcionalidade do seu site. Ferramentas como Google PageSpeed Insights, GTmetrix e Pingdom podem ser usadas para avaliar a funcionalidade e a velocidade do seu site. Para acelerar o carregamento do site e economizar largura de banda, você também pode empregar serviços de cache, compactação e CDN.
Exemplos de WordPress Headless ao vivo
Conclusão
Se você quer gerar conteúdo que não seja específico da plataforma ou se você quer aumentar a eficiência do seu site, usar o WordPress como um Headless CMS pode ser útil. É uma técnica para separar o front-end do back-end para que as escolhas de publicação e gerenciamento de conteúdo sejam mais flexíveis.
Você pode usar o WordPress como um CMS headless, particularmente se sua empresa emprega desenvolvedores, porque o núcleo do WordPress vem com uma REST API . Este método pode ser usado para publicar suas informações em vários canais simultaneamente ou para acelerar o carregamento do seu site.
Mas é crucial notar que o Headless WordPress não é uma boa opção para todos os projetos, principalmente se você estiver desenvolvendo um site que não seja de tecnologia. Além disso, um método headless não é apropriado para sites diretos, estilo folheto, porque seria mais um exagero do que uma correção para melhorar o desempenho.
Use as dicas deste artigo para ajudar você a decidir se o Headless WordPress faz sentido para seu projeto ou não.
