Cum să creezi un site WooCommerce alimentat de Elementor
Publicat: 2021-10-28Nu este suficient ca platforma WordPress în sine să fie cel mai popular sistem de management al conținutului (CMS) din lume. Avem, de asemenea, cele mai populare platforme de creare de pagini și de comerț electronic în Elementor și WooCommerce. Ca atare, are sens să le folosiți pe toate trei pentru a crea un magazin online cu aspect stelar și performant.
Dacă îl defalcăm, WordPress este ideal pentru a vă organiza postările, paginile și produsele. WooCommerce oferă o integrare strânsă cu platforma datorită dezvoltatorilor săi (Automatic). În plus, Elementor oferă o construcție puternică și intuitivă a paginii cu drag-and-drop. Este o soluție completă fără cod pentru construirea magazinului dvs.
În această piesă, vom vedea cum să construim un magazin folosind Elementor și WooCommerce. De-a lungul timpului, ne vom uita la modul în care ambele se îmbină pentru a vă oferi cea mai mare flexibilitate pentru site-ul dvs.
De ce WordPress, Elementor și WooCommerce funcționează bine împreună
Merită să aruncați o privire mai atentă asupra modului în care WordPress, Elementor și WooCommerce se pot combina pentru a vă ajuta să creați magazine online de top.

Pentru început, WordPress este cel mai folosit CMS de pe piață. Desigur, acest lucru nu este suficient pentru a garanta o astfel de poziție dominantă în rândul utilizatorilor. De fapt, ne-am uitat la asta într-o postare anterioară, așa că vă încurajăm să citiți acea postare în continuare. Pe scurt, este o platformă sigură, stabilă și scalabilă pe care poți să o construiești.
Apropo de asta, ai și WooCommerce. Deoarece Automattic dezvoltă pluginul, acesta are o integrare excelentă cu WordPress de bază, dar asta nu este tot.

Este, de asemenea, cea mai populară platformă de comerț electronic. În cadrul ecosistemului WordPress, acesta are o cotă de aproximativ 20 la sută, ceea ce se traduce în aproximativ opt la sută toate site-urile web. În comparație, Shopify are o cotă de piață de aproximativ cinci sau șase procente. Din nou, cifrele de utilizare nu sunt totul.
WooCommerce preia procesul de creare a unui magazin online și simplifică procesul. Poți să fii în funcțiune în câteva minute și să ai o platformă de comerț electronic robustă, puternică și extensibilă, gata de rulare.
Pentru a le tricota împreună, aveți Elementor. De asemenea, are o cotă mare de piață în domeniul său și o bază masivă de utilizatori.

Este un generator de pagini drag-and-drop cu o abordare unică pentru a vă ajuta să vă construiți întregul site de la zero. Aceasta este o soluție tentantă de utilizat, deoarece există o mulțime de caracteristici și funcționalități puternice pe care alte instrumente nu le au. Cel mai relevant aici este WooCommerce Builder dedicat.
Pe scurt, Elementor este un plugin cu o mulțime de centimetri de coloană pe blogul WPKube și ar trebui să parcurgeți arhivele noastre pentru a vedea exact ce poate face.
De ce are nevoie un site WooCommerce de la un generator de pagini
Concluzia implicită din ultima secțiune este că Elementor poate oferi amestecul potrivit de caracteristici și funcționalități de care WooCommerce are nevoie pentru a vă duce site-ul la nivelul următor. Cu toate acestea, este important să înțelegem de ce este acest lucru și ce oferă.
Într-un sens general, un site WooCommerce are nevoie de următoarele de la un generator de pagini:
- Integrare strânsă, astfel încât să nu existe conflicte între generatorul de pagini și WooCommerce.
- O mulțime de opțiuni de personalizare pentru a vă ajuta să vă scoateți în evidență produsele și paginile de magazin.
- O modalitate de a edita elementele individuale care alcătuiesc o pagină tipică de produs.
- Funcționalitate suplimentară pentru a vă ajuta la „creșterea nivelului” magazinului dvs.
Ar trebui (desigur) să rețineți și nevoile dvs. individuale. De exemplu, este posibil să descoperiți că formularele și ferestrele pop-up sunt importante pentru strategia dvs. de magazin și de vânzare. Vestea bună este că Elementor este mai mult decât capabil să vă satisfacă nevoile.
De exemplu, are un Popup Builder grozav care funcționează de minune pentru vânzări, oferte limitate în timp, cupoane și multe altele:

Le puteți crea ca și alte șabloane de pagină și le puteți aplica rapid. În plus, le poți personaliza în aproape orice mod alegi. Este perfect dacă ai o anumită campanie de promovat pe site-ul tău.
Cum să alegi o temă WooCommerce potrivită
Nu vom intra în multe detalii aici, deoarece acoperim acest lucru în tutorialul nostru și, de asemenea, vom rotunji câteva teme într-un articol dedicat.
Principala considerație de care aveți nevoie în acest caz este o temă compatibilă cu Elementor și WooCommerce. Chiar și o privire rapidă pe site-urile premium ale pieței vă va arăta că o mulțime de teme promovează acest lucru, astfel încât alegerile dvs. sunt variate.
Chiar și așa, există câteva teme remarcabile pe care le putem aminti:
- Vitrina. Va avea probabil cea mai mică compatibilitate cu Elementor în viitor, deoarece Block Editor este o tehnologie nativă. Încă,
- Buna ziua. Aceasta este tema de pornire necompletată Elementor și este ideală pentru dezvoltarea unui site WooCommerce de la zero. Desigur, dacă aveți mai puțin timp disponibil, ar putea fi înțelept să alegeți o altă temă, cu mai multe caracteristici.
- GeneratePress. Aceasta este o temă de top cu o infrastructură flexibilă. Aceasta înseamnă că, indiferent dacă utilizați Block Editor, Elementor sau altceva, magazinul dvs. va arăta uimitor.
Vă încurajăm să găsiți tema potrivită înainte de a vă concentra în crearea site-ului dvs. Amintiți-vă, cele mai bune rezultate vor fi cu ceva compatibil cu Elementor și WooCommerce.
Cum să creezi un site WooCommerce alimentat de Elementor în 3 pași
În restul acestui articol, vă vom arăta cum să utilizați Elementor și WooCommerce împreună pentru a crea un site de comerț electronic. Există trei pași de reținut:
- Instalați și configurați WooCommerce.
- Creați-vă liniile de produse WooCommerce și utilizați Elementor pentru a crea paginile de produse.
- Proiectați o pagină de magazin dedicată, folosind din nou Elementor.
Cu toate acestea, pentru acest tutorial vom presupune că aveți deja Elementor Pro instalat și activat. Este ceva prin care vă expunem în articolul nostru despre crearea unei pâlnii WordPress. Acea postare te va ajuta atunci când întâmpinați probleme.
1. Instalați WooCommerce și configurați-l
Există două aspecte de luat în considerare atunci când configurați o instalare WooCommerce: pluginul în sine și setările magazinului dvs. De fapt, instalarea pluginului durează același proces ca orice alt plugin WordPress.
În ceea ce privește configurarea WooCommerce în sine, deși puteți fi gata să începeți în câteva minute, merită să luați ceva mai mult timp pentru a parcurge Expertul de configurare.

Când vine vorba de acest punct al configurației, vă avem acoperit. De fapt, avem o postare completă tutorial WooCommerce care intră în detalii pas cu pas despre cum să începeți cu WooCommerce și să vă creați primul produs. Este o postare bună pe care o deschideți într-o filă de rezervă în timp ce treceți prin aceasta. Informațiile din interior vor fi valoroase pentru următorul set de pași.

2. Creați-vă produsele WooCommerce
Odată ce aveți o instalare WooCommerce în funcțiune, ar trebui să vă uitați la crearea de produse pe partea din spate. Din nou, tutorialul nostru WooCommerce acoperă cum să faceți acest lucru în detaliu, dar iată notele Cliff:
- Accesați fila Produse > Adăugați nou din WordPress.
- Completați numele produsului și o scurtă descriere.
- Utilizați metacasetele WooCommerce pentru a completa datele produsului, cum ar fi prețul.
- Adăugați o imagine.
- Publicați produsul dvs.
Cu toate acestea, aici este locul în care Elementor își arată prima mișcare de putere - WooCommerce Builder. Aceasta este o modalitate de a utiliza generatorul de pagini pentru a crea designul paginilor de produse.
Pentru a începe, faceți clic pe Șabloane > Adăugați nou în WordPress:

De aici, selectați Produs unic din meniul drop-down Tip șablon și introduceți un nume opțional:

Aceasta va deschide Biblioteca de șabloane pentru a afișa fiecare bloc pre-construit din:

După ce vedeți un design care vă place, faceți clic pe butonul Inserare și Elementor va importa blocul:

Aceasta este o modalitate rapidă de a crea o pagină de produs dedicată. Puteți lua acest început grozav și puteți adăuga și mai multe. Elementor include o serie de widget-uri dedicate pentru a vă ajuta să construiți pagini specifice WooCommerce:

După ce aveți un aspect de pagină care vă place, faceți clic pe butonul verde Publicare din partea de jos a ecranului:

Aceasta va afișa o fereastră pop-up care vă va ajuta să configurați o condiție specifică pentru afișarea șablonului:

Când sunteți gata, faceți clic pe Salvare și închidere . De aici, puteți adăuga mai multe produse în magazinul dvs., puteți lucra la mai multe șabloane sau puteți începe să lucrați la o pagină de magazin dedicată.
3. Proiectați-vă pagina de magazin dedicată folosind Elementor și WooCommerce
O experiență de utilizator (UX) utilă a WooCommerce este modul în care generează cele mai multe dintre paginile necesare de care aveți nevoie pentru magazinul dvs. Pagina de magazin de nivel superior este cea mai importantă, deoarece aceasta este copertina frontală care decorează ușa.
Dacă utilizați WordPress și WooCommerce cu o temă specifică WooCommerce, cum ar fi Storefront, principalul punct de plecare pentru personalizarea paginii Magazin este prin intermediul Personalizatorului. Totuși, ne concentrăm pe Elementor. Modul de a face acest lucru cu generatorul de pagini este să utilizați o pagină de arhivă de produse .
Acest lucru vă permite să personalizați modul în care produsele sunt afișate pe site-ul dvs., dar nu se ocupă de restul paginii dvs. În unele cazuri, ar putea fi dificil să gestionați două seturi de personalizări și setări, dar din experiența noastră nu a fost o problemă până acum.
Ca și în cazul produselor individuale, va trebui să mergeți la Șabloane > Adăugați nou în WordPress, apoi alegeți Arhiva de produse din meniul drop-down:

Din nou, puteți alege un bloc, puteți edita o pagină de la zero sau puteți combina ambele pentru a crea ceva unic. De asemenea, ca și înainte, puteți folosi oricare dintre widget-urile specifice WooCommerce pentru a vă ajuta să proiectați o pagină după bunul plac.
După ce faceți clic din nou pe butonul Publicare și ajungeți la dialogul Setări de publicare, puteți invoca magia. În forma sa de bază, puteți include noul șablon pe Pagina de magazin :

Cu toate acestea, asta nu este tot. Puteți adăuga condiții suplimentare Includeți pentru a utiliza șablonul în mai multe locuri de pe site-ul dvs. Acest lucru este excelent pentru continuitate și pentru a oferi vizitatorilor un motiv pentru a vă vizita magazinul.
O notă rapidă despre celelalte pagini generate de WooCommerce
Înainte de a încheia, vrem să menționăm celelalte pagini WooCommerce generate. Vestea proastă este că nu cad sub privirea lui Elementor. Cu alte cuvinte, nu puteți edita pagini precum paginile Checkout sau Mulțumiri fără o extensie WooCommerce suplimentară.
Acest lucru este dezamăgitor, dar de înțeles. Chiar și așa, puteți utiliza în continuare Elementor pentru a dezvolta elementele din jur, apoi introduceți funcționalitatea specifică a paginii cu coduri scurte. Cu toate acestea, nu este ideal.
Dacă editarea integrală a acestor pagini este importantă pentru dvs., veți dori să vă uitați la Editorul de câmpuri de checkout (49 USD pe an) și extensia Pagini personalizate de mulțumire (tot 49 USD pe an).
In concluzie
Ce ar putea merge prost atunci când folosiți trei dintre cele mai populare instrumente pentru a publica un magazin de comerț electronic? În acest caz, nu sunt prea multe. WordPress, Elementor și WooCommerce oferă toate o experiență stelară. Combinarea acestora vă poate oferi maximul în crearea și gestionarea unui magazin online.
Pe parcursul acestei postări, am analizat cum să folosim Elementor și WooCommerce împreună pentru a construi un magazin. Odată ce ați instalat și activat ambele pluginuri, prima dvs. sarcină este să creați produse împreună cu paginile asociate acestora. De acolo, aveți nevoie de o pagină de magazin dedicată - ceva pe care Elementor este capabil să se ocupe. În plus, funcționalitatea suplimentară a pluginului pentru generatorul de pagini (cum ar fi generatorul de ferestre pop-up și altele) vă poate ajuta să vă duceți magazinul în stratosferă.
Vrei să creezi o combinație Elementor și WooCommerce pentru următorul tău magazin și, dacă da, te va ajuta acest articol? Anunțați-ne în secțiunea de comentarii de mai jos!
