Želite li naučiti kako izraditi personaliziranu stranicu trgovine? WooCommerce s Elementorom?
Kao što možda znate, Elementor Pro dolazi sa značajkom sastavljača WooCommerce što vam omogućuje stvoriti web stranicu personalizirane e-trgovine sa WooCommerce bez kodiranja. Ova vam značajka omogućuje stvaranje prilagođenih WooCommerce stranica pomoću Elementorovog vizualnog uređivača koji nudi intuitivno sučelje.
Otkrijte također: Kako instalirati Elementor na WordPress
U vrijeme pisanja ovog članka možete stvoriti prilagođene stranice za stranicu trgovine, stranicu proizvoda i stranice arhive proizvoda (oznake i kategorije). Uskoro ćete moći stvoriti i prilagođene stranice za stranicu za naplatu i stranicu košarice.
U ovom ćemo vam članku pokazati kako stvoriti prilagođenu stranicu trgovine WooCommerce pomoću značajke graditelja WooCommerce Elementa Pro.
Sama prodajna stranica jedna je od zadanih stranica u WooCommerceu. Ova stranica služi kao izlog za prikaz vaših proizvoda. Ovoj stranici možete pristupiti odlaskom na vaša stranica.com/trgovina. Prema zadanim postavkama, stranica trgovine WooCommerce prikazuje samo proizvode WooCommerce.
Stvaranjem prilagođene stranice trgovine koristeći Elementor Pro, možete dodati elemente kako biste izlog učinili privlačnijim.
Kako stvoriti prilagođenu stranicu trgovine WooCommerce s Elementorom
Postoje najmanje dva widgeta Elementor koja možete koristiti za izradu prilagođene stranice trgovine WooCommerce: Arhivski proizvodi i Proizvodi.
U ovom primjeru koristimo ovo drugo.
Funkcija widgeta Proizvodi je prilično sličan onome u widgetu Postovi. Razlika je u tome što se widget Products koristi za prikaz proizvoda WooCommerce, dok se widget Posts koristi za prikaz postova na blogu.
Pročitajte također: Kako uvesti ili izvesti modele u Elementoru
Napominjemo da widget Proizvodi možete pronaći tek kada je dodatak WooCommerce instaliran i aktiviran.
Da biste započeli s izradom prilagođene stranice trgovine WooCommerce pomoću Elementor Pro, idite na prvo à Predlošci -> Graditelj tema na vašoj WordPress nadzornoj ploči. Kliknite karticu Proizvodi Arhiva stranice Graditelj tema, a zatim kliknite gumb dodati ARHIVA PROIZVODA.
Dajte svom modelu ime i kliknite gumb IZRADITE MODEL.
Postoje tri prilagođena predloška stranice trgovine koja možete odabrati u slučaju da želite stvoriti prilagođenu stranicu trgovine iz predloška. Ako želite izraditi prilagođenu stranicu trgovine od nule, možete jednostavno zatvoriti biblioteku predložaka.
Vidi također: Kako koristiti uzorak boja u Elementoru
U ovom ćemo primjeru izraditi prilagođenu stranicu trgovine od nule. Kao što je gore spomenuto, koristit ćemo widget Proizvodi za prikaz proizvoda.
Prije dodavanja widgeta Proizvodi u okvir za uređivanje, izgled možete definirati dodavanjem odjeljaka i stupaca. Nakon što je izgled spreman, možete jednostavno povući widget Proizvodi u okvir za uređivanje.
Kao što vidite, widget Proizvodi automatski se učitava i prikazuje najnovije WooCommerce proizvode. Upit možete izmijeniti otvaranjem bloka Upit ispod kartice Sadržaj s ploče s postavkama. Na izbor je pet mogućnosti:
- Trenutni upit - trenutni upit
- Najnoviji proizvodi - Najnoviji proizvodi
- Prodaja - rasprodaja
- Istaknuto - Istaknuto
- Ručni odabir - Ručni odabir
Također možete postaviti redoslijed prikazivanja proizvoda ili izuzeti određene
Da biste postavili broj stupaca i redaka, možete otvoriti blok Sadržaj ispod kartice Sadržaj. Iz ovog bloka također možete aktivirati obilježavanje strana.
Možete se igrati s pločom s postavkama dok ne dobijete najbolje postavke za widget Proizvodi. Kada završite s widgetom Proizvodi, na svoju stranicu možete dodati više widgeta.
Pročitajte također: Kako se koristi birač boja u Elementoru
Nakon što završite s uređivanjem stranice, možete kliknuti gumb Objavi na dnu ploče s postavkama.
Dodajte uvjet prikaza klikom na gumb dodati uvjet. Budući da želite stvoriti prilagođenu stranicu trgovine, odaberite opciju Shop Stranica. Kliknite na gumb SPREMI I ZATVORI za spremanje promjene.
Do sada ste uspješno stvorili prilagođenu stranicu trgovine WooCommerce koristeći Elementor Pro. Možete ići na vašem web mjestu.com/store za provjeru rezultata.
Prilagodite widget Proizvodi
Prije objavljivanja stranice možete prilagoditi widget Proizvodi kako biste je učinili privlačnijom. Da biste to učinili, kliknite widget u okviru za uređivanje i prijeđite na karticu Stil s ploče s postavkama. Postoje četiri bloka koja možete otvoriti na sljedeći način:
Proizvodi
Ovaj blok možete otvoriti da biste definirali razmak između stupaca i redaka. Iz ovog bloka možete postaviti i tipografiju (obitelj fontova, veličinu fonta itd.), Kao i boju teksta elemenata proizvoda kao što su naslov proizvoda, cijena proizvoda, ocjena proizvoda, proizvoda itd. Također možete postaviti obrub slike proizvoda,
- Kutija
U tom kontekstu, okvir se odnosi na spremnik svakog proizvoda. Možete otvoriti blok Kutija za definiranje širine obruba spremnika, radijusa obruba, sjena kutije, boja pozadine, boja obruba itd.
- Obilježavanje strana
Ako aktivirate opciju Obilježavanje strana iz bloka Sadržaj, možete otvoriti blok Obilježavanje strana ispod kartice Stil za prilagodbu paginacije. Možete postaviti stvari poput razmaka, boje obruba, boje pozadine itd.
Također možete definirati različite parametre za svako stanje (normalno, usmjereno i aktivno).
- Bljesak prodaje
Kada dodate novi proizvod u WooCommerce, možete postaviti atribut prodajne cijene kako biste posjetiteljima pokazali da je povezani proizvod snižen. Da biste to naglasili, atribut prodaje možete prikazati na stranici trgovine tako da proizvodi s popustom imaju značku prodaje.
Možete otvoriti blok Bljesak prodaje za prilagodbu značke prodaje. Možete definirati elemente kao što su boja teksta, boja pozadine, tipografija, radijus obruba, veličina (širina i visina), udaljenost itd.
Na kraju
WooCommerce Builder jedna je od značajki koje nudi Elementor Pro. Omogućuje vam da stvoriti web stranicu personalizirana i jedinstvena platforma za e-trgovinu s WooCommerceom i bez kodiranja. Nema potrebe za instaliranjem a WordPress tema koji tvrdi da je dizajniran za WooCommerce. Umjesto toga, možete sami izraditi prilagođene WooCommerce stranice pomoću Elementorovog vizualnog uređivača.
Pročitajte također: Kako dodati razdjelnik za stvaranje odjeljka u Elementoru
Do verzije 3.2.2, Elementor Pro omogućuje vam izradu samo stranice prilagođene trgovine, stranice pojedinačnog proizvoda i stranice arhiviranja prilagođenih proizvoda. Ali Elementor je najavio da ćete na sljedećoj verziji Elementor Pro moći stvoriti i prilagođenu stranicu košarice, prilagođenu stranicu za naplatu i prilagođenu stranicu korisničkog računa.
Nabavite Elementor Pro odmah!
Zaključak
Ovdje je ! To je to za ovaj članak koji vam pokazuje kako stvoriti prilagođenu stranicu za WooCommerce trgovinu s Elementorom. Ako imate bilo kakvih nedoumica kako doći tamo fjavite nam u Komentari.
Međutim, možete se konzultirati naši resursi, ako vam treba više elemenata za provođenje projekata kreiranja internetskih stranica, savjetujući se s našim vodičem na internetu Izrada bloga WordPress ili onaj koji je uključen Divi: najbolja WordPress tema svih vremena.
Ali u međuvremenu, ovaj članak podijelite na svojim različitim društvenim mrežama.
...
