Opret en Elementor WooCommerce-produktside

Shoppingtendenser ændrer sig i et hurtigt tempo, og folk har en tendens til at købe online mere end nogensinde.

Det er derfor, de har brug for en e-handelsbutik for at tilfredsstille online shoppingvaner, fordi folk finder det mere bekvemt at købe online frem for at gå ud for at shoppe.

Du kan også starte din e-handelsbutik med det samme ved at bruge de rigtige værktøjer og opsætning. Og du vil bemærke en drastisk stigning i dit salg inden for en rekordstor periode.

Hvis du har planlagt at starte en e-handelsbutik og leder efter en WordPress-ekspert til at udføre jobbet for dig, så lad mig fortælle dig, at du ikke har brug for nogen.

Ja! Du kan gøre det selv, fordi du ikke behøver at være WordPress-udvikler eller kodeekspert, og du kan gøre det uden at have kendskab til kodning med de rigtige værktøjer og opsætning.

Bare følg trin-for-trin-vejledningen til at oprette en WooCommerce-butiksside ved hjælp af Elementor-sidebyggeren.

Lad os grave dybere ud for at komme til sagen!

Hvad skal du bruge for at oprette en produktside ved hjælp af Elementor?

Installer WooCommerce- plugin på dit WordPress-websted fra WordPress.org-lageret, og oven i købet skal du installere Elementor-sidebyggeren . Den gratis version kan downloades fra WordPress.org, men den gratis version kommer med begrænsede tilpasningsmuligheder. Derfor, hvis du kan lide at få ubegrænsede tilpasningsmuligheder, så gå efter pro Elementor og download den fra den officielle Elementor.org.

Hvordan installerer jeg Elementor-sidebyggeren?

  • For Elementor gratis version:

Gå til Plugin > Tilføj nyt > indtast Elementor sidebygger > klik på installer og aktiver.

  • Til Elementor Pro:

Køb Pro-versionen fra Elementor.com og upload derefter zip-filen og klik derefter på installer og aktiver.

Opret en Elementor WooCommerce-produktside trin for trin

Standard WooCommerce-produktsiden ligner enhver grundlæggende WooCommerce-produktside uden nogen sprødhed.

Men hvis du kan lide at tilføje dit brands stemme, skal du tilpasse det unikt.

Trin 1: Gå til skabelonsektionen fra din Dashboard-menu og klik på "Tilføj ny".

Vælg nu punktet "Enkelt produkt" fra rullemenuen

Det bedste er, at Elementor kommer med nogle præfabrikerede produktsideskabeloner, så hvis du kan lide at komme hurtigt i gang, skal du vælge enhver fra de muligheder, der ser tættest på din ønskede.

Det er meget nemmere at oprette en produktside fra den færdiglavede skabelon i stedet for at oprette fra bunden. Rediger derfor enhver eksisterende skabelon og spar tid og kræfter.

Vi har valgt denne skabelon til vores produktside.

Når du har valgt din yndlingsskabelon, fører den dig til Elementor-editoren, hvor du kan tilpasse skabelonen efter din smag.

Her kan du se forskellige blokke i menuen til venstre. Træk og slip den blok, du kan lide at arbejde med.

Klik på knappen "+" Tilføj og vælg hvilken kolonnestørrelse du vil tilføje.

Vi har valgt to kolonnestørrelser til vores produktskabelon.

Tilføj nu en produkttitelwidget i højre kolonne og tilføj titlen på dit produkt på den.

Når du har tilføjet produkttitlen, er næste trin at tilføje "Woo brødkrummer" over det.

Tilføj nu produktbilledet i venstre kolonne og træk og slip produktbilledet fra venstre kolonne.

Du kan tilføje polstringen til begge kolonner for at holde dem lidt adskilt fra hinanden.

Når du har tilføjet billedet og justeret polstringen i henhold til de nødvendige dimensioner, skal du tilføje produktbedømmelseswidgetten under produkttitlen.

Tilføj en kort beskrivelse af produktwidgeten under produktanmeldelsesblokken. du kan også justere mellemrummet mellem de to blokke.

Når du er færdig med produktbeskrivelsen og alle detaljer, er vores næste trin at tilføje prisen på produktet, og for dette bliver du nødt til at trække og slippe priswidgetten under produktbeskrivelsen.

Når du har tilføjet prisfanen under produktbeskrivelsen, kan du tilpasse priswidgetten ved at vælge mulighederne i menuen til venstre. Du kan forstørre ikonet, ændre skrifttypestilen og også skriftfarven fra sort til enhver anden farve efter eget valg.

Tilføj nu widgetten "tilføj til kurven" og tilpas dens farve, skrifttype eller stil fra menuen, hvis du vil.

Tilføj nu produktmeta under priswidgetten, der viser produktkategorien og produktets serienummer.

Trin 2: Tilføj yderligere oplysninger om produktet i næste afsnit.

Opret en ny sektion med to kolonner, og tilføj derefter produktdatafaner inklusive beskrivelse, yderligere information og anmeldelser. Og tilføj relateret produktsektion til højre i kolonnen.

For at beholde det samme format for hver kolonne kan du klikke i venstre hjørne af hver kolonne og kopiere og indsætte kolonneformatet for hver kolonne.

Trin 3: Tilføj endnu en sektion, eller tilføj "mersalgssektion".

Sådan vil du op-sælgesektion se ud efter tilføjelse. Tilføj noget polstring for at justere sektionen.

Og endelig er du færdig med at designe din produktside. Nu er det sidste trin, hvor du vil udgive dit produkt? du kan klikke på udgiv eller gå til øjenafsnittet i nederste hjørne af venstre menu og klikke på indstillingerne for at vælge produktets kategori.

Klik på menuen Tilføj betingelse og vælg derefter kategorien for dit produkt, og klik på udgiv.

Mobil optimer din WooCommerce produktside

Da der kommer en masse trafik gennem smartphones, så bliver du nødt til at optimere din butik til smartphone-visning, ellers kan du miste dit salg.

Selvom WooCommerce allerede er mobiloptimeret, skal du alligevel følge proceduren, hvis dine produktsideskabeloner ser absolut godt ud på mobilskærmen.

Du finder en mulighed Responsive Mode i nederste venstre hjørne af Elementor-grænsefladen.

Når du klikker på den mobile responsive indstilling, kan du skifte mellem mulighederne for mobil, desktop og fanevisning.

Klik på en af ​​de muligheder, du kan lide at se, og juster designet, hvis du finder nogen komplikation.

Gem nu og fortsæt med at udgive din produktside.

Elementor Pro-priser

Elementor grundlæggende version er tilgængelig gratis, mens pro-versionen kommer med tre licenser. Hvis du leder efter din personlige blog eller et enkelt websted, er den personlige licens bedst egnet til dig, hvor du kan få en WooCommerce-bygger sammen med 90+ pro-widgets.

Mens plus- og ekspertlicenserne er velegnede til voksne virksomheder eller bureauer med en support på henholdsvis 3 websteder og 1000 websteder.

Afslutter

Det eneste formål med Elementor sidebygger er at gøre det muligt for brugerne at slippe deres kreativitet løs uden at stole på kodningen. Elementor kommer med en række widgets, der lader dig oprette enhver form for produktsider baseret på attraktive layouts. De grundlæggende WooCommerce-elementer er mere end 10, der gør det muligt for brugerne at tilpasse hver kink og kurve på butikssiden. Og hvis du ikke finder dit ønskede element i Elementor-menuen, så fortvivl ikke! Der er mange andre avancerede indstillinger, der kan opgradere dit arsenal og tilføje flere elementer til dit bibliotek. En af dem er Essential Add-ons , der kun kommer med dedikerede elementer til WooCommerce.

Holderkhu

live:.cid.e495888558d5265f

Seneste indlæg

Sådan bruger du sidehoveder og sidefødder med Elementor

Et websteds sidehoveder og sidefødder er væsentlige elementer. I de fleste tilfælde giver overskriften navigation...

6. januar 2022

WordPress-temasammenligning: Astra vs OceanWP

To af de mest populære WordPress-temaer på markedet er Astra og OceanWP. Professionel…

2. januar 2022

WordPress nyhedstema sammenligning: Avis vs. Astra

Oprettelse af et fremragende nyhedswebsted kræver ikke, at du bliver webdesigner. Vi…

25. oktober 2021

Opret en nyhedsrelateret hjemmeside med Newspaper Theme

Avis-temaet er et af de mest betydningsfulde WordPress-temaer designet af tagDiv, en...

18. oktober 2021

Sådan bygger du en e-handel med Avada WooCommerce builder

Når det kommer til at oprette en online butik, er WooCommerce det perfekte plugin . Det…

4. oktober 2021

Sådan bruger du sticky header og rulleeffekter med Elementor

En header er generelt det første, en person ser, når de besøger dit websted,...

21. september 2021