advanced custom fields wordpress

Cosa sono i Advanced Custom Fields (ACF) in WordPress?

"Non conosci Advanced Custom Fields (ACF)? Senza ACF, sicuramente non userei più WordPress". Ecco cosa mi ha scritto un collega via Slack qualche settimana fa. Tuttavia, lui è uno sviluppatore, io un designer. Al più tardi a questo punto, però, ho capito che dovevo (e volevo) affrontarlo.

Cosa sono i siti Advanced Custom Fields (ACF)?

WordPress stesso offre già una vasta gamma di funzioni. Con Advanced Custom Fields (ACF) puoi ampliare ulteriormente queste funzioni, gratuitamente nella versione standard. Ti permettono di avere il pieno controllo sui contenuti del tuo sito web.

Per impostazione predefinita, troviamo campi tipici come titolo, contenuto, data e autore nel backend per i post e le pagine. Advanced Custom Fields , o il seguente Plugin, vi danno la possibilità di estendere WordPress e quindi le pagine e i post praticamente in modo arbitrario e individuale.

Questo significa che con WordPress è possibile fare praticamente tutto: Advanced Custom Fields è un tuning per WordPress, per così dire.

A cosa mi serve Advanced Custom Fields?

In poche parole: Probabilmente hai bisogno di Advanced Custom Fields quando non riesci più a gestire gli elementi di bordo nel backend di WordPress. Ti trovi di fronte a una sfida che non può essere realizzata, o può esserlo solo in parte, con l'aiuto di pagine o post.

A seconda dei desideri del cliente, questo può avvenire in tempi relativamente brevi. Se sei anche tu un web designer, questo ti è certamente familiare.

Nel mio caso, ad esempio, mi è stato permesso di creare una ricerca con criteri di filtro. Non si tratta di una semplice ricerca testuale che cerca nell'intero sito web i contenuti adatti, ma di una ricerca in cui è possibile inserire preventivamente dati specifici tramite un modulo. L'utente ha a disposizione diversi criteri di filtraggio. Tra gli altri, questi sono:

  • Nome (campo di testo)
  • Codice postale (campo di testo)
  • Paese (a tendina)
  • Certificati (casella di controllo)

Ma di questo parleremo più avanti. Questo caso d'uso mi ha dato l'idea di utilizzare Advanced Custom Fields (ACF). Una ricerca così individuale non è semplicemente possibile con gli elementi di bordo di WordPress senza ACF.

Advanced Custom Fields: Il libero Plugin

Quindi stavo cercando una soluzione per implementare questo filtro di ricerca con l'aiuto di Advanced Custom Fields .

L'omonimo plugin presente nella directory ufficiale dei plugin di WordPress proviene da Elliot Condon. L'australiano ci lavora molto attivamente e lo sviluppa costantemente, in modo che appaiano sempre nuove funzioni. Se vuoi essere vicino all'azione, puoi seguire ACF su Twitter.

Se sei già stato abbastanza coraggioso da utilizzare l'editor di blocchi (Gutenberg) introdotto in WordPress 5.0, ci sono anche blocchi per il nuovo editor su Advanced Custom Fields .

Il plugin ACF è attualmente attivo su oltre 1 milione di siti web. È stato testato molto intensamente e funziona perfettamente con l'ultima versione di WordPress. È impressionante anche il fatto che il plugin abbia già ricevuto più di 1.000 valutazioni a 5 stelle. Al contrario, ci sono solo 16 recensioni con una sola stella: molto probabilmente si tratta di utenti che hanno rinunciato dopo (pochissimo) tempo.

Con un tale Plugin è chiaro: richiede un po' di tempo e pazienza finché non si capisce l'applicazione. Naturalmente, ho solo graffiato la superficie di Advanced Custom Fields . Voglio solo esprimere che ci sono altri Plugins che si installano e poi lavorano comodamente in background - è diverso con ACF. Dovete progettare attivamente e vedere la connessione complessiva tra database, backend e frontend.

Ciò che è anche indispensabile per questo Plugin, che è abbastanza tecnico: il supporto.

Non ho ancora avuto modo di utilizzarlo personalmente. Il motivo è semplice: la documentazione di prim'ordine, che copre i tipi di campo, le funzioni, i filtri e le FAQ.

"*" indica i campi obbligatori

Consenso*
Questo campo è per la convalida e non deve essere modificato.

Cosa sono i tipi di post personalizzati?

Prima ho detto che è necessario un design attivo. Su Advanced Custom Fields , questo significa anche che in alcuni casi questi strumenti da soli non ti saranno molto utili. Solo in combinazione con i Custom Post Types si aprono altre opzioni.

Prima sorge la domanda: cos'è un (normale) Post Type?

Le due più conosciute in WordPress sono le pagine e i post del blog. Per ogni nuovo contenuto da creare per un sito web, decidi quale tipo di post è il più adatto. Questo dipende da diversi fattori, tra cui il modo in cui vuoi che le informazioni siano visibili e quali campi ti servono nel backend.

Ma che dire di quando si vuole fornire un contenuto che non può essere coperto da una pagina o un post normale?

Potresti averlo già indovinato: hai bisogno di un nuovo modo per inserire il contenuto nel backend. Quasi una maschera di input con esattamente i campi di cui hai bisogno. Questo è ciò che Advanced Custom Fields può offrirvi. Il suddetto Plugin permette di definire e creare questi campi comodamente nel backend. Una volta che questa struttura è in atto, arriva il passo successivo.

advanced custom fields propri campi
Nel backend di ACF Plugins si possono definire facilmente i campi.

Questo è il momento in cui entrano in gioco i Custom Post Types. È molto importante sapere che ha senso creare un post type personalizzato per l'uso di Advanced Custom Fields . Nel mio caso, chiamo il Custom Post Type (CPT) semplicemente terapeuta.

Naturalmente, puoi anche programmare il Custom Post Type da solo. Tuttavia, ho usato il Plugin "Custom Post Type UI" per questo, che spiegherò più in dettaglio nella prossima sezione.

creazione di un tipo di post personalizzato
Ecco come si presenta il backend del plugin "Custom Post Type UI".

Custom Post Type UI: plugin gratuito

Se questo è stato troppo poco magico per voi finora con il solo Advanced Custom Fields (ACF), ecco che arriva il meglio: ACF in combinazione con Custom Post Type UI, in breve CPT UI.

Questo ti permette di visualizzare il contenuto del database direttamente nel frontend come desideri. Nel mio caso, mi sono trovato di fronte alla sfida di creare un filtro di ricerca con diversi campi. Ho dovuto prima caricare tutti i dati nel backend utilizzando un'importazione CSV.

Dopo di che, ho costruito la base per il filtro di ricerca nel frontend con l'aiuto del Custom Post Type e di Advanced Custom Fields . Più su questo nella prossima sezione.

combinazione di tipi di post personalizzati acf
Per esempio, il tuo nuovo Custom Post Type potrebbe assomigliare a questo.

Esempio pratico: creare una ricerca con criteri di filtro

Così tanto per il momento al backend. Ora è il momento del frontend. In modo da poter applicare il tutto e utilizzare il singolo Advanced Custom Fields per il vostro caso.

Ho utilizzato l'ACF per creare una ricerca personalizzata con criteri di filtro. Tuttavia, come è possibile presentare il contenuto del backend in modo elegante nel frontend in modo che l'utente possa interagire?

Di nuovo, hai la scelta tra svilupparlo voi stessi e usare Plugin. Ho cercato ancora per molto tempo un buon piccolo aiutante e finalmente ho trovato "Search & Filter Pro" (è collegato alla fine del testo).

Questo mi dà un modo ingegnoso per utilizzare i dati disponibili nel backend per la visualizzazione nel frontend. Nel mio esempio questi sono:

  • Ricerca (campo di ricerca normale)
  • Post Meta (accesso e ricerca del relativo campo personalizzato avanzato nel database)
  • Pulsante di invio (pulsante per inviare la query di ricerca o il modulo)

Nel backend questo può apparire così:

Ricerca e filtro pro backend
Con il plugin "Search & Filter Pro" puoi creare una ricerca individuale con criteri di filtro.

In seguito puoi inserire il filtro di ricerca che hai appena creato ovunque nel backend (per esempio in una pagina) usando uno shortcode.

Tuttavia, vedrete che questo avrà ancora un aspetto poco attraente. Ho migliorato questo con alcune maniglie CSS e trovo che il risultato nel frontend è abbastanza rispettabile:

esempio pratico acf

Non vedo l'ora di vedere cos'altro potrò implementare con Advanced Custom Fields in futuro. Hai domande o commenti su questo articolo? Allora non vedo l'ora di ricevere il tuo feedback.

Le tue domande su ACF

Quali domande hai su ACF e WordPress? Sentiti libero di utilizzare la funzione di commento. Vuoi essere informato sui nuovi articoli su WordPress e sul web design? Allora seguici su Twitter e Facebook, LinkedIn o tramite la nostra newsletter.

Ti è piaciuto l'articolo?

Con la tua valutazione ci aiuti a migliorare ancora di più il nostro contenuto.

Scrivi un commento

Il tuo indirizzo e-mail non sarà pubblicato. I campi obbligatori sono contrassegnati da *.