Ti senti mai come se WordPress ti stesse frenando? Come se volessi fare di più con il tuo sito web, ma sei bloccato con gli stessi vecchi temi, plugin e limitazioni? Non sei il solo. Molti sviluppatori e proprietari di WordPress la pensano allo stesso modo. Amano WordPress, ma vogliono anche esplorare nuove possibilità.
Ecco perché dovresti prendere in considerazione l'utilizzo di WordPress come CMS headless.
Un CMS headless è un modo di usare WordPress come backend per gestire i tuoi contenuti e un frontend diverso per visualizzarli. Ti dà più flessibilità, prestazioni e sicurezza. Ti consente di usare il meglio di entrambi i mondi.
In questa guida, ti spiegheremo vari modi per usare WordPress come CMS headless, passo dopo passo. Imparerai cos'è un CMS headless, perché dovresti usarlo e come impostarlo con WordPress.
Create Amazing Websites
Con il miglior generatore di pagine gratuito Elementor
Parti oraBonus: riceverai anche alcuni suggerimenti e best practice per rendere fantastico il tuo sito WordPress headless.
Pronti per iniziare? Cominciamo.
Cos'è un CMS headless?
I sistemi di gestione dei contenuti convenzionali, come WordPress, sono in genere costituiti da due componenti principali strettamente collegati.
- Front-end: è la parte del tuo sito web che i visitatori visualizzano.
- Back-end: qui puoi modificare l'aspetto, i contenuti, le impostazioni e altro ancora del tuo sito web.
Un CMS Headless, tuttavia, separa queste due parti, lasciando intatto solo il back-end. La separazione del front-end dal back-end si rivela vantaggiosa perché:
- Entrambe le estremità possono essere gestite in modo indipendente.
- Non esiste alcuna dipendenza tra il front-end e il back-end.
- Qualsiasi modifica apportata a un'estremità non influisce sulla funzionalità fondamentale dell'altra.
Il sistema Theme è utilizzato da un tipico CMS, che è una struttura basata su database, per visualizzare i dati esclusivamente nei browser web. Devi seguire le linee guida e utilizzare particolari linguaggi di programmazione quando utilizzi questo metodo.
Al contrario, un sistema di gestione dei contenuti (CMS) headless è basato su un'API e consente di utilizzare qualsiasi tecnologia front-end scelta per pubblicare i contenuti su più canali contemporaneamente.
Un CMS headless sostanzialmente rimuove il front-end della piattaforma, lasciando solo il back-end e un'API necessaria per il funzionamento.
CMS WordPress senza testa
Poiché WordPress collega strettamente il front-end e il back-end, viene spesso definito un sistema di gestione dei contenuti "monolitico".
Quando un visitatore visita il tuo sito web, PHP viene utilizzato per recuperare i dati dal database e presentarli dinamicamente nel browser dell'utente. I dati vengono archiviati in un database MySQL .
Le funzionalità dinamiche di WordPress possono richiedere molte risorse, in particolare se desideri pubblicare materiale su più canali contemporaneamente e il tuo sito web riceve molto traffico. Il metodo Headless/Static/Serverless WordPress è utile in questa situazione. WordPress non è un sistema di gestione dei contenuti (CMS) headless di default; ma puoi renderlo tale utilizzando la REST API inclusa. Seguono numerosi vantaggi.
Quando utilizzi Static WordPress, devi pubblicare il materiale solo una volta; la REST API di WordPress gestirà la pubblicazione in modo coerente su una varietà di media.
Un modo per tradurre il materiale è utilizzare Headless WordPress come livello e poi caricare il testo tradotto su vari CMS.
Puoi scegliere il tuo framework di progettazione front-end preferito usando la REST API, anche se puoi comunque pubblicare usando il backend di WordPress. Potrebbe essere qualcosa di completamente diverso, come Gatsby , ReactJS , VueJS o Angular .
Come usare WordPress come CMS headless?
Se desideri utilizzare WordPress come CMS headless, ecco alcuni buoni metodi che puoi provare:
1. L'approccio fai da te
Per configurare manualmente WordPress come CMS headless, avrai bisogno di questi tre elementi:
- Una nuova installazione di WordPress
- Un tema vuoto che reindirizza al tuo sito statico
- Recupera i dati dagli endpoint WP REST API
La fase finale consiste nel convertire il tuo sito web WordPress dinamico in HTML statico e visualizzare i tuoi contenuti da Headless WordPress utilizzando una varietà di framework JavaScript:
ReactJS , AngularJS , VueJS , GatsbyJS e Next.js.
Se vuoi sfruttare appieno il potenziale offerto dalla tua configurazione statica di WordPress, probabilmente vorrai creare campi di contenuto personalizzati.
In questa situazione, la soluzione migliore è utilizzare il plugin Advanced Custom Fields (ACF) .
Ma tieni presente che potresti anche aver bisogno di utilizzare l' API ACF to REST plugin per strutturare correttamente le chiamate API quando si richiamano campi personalizzati tramite un'API RESTful.
2. Fornitori di hosting WordPress statico
Un'altra possibilità è quella di registrarsi presso un provider di hosting statico WordPress e lasciare che sia lui a fare tutto il lavoro pesante per te.
Di seguito sono elencati alcuni dei migliori host WordPress statici che puoi scegliere:
Shifter , HardyPress , Strattic e Pagely .
Un altro vantaggio di questa scelta è che puoi continuare a utilizzare normalmente la tua dashboard di WordPress.
3. Plugin WordPress senza interfaccia
Come per ogni cosa correlata a WordPress, una nuova installazione di WordPress può essere trasformata in un sistema di gestione dei contenuti (CMS) headless utilizzando un plugin.
Ma tieni presente che non ci sono molti plugin disponibili per questo compito, e quelli che lo sono non hanno ricevuto recensioni o non hanno avuto molte installazioni attive. Questo perché Headless WordPress non è ancora molto utilizzato.
I 3 migliori plugin per creare un sito web WordPress headless sono:
I) Modalità senza testa
Quando una persona prova ad accedere al tuo sito, questo plugin la reindirizza automaticamente. Per creare o aggiornare i post, usa l'editor di post standard. Saranno soddisfatte solo le richieste effettuate tramite la WordPress GraphQL API e la REST API.
II) WP senza testa
Con WP Headless , puoi convertire la tua installazione WordPress in un CMS Headless rimuovendo il front-end. Quando abilitato, i permalink dei post si apriranno direttamente nell'editor dei post, consentendo agli utenti e ai collaboratori di continuare a produrre materiale come al solito.
Poiché il front-end è scomparso grazie a questo plugin, puoi usare l'API per spingere il tuo contenuto verso altre applicazioni o servirlo su altre piattaforme come Facebook, Medium, schermi tecnologici e altro. Ciò rende il tema non necessario.
III) Framework CMS Headless WP
Con l'aiuto del plugin WP Headless CMS Framework , puoi configurare la tua installazione WordPress per funzionare come un sistema di gestione dei contenuti headless. Con le varie impostazioni del plugin, puoi configurare WordPress esattamente come lo desideri.
Le opzioni del framework includono:
- Autenticazione tramite token Web JSON
- La possibilità di aggiungere dati di blocco Gutenberg alle risposte REST
- È possibile proteggere le richieste REST con nonce
- Consente di pulire gli oggetti di risposta REST
- La possibilità di rimuovere gli endpoint REST non necessari
- Infine, disabilita il frontend
Una volta abilitate le funzionalità richieste, puoi utilizzare WordPress come CMS headless con progetti nativi React, React Native, Angular e iOS o Android.
Vantaggi dell'utilizzo di un WordPress Headless
L'utilizzo di WordPress come CMS headless offre numerosi vantaggi ad aziende, sviluppatori, proprietari di siti web e utenti finali, tra cui:
1. Pubblicazione di contenuti multicanale
La possibilità di pubblicare automaticamente il tuo materiale su più canali contemporaneamente è uno dei maggiori vantaggi dell'utilizzo di un'architettura headless.
Static WordPress è un singolo content management system, quindi non devi preoccuparti di formattare il tuo materiale in modo diverso per ogni piattaforma. Piuttosto, tutto ciò che devi fare è pubblicare le informazioni una volta, e Headless Architecture si prende cura del resto.
2. Riprogettazioni più leggere e semplici
Perdi molto peso quando diventi headless. Con solo un database di contenuti e chiamate API rimaste nel tuo sistema, puoi servire contenuti in modo rapido, semplice e con un alto livello di reattività.
3. Prestazioni super veloci
Un altro ambito in cui l'architettura headless risulta davvero utile è la velocità dei siti web.
Il metodo headless elimina tutto il superfluo, in particolare il materiale front-end che potrebbe rallentare il caricamento del sito web.
Anche se pubblichi il contenuto su un sito statico, Headless WordPress consente al tuo sito WordPress di caricarsi rapidamente poiché richiede solo il database dei contenuti e le richieste API.
4. Maggiore controllo
Da una prospettiva di sviluppo, hai un controllo quasi infinito quando disaccoppia WordPress. JavaScript può essere utilizzato in modo creativo dagli sviluppatori frontend per creare esperienze che vanno "oltre il template".
5. Maggiore sicurezza
WordPress senza testa è un metodo sicuro!
A dire il vero, l'approccio Headless alla sicurezza di WordPress è molto più sicuro di qualsiasi plugin o meccanismo di sicurezza.
Mantenendo separati il front-end e il back-end, rendi più difficile per gli hacker accedere al tuo materiale o utilizzarlo impropriamente, perché non fa parte del front-end.
6. Migliore scalabilità
Grazie alla sua scalabilità, molte aziende stanno adottando la metodologia Static WordPress.
Puoi ampliare rapidamente le funzionalità senza che i tuoi utenti subiscano tempi di inattività significativi, poiché il contenuto viene inviato tramite chiamate API.
Ora sei API-first, quindi puoi interagire rapidamente con quasi tutte le altre tecnologie per soddisfare le mutevoli esigenze aziendali, consentendo al contempo lo sviluppo del tuo database di contenuti.
Potenziali svantaggi di WordPress headless
- Nessun editor WYSIWYG (ciò che vedi è ciò che ottieni)
- Programmazione più complessa
- Manutenzione più difficile
Alcuni suggerimenti e best practice per l'utilizzo di un WordPress headless
- Seleziona la tecnologia front-end che funziona meglio per il tuo progetto. È possibile utilizzare qualsiasi strumento di sviluppo web in grado di estrarre dati da un'API, così come un generatore di siti statici come Gatsby, Next o Nuxt, o un framework JavaScript come React, Angular o Vue. Pensa alle funzionalità, alle prestazioni, alla curva di apprendimento e alla compatibilità con WordPress.
- Per connettere il tuo front end al tuo back end WordPress, usa un plugin o una soluzione personalizzata. Per esporre i tuoi dati WordPress tramite GraphQL o REST API, rispettivamente, puoi usare un plugin come WPGraphQL o WP REST API Controller. In alternativa, puoi usare hook e funzioni WordPress per creare i tuoi endpoint personalizzati.
- Rendi il tuo backend WordPress headless-friendly. Puoi disattivare plugin e funzionalità extra, utilizzare un tema vuoto che non produce alcun contenuto front-end e personalizzare le impostazioni API e i permalink in base alle tue specifiche.
- Proteggi sia la tua API che il tuo sito web WordPress. Per proteggerti da attacchi dannosi e accessi non autorizzati al tuo sito web WordPress e alla tua API, puoi impiegare tecniche HTTPS, di autenticazione e autorizzazione. Per tenere d'occhio e verificare la sicurezza e l'attività del tuo sito web, puoi anche utilizzare plugin come Sucuri Security o WP Security Audit Log.
- Osserva e migliora la funzionalità del tuo sito web. Strumenti come Google PageSpeed Insights, GTmetrix e Pingdom possono essere utilizzati per valutare la funzionalità e la velocità del tuo sito web. Per velocizzare il caricamento del sito e risparmiare larghezza di banda, puoi anche utilizzare servizi di caching, compressione e CDN.
Esempi di WordPress Headless dal vivo
Conclusione
Se vuoi generare contenuti non specifici della piattaforma o se vuoi migliorare l'efficienza del tuo sito web, usare WordPress come CMS Headless può essere utile. È una tecnica per separare il front end dal back end in modo che le scelte di pubblicazione e gestione dei contenuti siano più flessibili.
Puoi usare WordPress come CMS headless, in particolare se la tua azienda impiega sviluppatori, perché il core di WordPress è dotato di una REST API . Questo metodo può essere usato per pubblicare le tue informazioni su numerosi canali contemporaneamente o per velocizzare il caricamento del tuo sito web.
Ma è fondamentale notare che Headless WordPress non è adatto a tutti i progetti, in particolare se si sta sviluppando un sito web che verrà utilizzato da non esperti di tecnologia. Inoltre, un metodo headless non è appropriato per siti web semplici, in stile brochure, perché sarebbe più un'esagerazione che una soluzione per migliorare le prestazioni.
Utilizza i suggerimenti contenuti in questo articolo per decidere se Headless WordPress è adatto al tuo progetto oppure no.
