Articles

Cum să adăugați câmpuri personalizate în paginile de produse WooCommerce

Cercetați o modalitate de a adăuga câmpuri personalizate în paginile de produse WooCommerce?

Dacă doriți să adăugați specificații detaliate pe o pagină de produs WooCommerce sau sunteți interesat să afișați variante alternative de produse cu un clic pe un buton, adăugarea de câmpuri personalizate în WooCommerce durează doar câteva momente din timpul dumneavoastră.

După aceea, sunteți capabil să personalizați toate părțile tabloului de bord WooCommerce și să încorporați rapid informații despre site care, de obicei, ar necesita introducerea manuală a datelor.

În acest articol, vă vom arăta pas cu pas cum să adăugați câmpuri personalizate la produsele WooCommerce folosind pluginul gratuit Advanced Custom Fields (ACF).

Exemple de utilizare a câmpurilor personalizate pentru WooCommerce

Când ar putea fi utile câmpurile personalizate în WooCommerce?

  • Pentru adăugarea de informații suplimentare despre produs pentru lucruri precum computerele, unde ați arăta specificații tehnice, cum ar fi memoria RAM și puterea de procesare.
  • Mesaje promoționale pe care le puteți schimba rapid în altceva.
  • Elemente media unice care nu pot fi inserate cu ajutorul funcțiilor standard WooCommerce, cum ar fi un videoclip suplimentar.
  • Date și ore pentru când aveți o numărătoare inversă, o licitație sau o dată de lansare pentru un produs.
  • Opțiuni de produs suplimentare, pe lângă variante, prin care clienții se pot uita.
  • Paragrafe pentru a explica instrucțiunile detaliate de utilizare a unui articol.
  • Oferte adiționale în care utilizatorului i se prezintă mai multe vânzări suplimentare care completează produsul curent. Exemplele includ atașamente pentru periuțe de dinți electronice sau diferite brelocuri pentru o brățară.
  • Toate datele neobișnuite sau suplimentare pe care ați dori să le încorporați într-o pagină de produs care fie nu sunt acceptate prin WooCommerce, fie sunt mai ușor de completat cu câmpuri personalizate.

Cum să adăugați câmpuri personalizate în paginile de produs WooCommerce

În acest exemplu, vom face un magazin de calculatoare fictiv care vinde laptopuri. Ar fi nevoie de o cantitate semnificativă de timp pentru a tasta specificațiile computerului pentru fiecare laptop nou, așa că, în schimb, vom include câmpuri pentru a selecta aceste specificații în funcție de tipurile de computere pe care le vindem.

Pentru a adăuga câmpuri personalizate la produsele WooCommerce, trebuie să instalați pluginul gratuit Advanced Custom Fields pe site-ul dumneavoastră WordPress. Apoi, iată cum să îl configurați…

Advanced Custom FieldsAdvanced Custom Fields

Autor(i): Elliot Condon

Versiunea curentă: 5.9.5

Ultima actualizare: 11 februarie 2021

advanced-custom-fields.5.9.5.zip

Iată cum să adăugați câmpuri personalizate în paginile de produs WooCommerce pas cu pas:

  1. Creați un nou grup de câmpuri
  2. Adaugați câmpul (câmpurile) personalizat(e)
  3. Configurați setările suplimentare ale grupului de câmpuri
  4. Adaugați informații la produse
  5. Afișați informațiile despre câmpul personalizat pe front-end

Crearea unui nou grup de câmpuri

În tabloul de bord WordPress, mergeți la noua filă Custom Fields (Câmpuri personalizate). Apoi, faceți clic pe Add New (Adăugare nouă) de lângă Field Groups (Grupuri de câmpuri).

add new custom fields WooCommerce

Numiți un grup de câmpuri. De exemplu, „Computer Fields” (Câmpuri de calculator). Un grup de câmpuri este o colecție de câmpuri pe care le veți avea pentru un produs sau o secțiune a site-ului dvs. web, cum ar fi o listă de specificații pe care doriți să apară pe toate paginile de produse pentru laptopuri.

Adaugați câmpul (câmpurile) personalizat(e)

Click pe butonul Add Field pentru a adăuga un câmp la acest grup.

add a field

Creați un:

  1. Field Label (Etichetă de câmp) – în principal pentru referință proprie.
  2. Field Name (Nume de câmp) – servește ca litere pe care le veți plasa în codul dvs. personalizat, sau shortcode în cazul nostru. Îl puteți lăsa ca fiind cel implicit pe care îl generează pluginul.
  3. Field Type – formatul pe care îl creați pentru acel câmp. Puteți alege dintre opțiuni precum selectori de date, căsuțe de selectare, căsuțe de selectare, butoane derulante și butoane radio.

De asemenea, este posibil să doriți să puneți câteva instrucțiuni pentru dvs. sau pentru dezvoltator, împreună cu o specificație dacă acest câmp este necesar sau nu.

required options for custom fields WooCommerce

Dacă lucrați cu un câmp care are mai multe opțiuni (cum ar fi butoanele radio), va trebui în continuare să adăugați câmpul Alegeri. Acestea sunt opțiunile de selecție pe care doriți să le afișați în partea din spate a paginii de produs, cum ar fi diferite procesoare de bază.

field choices for custom fields WooCommerce

Restul setărilor sunt de obicei opționale, cum ar fi valoarea implicită, aspectul și dacă doriți să afișați valoarea sau eticheta.

extra settings

Când ați terminat cu un câmp sau un grup, faceți clic pe butonul Publicare sau Actualizare pentru a vă asigura că acesta este salvat.

update a field group

Pentru a adăuga mai multe câmpuri la grupul dumneavoastră, faceți din nou clic pe butonul Add Field (Adăugare câmp).

Iată cum arată cu patru câmpuri în acest grup pentru:

  • CPU
  • Memorie
  • Sistem de operare
  • Data de lansare

add field

Configurați setările suplimentare ale grupului de câmpuri

După ce grupul de câmpuri este gata, derulați până la modulul Locație. Aici identificați locul în care doriți ca grupul de câmpuri să apară în tabloul de bord WordPress.

Setați Post Type egal cu Product. Sau, dacă doriți să fiți mai specific, puteți alege, de asemenea, o anumită categorie de produse.

setting the location of the custom fields WooCommerce

Sub Settings (Setări), asigurați-vă că Field Group (Grup de câmpuri) este Active (Activ). Acest lucru vă permite să îl vedeți pe acele pagini de produse și, eventual, să arătați selecția câmpurilor clienților dvs.

Stilul depinde de propriile preferințe. Același lucru se poate spune și despre poziție, plasarea etichetei și plasarea instrucțiunilor. Totul ține de preferințele personale și de modul în care doriți să vă formatați backend-ul. Atunci când aveți îndoieli, lăsați-le ca fiind cele implicite.

Setați numărul de comandă dacă aveți mai multe grupuri de câmpuri care apar pe paginile de produs. Acest lucru controlează ordinea în care se afișează diferite grupuri de câmpuri.

De asemenea, puteți seta o descriere și puteți ascunde anumite detalii pe ecran.

settings

Adaugați informații la produse

În continuare, navigați la editorul pentru un produs unde doriți să adăugați câmpuri personalizate.

Dacă toate setările sunt configurate corect, ar trebui să vedeți câmpurile personalizate sub caseta de date Produs.

Pentru exemplul nostru, dacă ar fi să adăugați o nouă pagină de produs pentru un laptop, puteți alege CPU, Memorie, Sistem de operare și Data lansării.

viewing the custom fields WooCommerce

Afișează informațiile câmpurilor personalizate pe front-end

Pentru a finaliza lucrurile, trebuie să afișați informațiile din câmpurile personalizate pe pagina front-end a produsului unic. Puteți adăuga aceste informații oriunde, dar locurile bune de pornire sunt în descrierea lungă sau scurtă a produsului.

Pentru a afișa informațiile despre câmpuri pe front-end, utilizați codul scurt . Adăugați numele câmpului între ghilimele:

placing the shortcodes

Puteți găsi numele câmpului pentru fiecare câmp în interfața editorului de grup de câmpuri:

field name - custom fields WooCommerce

Pentru a finaliza lucrurile, apăsați butonul Publicare sau Actualizare.

Când deschideți produsul dvs. în front-end, ar trebui să vedeți câmpurile dvs. personalizate unde ați adăugat shortcodes:

frontend product

Aveți întrebări despre cum să adăugați câmpuri personalizate?

Un avantaj al utilizării Advanced Custom Fields față de plugin-urile alternative de creare de câmpuri este că puteți plasa noile câmpuri în orice locație de pe site-ul dvs., inclusiv în paginile de produse, postările și modulele de coș – personalizându-vă tabloul de bord și accelerând procesul de creare de conținut.

Este o opțiune minunată pentru a vă extinde creativitatea și pentru a face sarcina plictisitoare de a construi pagini de produse un pic mai simplă.

Înțelegem că pluginul Advanced Custom Fields are o mică curbă de învățare, așa că, dacă aveți orice gânduri sau întrebări despre adăugarea de câmpuri personalizate în WooCommerce, anunțați-ne în comentariile de mai jos!

De asemenea, puteți consulta tutorialul nostru complet ACF pentru a afla mai multe despre cum să utilizați acest plugin flexibil.

Ghid gratuit

5 Sfaturi esențiale pentru a vă accelera site-ul WordPress

Reduceți timpul de încărcare chiar și cu 50-80%
doar urmând sfaturi simple.

.