Cum să creați și să utilizați câmpuri personalizate în WordPress

Câmpurile personalizate WordPress sunt o modalitate excelentă de a extinde conținutul tipic al postării sau al paginii de pe site-ul dvs. Sunt bucăți de metadate care sunt atașate unei postări sau pagini de pe site-ul dvs. WordPress, ceea ce înseamnă că, folosind această metodă, puteți adăuga informații suplimentare de orice fel conținutului dvs.

Organizate într-un format cheie/valoare, câmpurile personalizate sunt folosite pentru adăugarea de date în mai multe postări sau pagini. Cheia este un nume care oferă consecvență și identifică câmpul specific, cum ar fi „Articol”. Acesta este întotdeauna același. O valoare este informația care va fi afișată în câmp. Valoarea va fi diferită în funcție de postări, în funcție de informațiile introduse.

Adăugarea de câmpuri personalizate la postare

Următorii pași vă vor arăta cum să utilizați câmpurile personalizate în postările dvs. Dacă preferați să le folosiți pe pagini, se vor aplica aceleași idei, dar vor trebui implementate în fișiere șablon care sunt responsabile pentru crearea paginilor, mai degrabă decât a postărilor.

1. Accesați ecranul editorului de postări și bifați „Câmpuri personalizate”.

2. Găsiți caseta Câmpuri personalizate ca parte a editării postării. Când vă aflați pe o pagină de postare, veți vedea o nouă secțiune în partea de jos cu titlul „Câmpuri personalizate”.

Acum să aruncăm o privire la un exemplu foarte simplu de câmpuri personalizate WordPress în acțiune. Lucrurile se vor transforma cu acest exemplu pentru un blog de fitness. Vom folosi câmpurile personalizate pentru a urmări și enumera diferite tipuri de activitate fizică în postări.

3. Adăugați cheia, care în acest caz este „Tipul de exercițiu”. Vom folosi această casetă pentru a adăuga detalii specifice postării. Faceți clic pe „Enter new” și introduceți cheia în câmp.

4. Adăugați valoarea. Să mergem cu Zumba pentru asta. Rețineți că acest lucru va apărea doar în această postare specifică. Pe o altă postare, puteți introduce o valoare diferită, ceva de genul „Eliptică” sau un alt tip de exercițiu.

5. Salvați postarea.

În acest moment, de fapt, nu vei vedea mare lucru. Mai trebuie să adăugați unele formatări pentru a afișa informațiile. Până acum, aceste informații suplimentare sunt stocate în baza de date, deci pot fi apelate pentru a fi afișate. Pentru acest tutorial, am optat să afișez aceste câmpuri personalizate pe postări (în loc de pagini), așa că voi parcurge cel mai simplu mod de a forma totul.

Afișarea câmpurilor personalizate pe postare

Utilizarea modificărilor șablonului pentru a adăuga câmpurile personalizate ca date recurente ale site-ului este o modalitate eficientă de a rezolva lucrurile. Să presupunem că începeți prin afișarea câmpurilor personalizate la începutul postării, dar mai târziu decideți că ar arăta mai bine în partea de jos. Prin utilizarea modificărilor șablonului, această modificare este ușor de făcut, deoarece schimbarea șablonului va actualiza întregul site. Dacă nu ați folosit această metodă și ați salvat informațiile individual în fiecare postare, ar trebui să editați fiecare postare pentru a face schimbarea, făcând schimbările mult mai dificile.

Pentru acest exemplu, câmpul personalizat va fi afișat înainte de postare, astfel încât cititorul să poată vedea corect tipul de exercițiu înainte de a citi întreaga postare. Pentru a-l afișa în acest fel, datele vor fi apelate înainte de bucla WordPress.

Notă: aceste personalizări ar trebui făcute într-o temă copil, desigur, și vom folosi fișierul single.php . Ca întotdeauna, personalizările ca acestea sunt cel mai bine testate într-un mediu de dezvoltare.

1. Deschideți fișierul single.php și adăugați acest cod în afara buclei WordPress:

 <?php the_meta(); ?>

Va afișa ceva de genul acesta:

Dacă preferați ca acest lucru să fie afișat în altă parte a paginii, încercați să plasați acel fragment în buclă sau după buclă. De exemplu, prin plasarea funcției în interiorul etichetei <main> , informațiile câmpului personalizat vor fi afișate ca parte a conținutului principal.

 <div class="content-area"> <main class="site-main" role="main">

Această abordare va funcționa pentru a afișa și alte câmpuri personalizate pe care le-ați creat.

Un lucru de menționat despre acest exemplu: Tema copil a fost creată din tema părinte WordPress Twenty Fifteen, care este foarte populară. Dacă experimentați unde să afișați câmpurile personalizate, este posibil să existe și alte șabloane de care aveți nevoie în tema copilului, în afară de fișierul single.php . Pentru a afișa informațiile din postare, a fost adăugat un content.php la tema copil. Fragmentul de mai sus a fost plasat în conținutul paginii, astfel încât a apărut ca parte a postării.

2. Stilați câmpurile. Dacă mergeți la inspector, veți vedea câteva clase noi adăugate pe pagină.

Iată cum arată exemplul cu cele două câmpuri personalizate diferite:

• Tip de exercițiu: Zumba
• Momentul zilei: Dimineața

Este destul de simplu să lucrezi cu o listă. Cu ceva stil, va părea mai integrat cu stilul site-ului. Cu doar câteva modificări simple CSS, putem ajusta culoarea textului și stilul listei.

 ul.post-meta li { color: #898989; list-style-type: none; } ul.post-meta li span.post-meta-key { color: #1fc3d2; font-weight: bold; }

Mai multe personalizări de câmpuri personalizate

Stilul din exemplul anterior va funcționa bine, dar avem mai multe lucruri pe care le facem. Următoarele exemple vă vor arăta cum pot fi ajustate câmpurile personalizate cu opțiuni de afișare suplimentare pentru cazuri de utilizare specifice. Faceți citirea câmpului personalizat ca parte a postării și stabilirea contextului cu un titlu util va fi un plus excelent pentru postare. Dacă urmați pas cu pas, asigurați-vă că comentați <?php the_meta(); ?> <?php the_meta(); ?> pe care l-ai adăugat în exemplul anterior.

Pentru acest exemplu, lucrurile au fost ușor modificate. Cheia a fost simplificată la „exerciții”, astfel încât să poată fi adăugată mai ușor la șablon, iar fragmentul de cod a fost adăugat în fișierul content.php al temei copil, astfel încât să apară în conținutul postării, în loc de înainte sau după ea .

 <?php $exercises = get_post_meta($post->ID, 'exercises', false); ?> <h3>Today's exercise:</h3> <ul> <?php foreach($exercises as $exercise) { echo '<li>'.$exercise.'</li>'; } ?> </ul>

Câmpul personalizat este afișat acum sub titlul „Exercițiul de astăzi:” într-un format de listă. Acesta a fost setat ca <h3> , dar poate fi ușor ajustat pentru a fi un alt stil de titlu sau paragraf. Dacă nu îl doriți în format de listă, acesta poate fi, de asemenea, structurat după cum doriți.

Personalizat condiționat

Câmpuri

Pot exista momente în care câmpul personalizat nu este inclus. Să spunem, de exemplu, că există o postare fără valoare de exercițiu. Acest lucru vă va permite să afișați informații de rezervă, deci nu sunt doar lăsate necompletate.

 <?php $exercises = get_post_meta($post->ID, 'exercises', true); ?> <h3>Today's exercise:</h3> <ul> <?php if ($exercises) { ?> <?php echo '<li>' .$exercises. '</li>'; ?> <?php } //if there is nothing for exercises then display else { ?> <li>Today was a rest day.</li>

Pluginul Advanced Custom Fields

Urmând acest tutorial, puteți obține cu ușurință câmpuri personalizate și să ruleze. Dacă preferați să utilizați un plugin pentru a adăuga câmpuri personalizate, totuși, există opțiuni disponibile și pentru asta. Câmpuri personalizate avansate este o opțiune foarte populară. Aceasta înlocuiește interfața implicită cu câmpuri personalizate din WordPress. Produsul final creat din acest tutorial ar putea fi creat și cu acest plugin.

Grupuri de câmp

Pluginul Advanced Custom Fields permite grupuri de câmpuri, ceea ce merită menționat deoarece sunt strâns legate de tutorialul de mai sus. În esență, am creat o versiune de bază a unui mini grup de câmp. Grupurile de câmpuri personalizate avansate conțin câmpuri personalizate, reguli de locație și opțiuni de afișare. Fiecare grup de câmpuri va folosi regulile de locație pentru a afișa câmpurile atunci când este necesar, în locația potrivită. La fel ca modul manual de a face lucrurile, aceste opțiuni de afișare vă permit să personalizați pagina după cum doriți. Există o mulțime de grupuri de câmpuri din care să alegeți cu acest plugin.

Acest lucru abia zgârie suprafața a ceea ce se poate face cu acest plugin. Pentru a obține o imagine completă, asigurați-vă că vizitați site-ul web Advanced Custom Fields.

Câmpurile personalizate sunt o capacitate ieșită din cutie a WordPress. Făcând doar câteva modificări ale șablonului, puteți adăuga cu ușurință această funcționalitate pe site-ul dvs. Acești pași acoperă elementele de bază și, cu puțină experimentare, veți avea o înțelegere clară a modului de implementare a câmpurilor personalizate. Când vă planificați următorul proiect, asigurați-vă că luați în considerare flexibilitatea pe care o oferă câmpurile personalizate. Acestea pot găzdui diverse tipuri de conținut, facilitând în același timp efectuarea de modificări la nivelul întregului site.