Ghidul esențial pentru câmpurile personalizate WordPress

Dacă există o caracteristică despre WordPress care o diferențiază de alte sisteme de gestionare a conținutului (CMS), este personalizarea. Câmpurile personalizate din WordPress sunt o parte integrată a CMS care vă permite să extindeți nu numai metadatele și informațiile afișate, ci și să schimbați complet funcționalitatea și utilitatea unei postări sau pagini. Vrem să vă ajutăm să înțelegeți fundamentele. Vom discuta despre ce este un câmp personalizat, de ce sunt utile și vom oferi câteva exemple reale despre modul în care sunt utilizate.

Abonați-vă la canalul nostru Youtube

Ce sunt câmpurile personalizate WordPress?

Pe scurt, câmpurile personalizate WordPress vă oferă o modalitate de a adăuga elemente specifice paginilor. S-ar putea să fie un anumit tip de imagine sau byline sau biografia autorului, poate o evaluare sau chiar ceva de genul, așa cum spune intrarea Codex din câmpurile personalizate, starea de spirit, citirea în prezent, ascultarea sau casetele meteo.

Aceste câmpuri alcătuiesc ceea ce se numește metadate pentru postarea dvs. (practic orice nu este inclus în conținutul principal al articolului dvs.). În mod implicit, WordPress are meta-casete pentru informații generice, cum ar fi etichete, categorii, link permanent, imagini prezentate etc. Dacă doriți să adăugați mai multe, veți utiliza câmpuri personalizate.

S-ar putea să doriți chiar să adăugați informații pe care fiecare dintre scriitorii din echipa dvs. trebuie să le completeze pentru a publica o postare.

Puteți crea un câmp obligatoriu care să nu permită publicarea postării până când anumite criterii nu sunt bifate. Așadar, rețineți că aceste câmpuri personalizate nu sunt doar pentru informații despre front-end. Ele pot fi utile și pentru back-end.

Adăugarea câmpurilor personalizate la o postare WordPress

În mod implicit, câmpurile personalizate WordPress sunt dezactivate în editorul de pagini și postări. Dacă utilizați Editorul de blocuri, este ușor să le activați. Doar faceți clic pe pictograma Gear din colțul din dreapta sus al ecranului. Selectați Opțiuni .

Apoi alegeți să activați câmpurile personalizate în partea de jos a ecranului care apare. Va trebui să reîncărcați pagina, deci asigurați-vă că salvați mai întâi munca.

După ce ați activat și reîncărcat, meta-casetele câmpurilor dvs. personalizate vor apărea în partea de jos a ecranului. Sub partea de ecran a editorului de conținut.

În timp ce câmpurile personalizate WordPress sunt incredibil de puternice, cele implicite sunt limitate la o valoare text. Este nevoie de PHP și dezvoltare pentru a le face mai robuste. Din fericire, există plugin-uri care funcționează pentru dvs. și vă vom prezenta cum să le puneți în funcțiune. Dacă tot ce aveți nevoie este un câmp de text pentru unele postări și nu doriți un plugin, nu ezitați să treceți mai jos despre adăugarea câmpurilor personalizate WordPress la front-end-ul temei dvs. Acest lucru se aplică câmpurilor implicite, precum și celor generate de plugin-uri, cum ar fi Advanced Custom Fields.

Utilizarea pluginului Advanced Custom Fields

La fel ca în majoritatea lucrurilor din WordPress, aveți două opțiuni de implementare. Puteți edita manual fișierele PHP pentru a le adăuga în funcționalitatea câmpului personalizat sau puteți utiliza un plugin. În acest caz, vă recomandăm să parcurgeți ruta pluginului. Cu toate acestea, dacă simțiți nevoia să editați PHP și să intrați în cod, puteți face acest lucru în Aspect - Editor tematic . Iată pagina WP Codex despre câmpurile personalizate pentru a vă ajuta să mergeți. Se conectează la diferitele etichete și cârlige șablon de care va trebui să funcționeze.

Dar, din nou, vă recomandăm să utilizați pluginul Advanced Custom Fields peste codul de ajustare. Pluginul permite tot ce ți-ai dori din câmpurile personalizate (și apoi unele), așa că nu simțim nevoia să reinventăm roata. Când funcționează, funcționează. Foloseste-l.

Odată ce ACF a fost instalat și activat, veți observa o intrare de câmpuri personalizate în bara laterală din stânga a panoului de administrare WordPress. Vine cu trei opțiuni: Grupuri de câmp , Adăugare nouă și Instrumente .

Grupurile de teren pot fi considerate ca seturi. Orice lucru pe care doriți să îl afișați în aceeași casetă, îl veți include în același grup. Adăugare nouă vă va permite să adăugați atât un grup nou, cât și un câmp personalizat nou. În timp ce Instrumente este locul în care accesați importul și exportul diferitelor seturi existente de câmpuri personalizate de pe alte site-uri WordPress.

Bazele ACF

Crearea câmpurilor în sine este destul de simplă. Mutați în fereastra Adăugare nouă .

Indiferent de ce, câmpurile personalizate ACF vor fi incluse într-un grup de câmpuri . Aceasta înseamnă doar câmpurile specifice conținute în aceeași casetă. Deci, îl puteți denumi oricum doriți să apară ca în editorul de mesaje. De fiecare dată când doriți să adăugați o intrare individuală la grup, veți face clic pe butonul Adăugare câmp . Faceți acest lucru de fiecare dată când doriți un câmp diferit în aceeași meta-casetă. Regulile de localizare determină unde și când va apărea caseta. În acest exemplu, din moment ce tipul de postare este egal cu postarea , asta înseamnă că va apărea numai în postări. Nu Pagini sau alte tipuri de postări personalizate.

Apoi, veți alege de fapt setările pentru câmpul în sine. Ce va face și funcția pe care o va servi pe site.

Practic, vă alegeți destinația de plasare (sub conținutul postării în editor, bara laterală, deasupra conținutului etc.), precum și destinația de plasare pentru text și câmpuri. Zona Ascunde pe ecran este cea mai interesantă. În funcție de modul în care trebuie să utilizați câmpurile personalizate, puteți exclude orice și toate celelalte meta-casete din schițe. Selectați condițiile pentru apariția acestui câmp personalizat, apoi determinați ce alte casete apar cu acesta, dacă există. De multe ori nici nu vă veți face griji în legătură cu acest lucru.

Crearea câmpurilor personalizate cu ACF

După ce ați numit grupul dvs. de câmp, puteți face clic pe butonul Adăugare câmp . Puteți avea orice număr de câmpuri în același grup, dar asigurați-vă că le păstrați pe toate legate unul de celălalt. Puteți crea aproape orice tip de câmp de intrare pe care vi-l puteți imagina cu ACF.

Pentru acest exemplu, să ne prefacem că rulăm un site WordPress de cultură pop care privește filme și vrea campuri personalizate să afișeze o evaluare, să listeze dacă filmul este în flux și, dacă da, unde să îl găsim.

Acestea ar fi toate sub același grup de câmp, dar câmpuri diferite. După cum puteți vedea mai sus, Is It Streaming? câmpul este configurat pentru a fi un buton radio cu un selector da / nu care este necesar înainte de publicare. În plus, dorim să apară un câmp condițional dacă câmpul este marcat ca Da. Acest lucru se face pur și simplu apăsând din nou Adăugare câmp .

Cu comutarea Conditional Logic activată, trebuie doar să selectați câmpul pentru care este supus și care trebuie să fie valoarea. În acest caz, este streaming? trebuie să fie egal cu Da.

În editorul de postări, intrarea câmpurilor personalizate va arăta astfel:

Și când vă publicați postarea, metadatele pe care le-ați introdus vor face parte din postare. Dar există încă o problemă. Nu îl puteți vedea și nici vizitatorii dvs.

Cum să afișați câmpuri personalizate pe front-end-ul WordPress

Chiar dacă ați făcut toate acestea perfect, datele pe care le-ați introdus nu vor apărea în partea din față a site-ului dvs., fără o mică modificare. La urma urmei, unde ar apărea? De multe ori, tema dvs. va avea un mod de a afișa meta date și câmpuri personalizate, dar acestea diferă temă cu temă. Verificați opțiunile temei pentru documentație.

Un alt mod de a afișa câmpuri personalizate pe partea frontală sunt codurile scurte ACF încorporate. Deși nu există niciun personalizator sau constructor încorporat în ACF, puteți utiliza următorul cod scurt doar pentru câmpurile de text .

Dar, deoarece este limitat la câmpurile de text, este posibil să aibă o utilizare limitată pentru mulți oameni. De asemenea, puteți accesa PHP și utiliza codul ACF, ca în exemplele lor de documentare. De asemenea, puteți face upgrade la ACF Pro și puteți accesa blocul Gutenberg încorporat care afișează câmpul personalizat exact așa cum îl stilizați în constructor.

Dar, așa cum am spus, multe teme vin pline de integrare de câmpuri personalizate în aceste zile și vă vom arăta cum este gestionat acest lucru în Divi.

Cum se afișează câmpuri personalizate pe front-end folosind Divi

Mai întâi, amintiți-vă că o mulțime de module Divi pot reda coduri scurte. De atâtea ori câmpurile dvs. text personalizate create în ACF pot fi pur și simplu inserate folosind codurile lor scurte, așa cum am menționat mai sus.

Pentru exemplul nostru de mai sus care folosește logică condițională și butoane radio, vom folosi caracteristica de conținut dinamic Divi. De asemenea, este foarte ușor de utilizat. Vă vom arăta acest lucru prin intermediul Divi Theme Builder, dar îl puteți folosi literalmente în orice modul care îl acceptă în constructorul Divi obișnuit. Faceți clic pe Black + și selectați modulul dorit. Pentru aceasta, este modulul text .

Apoi, găsiți partea modulului în care doriți să inserați câmpul personalizat. Căutați pictograma Conținut dinamic în partea dreaptă a oricărui loc care acceptă funcția.

Faceți clic pe acesta pentru a selecta din meniul derulant toate tipurile disponibile de conținut dinamic, inclusiv toate câmpurile personalizate. S-ar putea să fie chiar în partea de jos.

Divi vă oferă opțiunea de a adăuga practic etichete înainte / după la conținutul câmpului. Vrem ca al nostru să citească în mod natural ca parte a postării, deci este disponibil acest film pentru a fi transmis online? va fi plasat înaintea valorii la redarea câmpului. De asemenea, am adăugat un spațiu final la final pentru a separa eticheta noastră de valoarea ACF.

Deoarece nu puteți avea decât o singură bucată de conținut dinamic pentru fiecare zonă a modulului, repetați acest proces pentru alte câmpuri. Rețineți, totuși, că, deși câmpul personalizat este condiționat, modulul Divi nu este . Deci, dacă utilizați o etichetă înainte / după pe un câmp condițional, veți vedea în continuare eticheta respectivă. Dacă le lăsați necompletate, atunci nicio valoare nu va fi redată deloc.

În plus, opțiunea Enable Raw HTML va permite redarea oricărui cod pe care îl introduceți în câmpul ACF, cum ar fi linkuri către diferite platforme etc.

Încheierea

După cum puteți vedea, în ciuda faptului că pare destul de complicat, câmpurile personalizate WordPress sunt o caracteristică care nu necesită ca un dezvoltator să fie corect. Trebuie doar să instalați ACF și să începeți să personalizați modul în care dvs. și echipa dvs. introduceți informațiile. Fie că este vorba de un site de recenzii, de o piață de comerț electronic sau chiar doar de un blog prietenos în care doriți să împărtășiți ceea ce se întâmplă în viața dvs., posibilitatea de a modifica și perfecționa metadatele postărilor și paginilor dvs. poate ridica site-ul dvs. la niveluri noi.

Pentru ce folosiți câmpurile personalizate WordPress?

Imagine prezentată de SurfsUp / shutterstock.com