Cum să vă personalizați pagina de magazin WooCommerce

Publicat: 2022-12-02

Doriți să vă personalizați pagina magazinului WooCommerce? Este o idee grozavă! Pagina magazinului dvs. WooCommerce este cea mai importantă pagină din magazinul dvs. Acolo vor ajunge clienții atunci când vă vizitează site-ul web, așa că trebuie să arate bine și să fie ușor de navigat. Crearea unei experiențe de cumpărături mai bune va avea ca rezultat clienți mai fericiți și mai multe vânzări!

În această postare, vom explora modul în care puteți trece de la pagina de magazin WooCommerce implicită de bază la o pagină de magazin personalizată, care atrage atenția, care creează o experiență de utilizator mai bună pentru clienții dvs. Vom analiza diferite moduri în care vă puteți personaliza magazinul și de ce ar trebui să luați în considerare utilizarea Codeable.

De ce ar trebui să vă personalizați pagina de magazin WooCommerce?

Pagina magazinului dvs. este una dintre paginile create implicit atunci când configurați WooCommerce și este primul lucru pe care îl văd clienții când vă vizitează magazinul. Și după cum poți ghici, este important să faci o primă impresie bună – dacă clienților nu le place ceea ce văd, vor părăsi site-ul tău fără să cumpere nimic! Cum arată și se simte pagina dvs. de magazin le poate spune clienților mai multe despre afacerea dvs.

Pagina magazinului Style Girlfriend, realizată cu WooCommerce

O pagină bine personalizată oferă cumpărătorilor tăi o experiență excelentă de utilizare. Dacă clientul dvs. vine la magazinul dvs. și nu poate găsi ceea ce își dorește, deoarece produsele dvs. sunt greu de sortat, cel mai probabil va fi dezamăgit și va părăsi site-ul dvs.

Personalizarea vă permite să creați pagini de magazin care sunt ușor de navigat. Veți putea adăuga și edita elemente care pot îmbunătăți experiența de cumpărături a clienților dvs.

Când vă personalizați magazinul, îl puteți personaliza pentru a se potrivi nevoilor clienților dvs. De exemplu, puteți adăuga elemente precum videoclipuri personalizate ale produselor, ghiduri personalizate și capabilități multi-valută și multilingvă.

Pagina implicită de magazin WooCommerce este de bază – are „magazin” ca titlu de pagină și afișează toate produsele într-un aspect de grilă. Bine că există multe moduri de a vă personaliza pagina magazinului – de exemplu, ați putea dori să:

  • Adăugați o imagine banner în partea de sus a paginii magazinului dvs., care vă promovează marca sau produsele.
  • Adăugați un glisor de imagine care afișează fotografiile produselor sau ofertele de produse într-un mod atractiv.
  • Adăugați pictograme pentru rețelele sociale, astfel încât clienții să-și poată împărtăși achizițiile pe rețelele sociale.
  • Adăugați widget-uri pentru ca clienții să poată efectua rapid acțiuni precum adăugarea de articole în coșul lor sau înscrierea pentru notificări prin e-mail din magazinul dvs.
  • Oferiți clienților posibilitatea de a filtra produsele dvs. pe baza atributelor.
  • Adăugați o secțiune de produse recomandate sau cele mai vândute pentru a vă promova produsele de top.

Există multe moduri diferite de a personaliza paginile magazinului WooCommerce în funcție de nivelul de tehnică cu care vă simțiți confortabil. Vom analiza în profunzime trei metode diferite.

Utilizarea blocurilor WooCommerce sau a unui generator de pagini

Puteți folosi WooCommerce Blocks și editorul de blocuri Gutenberg pentru a crea un aspect mai personalizat pentru pagina magazinului dvs. Această metodă este cea mai bună dacă doriți să implementați personalizări de bază în magazinul dvs., pe care le puteți face cu ușurință singur.

Acestea sunt câteva moduri prin care vă puteți personaliza pagina magazinului folosind WooCommerce Blocks:

  • Afișați cele mai bine vândute, cele mai bine cotate, cele mai noi produse, la vânzare și alese manual.
  • Afișați produsele pe baza taxonomiilor, folosind blocul Produse după categorie, Produse după blocul de etichete, Produse după blocul de atribute etc.
  • Afișați recenzii în magazinul dvs., pe care le puteți segmenta după produs sau categorie.
  • Adăugați filtre active de produse sau filtrați produsele după preț sau atribut.
  • Afișați conținutul coșului clientului și pagina de plată direct pe pagina magazinului.
Blocul Produse după categorie

În plus, puteți utiliza un generator de pagini precum Elementor sau Divi dacă WordPress dvs. este compatibil cu acesta. Un generator de pagini este oarecum similar cu Gutenberg, în sensul că puteți utiliza widget-uri pentru a extinde funcționalitatea paginilor site-ului dvs., dar un generator de pagini este mai avansat, deoarece vă permite să construiți pe designul temei dvs. WordPress, spre deosebire de simpla adăugare de elemente și modificarea structurii paginii. Puteți lua în considerare un generator de pagini dacă doriți să ascundeți elemente pentru site-ul dvs. mobil, să setați umplutură și margini, să creați elemente globale etc.

Puteți consulta ghidul nostru de utilizare a Elementor pentru a crea un site adaptabil pentru dispozitive mobile, ca exemplu de ce un generator de pagini poate fi potrivit pentru dvs.

Folosind CSS personalizat

Ca alternativă, adăugarea propriului CSS vă permite să personalizați aspectul magazinului dvs., înlocuind stilurile implicite ale temei dvs. WordPress. CSS personalizat vă permite să creați „reguli” pe pagina magazinului dvs. sau chiar pe întregul site web.

Puteți face tot felul de modificări folosind CSS, cum ar fi editarea ordinii secțiunilor, grosimea chenarelor, culoarea textului, lățimea conținutului sau widget-ului, dimensiunea fontului etc. Pentru a adăuga CSS personalizat, accesați Aspect > Personalizare > CSS suplimentar .

Ecran CSS suplimentar

Desigur, aceasta este o abordare mai tehnică a personalizării paginii magazinului WooCommerce și este recomandată numai dacă aveți ceva experiență în dezvoltarea WordPress.

Utilizarea pluginurilor WooCommerce

Dacă doriți să extindeți funcționalitatea sau să schimbați aspectul magazinului dvs. WooCommerce într-un fel, de cele mai multe ori veți găsi un plugin care face ceea ce aveți nevoie. Este foarte ușor să personalizați pagina de magazin cu pluginuri WooCommerce, dar nu ar trebui să vă bazați pe deplin pe ele, din următoarele motive:

  • Pluginurile vă pot încetini site-ul dacă aveți prea multe, ceea ce nu este ideal dacă aveți nevoie de multe plugin-uri pentru a vă realiza pagina ideală de magazin.
  • Pluginurile variază ca preț, dar dacă aveți prea multe, poate deveni foarte scump să plătiți pentru acestea anual sau lunar.
  • Există o mulțime de pluginuri disponibile și poate dura timp pentru a le găsi pe cele care într-adevăr întrunesc criteriile dvs.

Am spune că este perfect să folosiți câteva plugin-uri WooCommerce, dar nu vă bazați pe ele pentru fiecare lucru mic. Dacă doriți să personalizați puternic pagina magazinului dvs., poate doriți să luați în considerare o soluție care va avea o încărcare mai mică pe site-ul dvs.

Dacă vă gândiți la pluginuri de personalizare pentru magazinul dvs. WooCommerce, aruncați o privire la acestea trei, care fac toate lucruri diferite. Nu suntem afiliați cu niciunul dintre ei, dar credem că sunt un loc bun pentru a începe:

StoreCustomizer

Pagina principală a pluginului StoreCustomizer

StoreCustomizer este un plugin WooCommerce care poate fi folosit pentru a personaliza multe zone ale magazinului dvs., inclusiv paginile de produse, coșul de cumpărături și paginile de plată.

Spre deosebire de adăugarea CSS, acest plugin nu anulează designul temei. În schimb, StoreCustomizer funcționează cu tema pe care o utilizați pentru a adăuga mai multe opțiuni de design și funcționalități paginilor dvs. WooCommerce.

Pluginul are un plan gratuit care vă permite să editați sau să eliminați elemente, să editați dimensiunea și culoarea fontului textului, să personalizați designul tuturor butoanelor din magazin, inclusiv butoanele coșului și a comenzii și multe altele.

Versiunea pro vă oferă acces la opțiuni de personalizare mai avansate, cum ar fi adăugarea unei căutări de produse Ajax oriunde, adăugarea de insigne de produse cu aspect grozav etc.

StoreCustomizer nu va suprascrie șabloanele WooCommerce. În schimb, pluginul adaugă opțiuni de design și funcționalitate avansată a magazinului paginilor tale existente.

Pentru a configura pluginul, urmați pașii de mai jos:

  • Accesați tabloul de bord WordPress
  • Faceți clic pe „pluginuri”, apoi faceți clic pe „adăugați nou”.
  • Accesați bara de căutare a pluginurilor și căutați „StoreCustomizer”.
  • Instalează pluginul și activează-l.

Alternativ, accesați WordPress.org și descărcați pluginul. Apoi, accesați tabloul de bord WordPress și încărcați fișierul ZIP prin Plugin-uri > Adăugați nou > Încărcați. În cele din urmă, accesați Meniul WordPress și activați pluginul.

Pentru a configura aplicația, navigați la WooCommerce > StoreCustomizer în tabloul de bord WordPress.

Veți găsi note despre cum să configurați versiunea gratuită. Pentru versiunea premium, va trebui să activați setarea pentru fiecare funcție pro specifică pe care doriți să o utilizați. Accesați Personalizare > StoreCustomizer.

Tabelul produselor WooCommerce Ultimate

Pagina de pornire WooCommerce Product Table Ultimate

WooCommerce Product Table Ultimate este un alt plugin pe care îl puteți folosi pentru a crea pagini de produse de magazin bine personalizate, afișând produsele într-un tabel.

Cu acest plugin, puteți adăuga mai multe produse pe o singură pagină, permițându-vă să le oferiți clienților tăi șansa de a comanda mai multe articole cu un singur clic. Această caracteristică le permite, de asemenea, să filtreze și să sorteze produsele mai rapid, ceea ce este perfect pentru clienții care doresc să facă comenzi în vrac.

Pluginul vă permite să enumerați produse în funcție de categorie și etichete, așa că, dacă vindeți produse care pot fi clasificate, aceasta este o caracteristică pe care ați dori să o utilizați.

Pluginul WooCommerce Product Table vine și cu funcționalitate pregătită pentru traducere. De asemenea, este pe deplin compatibil cu WPML, LocoTranslate și alte plugin-uri multilingve.

După achiziționarea pluginului, îl veți putea încărca pe site-ul dvs. WordPress prin Plugins>adăugați nou>încărcare. Apoi va trebui să-l activați pentru a începe să îl utilizați. După ce totul este configurat, deschideți pluginul și alegeți ce coloane doriți să includeți în tabel. Acestea pot include titluri de produse, SKU-uri, descrieri, categorii, etichete, atribute la nivel de stoc, miniaturi și butonul de adăugare în coș.

De asemenea, puteți decide să adăugați mai multe produse în același timp. Aceasta înseamnă că va trebui să afișați o casetă de selectare lângă fiecare rând de produse. Această funcție le va permite cumpărătorilor să scaneze rapid în jos fiecare rând de produse, să selecteze ce produs să adauge în coșul lor și, când termină, să adauge toate produsele selectate cu un singur clic pe buton.

Vizualizare rapidă WooCommerce

WooCommerce Quick Box

WooCommerce Quick View este un plugin pe care îl puteți folosi pentru a personaliza aspectul magazinului dvs. Pluginul vă permite să alegeți dacă doriți să afișați informații complete sau parțiale despre produs și să afișați sau să ascundeți imagini și galerii. De asemenea, permite personalizarea textului butonului de vizualizare rapidă pentru a maximiza vânzările. De asemenea, puteți activa sau dezactiva vizualizarea rapidă la nivel global pentru a afișa anumite categorii sau subcategorii de produse.

Pluginul vă permite să adăugați și să editați diverse aspecte ale produselor dvs., inclusiv:

  • Evaluare cu stele
  • Preț
  • Scurta descriere
  • Descriere completa
  • Buton de adăugare în coș
  • Categorii și etichete
  • Scapă jos
  • Atribute

WooCommerce Quick View facilitează clienților să cumpere produse din magazinul dvs. De asemenea, economisește timp datorită funcțiilor precum comanda rapidă, control cu ​​granulație fină și casetă luminoasă a galeriei de imagini.

Cea mai bună metodă: utilizați codificabil

Codabil

În timp ce personalizarea paginii dvs. de magazin WooCommerce este destul de posibilă de unul singur, poate doriți să apelați la un expert pentru a vă ajuta. Există câteva motive pentru care ați putea dori să faceți acest lucru:

  • Nu sunteți familiarizat cu backend-ul WooCommerce și nu aveți timp să învățați cum să vă aprofundați.
  • Nu știți cum să găsiți și să utilizați exact pluginurile de care aveți nevoie pentru personalizările dvs.
  • Personalizările pe care doriți să le implementați sunt tehnice și vă faceți griji să vă distrugeți site-ul.
  • Doriți pe cineva care să depaneze, să găsească și să remedieze orice erori pe care le-ați făcut în timpul procesului de personalizare.

Cea mai ușoară metodă de a vă personaliza pagina magazinului de comerț electronic este să utilizați un serviciu precum Codeable. Este cel mai simplu mod de a intra în legătură cu dezvoltatori profesioniști cu experiență pentru tot felul de proiecte – sarcini unice, dezvoltare personalizată pe termen lung etc.

Codeable este diferit de alte platforme de angajare pentru dezvoltatori. Asta pentru ca:

  • Codeable este specializat în WordPress și recomandă doar codificatori experți profesioniști care sunt testați și instruiți.
  • Odată ce vă împărtășiți cerințele proiectului, sunteți conectat cu 3-5 experți cu experiențe diferite și tarife orare. Puteți alege dintre ele în funcție de bugetul și preferințele dvs.
  • Dezvoltatorii sunt la prețuri accesibile și trebuie să plătiți doar odată ce lucrarea este finalizată și sunteți mulțumit de ea.
  • Primiți un răspuns în aceeași zi în Codeable, permițându-vă să reduceți timpul.

Vezi ce spun proprietarii de magazine online despre Codeable:

„Nu am putea fi mai fericiți de experiența noastră. După ce a petrecut patru ani lucrând la un site WooCommerce lent, problematic și lent, despre care mulți dezvoltatori au spus că este la fel de „bun pe cât îl puteau obține”, un geniu Codeable a intervenit și a salvat ziua. Profesional, rapid, politicos și accesibil. Ne bucurăm că le-am găsit!”

NAGA SHAKTI

„Codeable este uimitor din multe aspecte — concentrarea pe calitate, garanția de asigurare a calității, calitatea independenților înșiși, precum și platforma generală. De asemenea, apreciez că puteți găsi dezvoltatori buni aproape de casă sau puteți căuta dezvoltatori care se potrivesc cel mai bine proiectului sau stilului dvs. de lucru. Mulțumesc!"

ANDREW KEAVENEY

Personalizați-vă pagina de magazin WooCommerce cu Codeable

Personalizarea paginii dvs. de magazin WooCommerce ar trebui să fie printre primele lucruri pe care le faceți odată ce începeți să vindeți online. Vă va asigura că oferiți clientului dvs. o primă impresie bună despre afacerea dvs. și o experiență excelentă pentru utilizator.

Pagina magazinului lui Chaka Khan, realizată cu WooCommerce

Puteți folosi blocurile WooCommerce sau un generator de pagini pentru a vă personaliza singur pagina magazinului WooCommerce. De asemenea, puteți decide să instalați pluginuri concepute pentru personalizarea magazinelor WooCommerce. Dacă aveți ceva experiență tehnică, puteți încerca să adăugați CSS personalizat pe pagina magazinului dvs. Dar dacă doriți să duceți lucrurile cu un pas mai departe, lăsați un expert de la Codeable să se ocupe de toată personalizarea pentru dvs.

Dacă doriți să schimbați total aspectul și designul paginii dvs. de magazin WooCommerce sau dacă doriți să adăugați un fel de funcționalitate care nu poate fi realizată cu ușurință cu un plugin, atunci Codeable este cu siguranță calea de urmat. Dar poate doriți să luați în considerare și Codeable dacă nu doriți să vă bazați pe pluginuri sau nu aveți timp să învățați cum să personalizați singur pagina magazinului. Indiferent de ce ai nevoie, poți să-ți trimiți brief-ul și să descrii exact ceea ce vrei și vei fi asociat cu experți care vor analiza și finaliza întregul proiect.

Partajați-vă proiectul pe Codeable și lăsați un expert să se ocupe de fiecare aspect al personalizării magazinului dvs. WooCommerce.