Cum să configurați un coș de cumpărături WordPress cu WooCommerce
Publicat: 2022-10-28Deci, aproape ați terminat de creat noul site de cumpărături WooCommerce. Ați terminat de construit aspectul principal al produsului pieței, meniul de selecție a categoriilor de produse și subsolul antetului cu indicații de navigare funcționale.
Cel mai important aspect al oricărui site de comerț electronic este capacitatea de a redirecționa și de a ajuta clienții să adauge produse în coșul lor de oriunde de pe site, până la procesul de finalizare a comenzii până la confirmarea comenzii.
Aceasta poate suna ca o funcție dificil de integrat în site-urile de comerț electronic WordPress, dar în realitate, nu este. WordPress are o comunitate mare care îi sprijină dezvoltarea și puteți adăuga această funcție pe site-ul dvs. folosind un plugin pentru coșul de cumpărături WooCommerce care funcționează perfect cu orice temă WordPress WooCommerce .
Cuprins
Cum funcționează coșul WooCommerce?
Când produsele sunt adăugate în coș în WooCommerce, acestea sunt adăugate într-o listă separată cu varianta și cantitatea aleasă de client. Acest lucru îi ajută pe utilizatori să țină evidența produselor selectate și, de asemenea, această funcție le face să vadă automat prețul total calculat al comenzii la care vor proceda la finalizarea comenzii. Și oferă, de asemenea, utilizatorilor posibilitatea de a edita pagina coșului de cumpărături WooCommerce.
Beneficiile unui coș de cumpărături în WooCommerce
Există câteva avantaje mari în utilizarea unui coș de cumpărături într-o platformă de cumpărături WooCommerce. Înainte de a trece la un ghid pas cu pas despre cum să creați o pagină de coș de cumpărături WooCommerce, unele dintre ele sunt:
- Conceput pentru a ajuta clienții să selecteze unul sau mai multe produse de cumpărat și să continue să răsfoiască alte produse.
- Vă ajută să calculați valoarea totală a produselor pe măsură ce continuați să le adăugați în coș.
- Afișează cantitatea și variațiile unui produs pe care l-ați selectat și calculează valoarea totală în consecință.
- Poate redirecționa clienții către pagina de plată printr-un clic pe un buton.
- Poate veni cu funcții suplimentare de coș de cumpărături WooCommerce, cum ar fi istoricul comenzilor, salvarea unui coș pentru mai târziu etc.
- Utilizatorii pot obține un plugin pentru coș WooCommerce care vine cu elemente de design uimitoare.
Cum să adăugați un coș de cumpărături la WooCommerce
Acum, să trecem prin procesul de adăugare a unui coș de cumpărături la WooCommerce. La sfârșitul acestui articol, veți putea începe să vindeți o mare varietate de produse cu o platformă funcțională de comerț electronic care conține cel mai bun plugin pentru coș de cumpărături pentru WordPress.
Pasul 1: Instalarea cerințelor prealabile
Pentru a începe cu crearea coșului și procesul de setări a coșului WooCommerce, va trebui să aveți anumite elemente de plugin instalate și activate în contul dvs. WordPress. Pentru aceasta, va trebui să aveți cele mai recente versiuni de WordPress , WooCommerce , Elementor page builder și plugin-ul ShopReady WooCommerce Shop Builder.
Pentru a instala pluginurile, conectați-vă la contul dvs. WordPress, mergeți la Tabloul de bord WordPress > Pluginuri > Adăugați noi și căutați pluginurile unul câte unul, apoi faceți clic pe Și acum faceți clic pe Activare când procesul de instalare se termină. Urmați aceeași procedură pentru a instala toate pluginurile și programele necesare.
Pasul 2: Utilizarea unei teme WooCommerce Coș de cumpărături
Acum, pentru a continua procesul nostru de construire a funcției de coș, va trebui să aveți instalată o temă WooCommerce funcțională pentru unele funcționalități suplimentare. În acest caz, putem folosi un șablon de coș de cumpărături WooCommerce în loc să folosim o temă WooCommerce WordPress .
Acest lucru va reduce foarte mult timpul necesar personalizării și publicării site-ului web.
Pentru a instala un șablon de comerț electronic funcțional pe site-ul dvs., începeți prin a crea o pagină nouă și dați-i un titlu din Tabloul de bord WordPress > Pagini > Adăugați nou și faceți clic pe Veți fi redirecționat către ecranul Editor Elementor . Aici veți găsi pictograma ShopReady – Biblioteca de șabloane Elementor . Faceți clic pe pictogramă pentru a obține acces la biblioteca de șabloane. Alegeți și alegeți orice șablon care se potrivește identității mărcii dvs. și faceți clic pe Inserare pentru a aplica șablonul.
Așteptați până când șablonul își termină procesul de import.
Ar trebui să arate așa ceva.
Secțiunea dvs. de produse poate părea goală dacă nu ați adăugat produse la WooCommerce. Ar trebui să adăugați imediat produsele pe care încercați să le prezentați pe platforma dvs. WooCommerce. Pentru a face acest lucru, puteți urma ghidul nostru anterior despre Cum să adăugați produse într-un magazin WooCommerce .
Fiecare produs WooCommerce poate fi personalizat cu titlul produsului, descrierea, prețul, prețul redus, imagini, metadate, variații etc. din tabloul de bord al produsului WooCommerce.
Pasul 3: Personalizarea paginii de produs
Pentru a începe procesul de personalizare a paginii dvs. de produs, mergeți la tabloul de bord ShopReady – WooCommerce Builder și selectați opțiunea Șabloane. De acolo, puteți construi o pagină de produs de bază pe care să o utilizați ca punct de plecare pentru personalizările dvs. Activați categoria Șablon de produs, apoi căutați configurarea produsului unic în acea categorie. Acum, selectați pictograma de editare din bara de instrumente.
Și după aceea, ecranul care afișează Editorul Elementor se va încărca pentru tine. Făcând clic pe semnul plus care poate fi văzut în colțul din dreapta sus al interfeței Elementor, veți începe procesul de personalizare a paginii. Când vine vorba de aspectul paginii dvs. și de widget-urile pe care doriți să le utilizați, aveți la dispoziție o mare varietate de opțiuni când vine vorba de secțiunile Elementor pe care le puteți insera în ea.
Pasul 3: Utilizarea widget-urilor Elementor pentru a personaliza pagina de produs a magazinului WooCommerce
Adăugarea unui titlu de produs
Deoarece ați stabilit deja o structură de secțiune primară folosind Elementor pentru pagina dvs. de produs WooCommerce, acum puteți începe procesul de adăugare a unui titlu de produs. Va trebui să utilizați abordarea prin glisare și plasare pentru a poziționa widgetul Titlu produs acolo unde doriți pe pagina produsului pentru a atinge acest obiectiv.
Afișați titlul corect al produsului mergând în bara de navigare Elementor, selectând fila Conținut și apoi căutând opțiunile Editor Refresh în submeniul care apare după ce faceți acest lucru. Pentru a selecta produsul potrivit, faceți clic pe numele acestuia în meniul drop-down care se află sub Produs demonstrativ.
Va trebui să accesați Tabloul de bord al produsului WooCommerce și să adăugați sau să modificați informațiile esențiale despre produs acolo pentru ca aceste date să afișeze titlul corect al produsului. Acest lucru se poate face fie făcând clic pe butoanele „Adăugați” sau „Editați”.
Adăugarea unei imagini recomandate la pagina produsului
După aceea, veți dori să vă asigurați că produsul dvs. are atât o galerie de imagini, cât și o imagine prezentată. Pentru a realiza acest lucru, puteți utiliza oricare dintre diferitele widget-uri de imagine care sunt incluse în plugin-ul all-in-one pentru comerțul electronic care vine împachetat cu Elementor.
De dragul acestei demonstrații, vom folosi widget-ul ShopReady Thumbnail with Zoom, care, după cum sugerează și numele, are o funcție de zoom. Dacă utilizați acest widget, veți putea afișa clienților dvs. o versiune de zoom cu mouse-ul pentru produs WooCommerce de fiecare dată când își mută mouse-ul peste imaginea produsului dvs.
În același mod ca și înainte, puteți selecta imaginea corespunzătoare a produsului făcând clic pe fila Conținut a opțiunii Produs demonstrat.
Adăugarea blocului pentru widgetul de prețuri
Blocul de prețuri pentru produse este o altă componentă esențială care ar trebui să fie prezentă pe pagina de produs eCommerce. Pentru a realiza acest lucru, va trebui să modificați atributele produsului WooCommerce cu ajustările corespunzătoare și să utilizați widget-ul ShopReady Price, care trebuie să fie poziționat sub titlul produsului.
Pentru a vă asigura că este afișat prețul corect, alegeți titlul produsului din meniul drop-down din opțiunea Produs demonstrativ din fila Conținut.
Adăugarea descrierii produsului
Folosind acest widget de descriere a produsului de suplimente pentru produse WooCommerce, nu numai că aveți opțiunea de a adăuga descrieri de produse, dar aveți și puterea de a personaliza foarte mult descrierile. Prin utilizarea filei de stil, veți avea posibilitatea de a modifica modul în care descrierea produsului va fi afișată publicului larg.
Adăugarea funcției Adăugați în coș
Posibilitatea clienților de a adăuga articole suplimentare în coșul lor înainte de a trece la pagina de plată este facilitată de opțiunea „Adăugați în coș”, care este o altă caracteristică extrem de importantă.
Utilizarea widget-ului ShopReady Adaugă în coș vă va permite să echipați pagina magazinului dvs. de comerț electronic cu o versiune puternică a funcției Adăugați în coș . Cu ajutorul acestui widget, veți putea oferi clienților dumneavoastră posibilitatea de a ajusta cantitatea de produs pe care o au în coș direct din blocul Adaugă în coș.
De asemenea, puteți modifica aspectul butonului de adăugare în coș Elementor prin fila Elementor Style pentru stilul produsului WooCommerce. Aici puteți schimba fontul, culoarea, fundalul, marginea, umplutura și alte atribute.
Adăugarea de metadate la pagina de produs
Implementarea unui filtru de produs WooCommerce care utilizează metadatele și atributele produsului pe care le-ați adăugat la WooCommerce în timp ce adăugați produse este ceva ce ar trebui să faceți dacă doriți să oferiți consumatorilor o experiență de cumpărături mai satisfăcătoare.
Căutați widget-ul ShopReady Meta și plasați-l chiar sub butonul „adăugați în coș” de pe pagina dedicată produsului dumneavoastră. Acest lucru vă va permite să afișați informațiile în cauză.
Când selectați titlul de produs corespunzător din meniul derulant situat în opțiunea Produs demonstrat din fila Conținut, etichetele și metadatele produselor dvs. ar trebui să fie afișate cu acuratețe.
Adăugarea butoanelor de distribuire pe rețelele sociale pe pagina de produs
Folosind un buton simplu de partajare a rețelelor sociale, le puteți permite consumatorilor să partajeze postările despre produse pe rețelele sociale direct de pe pagina produsului WooCommerce pentru articolul pe care l-au achiziționat. Pe care îl puteți produce folosind doar funcționalitatea de glisare și plasare oferită de widgetul Elementor Social Share.
Direct din fila Conținut, blocul poate fi personalizat cu orice pictograme de rețele sociale, text și linkuri care pot fi partajate alese de utilizator. În plus, fila Elementor Style permite utilizatorilor să modifice prezentarea vizuală a blocurilor de distribuire socială, dacă doresc acest lucru.
Și cu asta, ați terminat cu elementele fundamentale ale personalizării paginilor de produse WooCommerce.
Pasul 4: Adăugarea produselor WooCommerce
Utilizarea widget-ului Produse înrudite care este inclus în suplimentele pentru produse WooCommerce vă va permite să afișați produse similare pe pagina produsului, ceea ce este o strategie excelentă pentru creșterea vânzărilor online. Folosind widget-ul ShopReady Related Products, puteți construi cu ușurință un bloc glisor de produs superb, care este împărțit în secțiuni.
Pentru a utiliza widget-ul, trebuie doar să-l glisați și să-l plasați sub blocul de produs unic, apoi selectați produsele specifice pe care doriți să le prezentați pe pagina produsului unic din fila Conținut .
Pasul 5: Adăugarea câmpurilor de plată personalizate WooCommerce
După cum am menționat mai devreme, acesta este un aspect important al unei platforme de comerț electronic funcționale. Cu un constructor de magazine WooCommerce precum ShopReady, puteți utiliza cu ușurință un cod scurt pentru coșul WooCommerce și puteți implementa un coș de comerț electronic funcțional în acest fel sau puteți utiliza un widget ShopReady pentru a aplica această caracteristică.
Pentru a avea un coș funcțional, mai întâi va trebui să adăugați widgetul „ Adăugați în coș” pe pagina produsului. Ceea ce am făcut deja. Deci, să ne întoarcem și să creăm propria pagină de coș, unde toate produsele vor fi afișate odată ce au fost adăugate în coș.
ShopReady – WooCommerce Shop Builder permite utilizatorilor să aleagă între două șabloane diferite de coș, care sunt disponibile pentru a fi utilizate din Tabloul de bord ShopReady . Din tabloul de bord ShopReady, faceți clic pe meniul Șabloane acum, activați și editați un șablon WooCommerce Preset Cart oferit de ShopReady.
Prin crearea unui nou șablon de coș WooCommerce sau editarea unuia existent, veți fi redirecționat către ecranul Editor Elementor.
De aici, puteți adăuga pur și simplu widget-ul ShopReady Cart , iar pagina coșului dvs. își va lua forma automat, iar crearea unui coș de cumpărături WordPress fără plugin este un proces atât de simplu cu ShopReady. Nu necesită pluginuri sau instrumente suplimentare.
Dacă aveți produse deja adăugate în coș, ar trebui să arate cam așa.
Și aici o aveți, o pagină funcțională de coș WooCommerce cu un buton funcțional pentru coș. Aveți și opțiunea de a personaliza în continuare pagina coșului cu Elementor. Cu Elementor, sunteți liber să schimbați fiecare aspect al paginii coșului, de la culorile de fundal la setările tipografiei Elementor.
De asemenea, puteți utiliza un cod scurt pentru coșul de cumpărături WooCommerce. În acest caz, va trebui să utilizați widgetul Elementor ShortCode.
Când ați terminat de personalizat pagina magazinului, asigurați-vă că apăsați pe Publicare / Actualizare pentru a face modificările live pentru vizitatori și clienți.
Concluzie
Întregul proces de creare a unui buton personalizat de adăugare în coș WooCommerce poate părea o sarcină descurajantă, dar pe măsură ce progresați prin acest ghid, veți vedea că procesul de creare a acestei funcții tehnice nu este deloc dificil cu setul potrivit de instrumente. ShopReady WooCommerce Shop Builder este un pachet complet care oferă toate instrumentele de care aveți nevoie pentru a crea o platformă robustă de comerț electronic de la zero.
Și dacă întâmpinați probleme cu ShopReady sau cu procesul de creare a coșului, puteți oricând să căutați documentația coșului WooCommerce .
Întrebări frecvente cu privire la coșurile de cumpărături WooCommerce
WordPress are un coș de cumpărături?
WordPress CMS este o platformă de găzduire a site-urilor web. Nu include niciun coș de cumpărături sau funcții legate de comerțul electronic. Dar, deoarece este o platformă open-source, sunteți liber să utilizați oricare dintre instrumentele, pluginurile sau modulele sale de comerț electronic create de comunitate pentru a adăuga un coș pe site-ul WordPress.
WooCommerce are un coș de cumpărături?
Da, pluginul de bază WooCommerce vine cu un buton funcțional pentru coș și o pagină de coș. Dar este de natură foarte minimalistă. Pentru a condimenta pagina coșului de cumpărături, puteți utiliza orice număr de extensii WooCommerce sau puteți profita din plin de opțiunile de personalizare ale generatorului de pagini WooCommerce Elementor și ShopReady pentru paginile coșului de comerț electronic. De la pictogramele coșului WooCommerce până la aspectul de pagină aprofundat, totul poate fi personalizat cu ShopReady.
Cum creez o pagină de plată personalizată în WooCommerce?
Descărcați și instalați ShopReady – WooCommerce Shop Builder. Acum creați un nou șablon WooCommerce Checkout Page din tabloul de bord ShopReady. Veți fi redirecționat către Editorul Elementor, de aici puteți utiliza widget-ul ShopReady Checkout pentru a crea o pagină de plată funcțională personalizată în WooCommerce.