Skapa en Elementor WooCommerce-produktsida

Shoppingtrender förändras i snabb takt och människor tenderar att handla online mer än någonsin.

Det är därför de behöver en e-handelsbutik ökar för att tillfredsställa shoppingvanorna online eftersom folk tycker att det är bekvämare att köpa online istället för att gå ut och handla.

Du kan också starta din e-handelsbutik direkt med hjälp av rätt verktyg och inställningar. Och du kommer att märka en drastisk ökning av din försäljning inom en rekordstor tidsperiod.

Om du har planerat att starta en e-handelsbutik och letar efter en WordPress-expert för att göra jobbet åt dig, låt mig berätta att du inte behöver någon.

Ja! Du kan göra det själv eftersom du inte behöver vara WordPress-utvecklare eller kodningsexpert och du kan göra det utan att ha någon kunskap om kodning med rätt verktyg och inställningar.

Följ bara steg-för-steg-handledningen för att skapa en WooCommerce-butikssida med Elementor sidbyggare.

Låt oss gräva djupare för att komma till saken!

Vad behöver du för att skapa en produktsida med Elementor?

Installera WooCommerce- plugin på din WordPress-webbplats från WordPress.org-förrådet och utöver det måste du installera Elementor- sidbyggaren . Gratisversionen kan laddas ner från WordPress.org men gratisversionen kommer med ett begränsat anpassningsalternativ. Därför, om du gillar att få obegränsade anpassningsalternativ, gå till pro Elementor och ladda ner den från den officiella Elementor.org.

Hur installerar man Elementors sidbyggare?

  • För Elementor gratisversion:

Gå till Plugin > Lägg till ny > gå in i Elementor sidbyggare > klicka på installera och aktivera.

  • För Elementor Pro:

Köp Pro-versionen från Elementor.com och ladda sedan upp zip-filen och klicka sedan på installera och aktivera.

Skapa en Elementor WooCommerce-produktsida steg för steg

Den vanliga WooCommerce-produktsidan ser ut som vilken grundläggande WooCommerce-produktsida som helst utan någon skarphet.

Men om du vill lägga till ditt varumärkes röst måste du anpassa den unikt.

Steg 1: Gå till avsnittet Mall från din Dashboard-meny och klicka på "Lägg till ny".

Välj nu objektet "Enstaka produkt" från rullgardinsmenyn

Det bästa är att Elementor levereras med några förgjorda produktsidemallar, så om du vill börja snabbt, välj vem som helst från alternativen som ser närmast din önskade.

Det är mycket lättare att skapa en produktsida från den färdiga mallen än att skapa från grunden. Ändra därför en befintlig mall och spara tid och ansträngning.

Vi har valt denna mall för vår produktsida.

När du har valt din favoritmall leder den dig till Elementor-redigeraren där du kan anpassa mallen efter din smak.

Här kan du se olika block på vänstermenyn. Dra och släpp blocket du gillar att arbeta med.

Klicka på knappen "+" Lägg till och välj vilken kolumnstorlek du vill lägga till.

Vi har valt två kolumnstorlekar för vår produktmall.

Lägg nu till en produkttitelwidget i den högra kolumnen och lägg till titeln på din produkt på den.

När du har lagt till produkttiteln är nästa steg att lägga till "Woo-brödsmulorna" ovanför den.

Lägg nu till produktbilden i den vänstra kolumnen och dra och släpp produktbildswidgeten från den vänstra kolumnen.

Du kan lägga till stoppningen i båda kolumnerna för att hålla dem något isär från varandra.

Efter att ha lagt till bilden och justerat stoppningen enligt de nödvändiga måtten, lägg till produktbetygswidgeten under produkttiteln.

Lägg till en kort beskrivning av produktwidgeten under produktrecensionsblocket. du kan också justera utrymmet mellan de två blocken.

När du är klar med produktbeskrivningen och alla detaljer är vårt nästa steg att lägga till priset på produkten och för detta måste du dra och släppa priswidgeten under produktbeskrivningen.

Efter att ha lagt till prisfliken under produktbeskrivningen kan du anpassa priswidgeten genom att välja alternativen i menyn till vänster. Du kan förstora ikonen, ändra teckensnittsstilen och även teckensnittsfärgen från svart till valfri annan färg.

Lägg nu till widgeten "lägg till i kundvagnen" och anpassa dess färg, typsnitt eller stil från menyn om du vill.

Lägg nu till produktmeta under priswidgeten som visar produktkategorin och produktens serienummer.

Steg 2: lägg till ytterligare information om produkten i nästa avsnitt.

Skapa ett nytt avsnitt med två kolumner och lägg sedan till produktdataflikar inklusive beskrivning, ytterligare information och recensioner. Och på höger sida av kolumnen lägg till relaterad produktsektion.

För att behålla samma format för varje kolumn kan du klicka på det vänstra hörnet av varje kolumn och kopiera och klistra in kolumnformatet för varje kolumn.

Steg 3: lägg till ytterligare en sektion eller lägg till "merförsäljningssektion".

Så här kommer din merförsäljningssektion att se ut efter tillägg. Lägg till lite stoppning för att anpassa sektionen.

Och slutligen är du klar med designen av din produktsida. Nu är det sista steget var du vill publicera din produkt? du kan klicka på publicera eller gå till ögonsektionen i det nedre hörnet av den vänstra menyn och klicka på inställningarna för att välja kategori för produkten.

Klicka på menyn Lägg till villkor och välj sedan kategorin för din produkt och klicka på publicera.

Mobiloptimera din WooCommerce-produktsida

Eftersom mycket trafik kommer att komma via smartphones så måste du optimera din butik för smartphone-visning, annars kan du förlora din försäljning.

Även om WooCommerce redan är mobiloptimerad, men följ proceduren för att försäkra dig om att dina produktsidemallar ser absolut bra ut på mobilskärmen.

Du hittar ett alternativ Responsive Mode i det nedre vänstra hörnet av Elementor-gränssnittet.

När du klickar på alternativet Mobilt responsivt kan du växla mellan alternativ för mobil, skrivbord och flikvisning.

Klicka på något av alternativen du vill se och justera designen om du hittar någon komplikation.

Spara nu och fortsätt att publicera din produktsida.

Elementor Pro-priser

Elementor basversion är tillgänglig gratis medan proversionen kommer med tre licenser. Om du letar efter din personliga blogg eller en enskild webbplats är den personliga licensen mest lämplig för dig där du kan få en WooCommerce-byggare tillsammans med 90+ pro-widgets.

Medan plus- och expertlicenserna är lämpliga för vuxna företag eller byråer med stöd för 3 respektive 1 000 webbplatser.

Avslutar

Det enda syftet med Elementor sidbyggare är att göra det möjligt för användarna att släppa loss sin kreativitet utan att förlita sig på kodningen. Elementor kommer med en mängd olika widgets som låter dig skapa alla slags produktsidor baserade på attraktiva layouter. De grundläggande WooCommerce-elementen är fler än 10 som gör det möjligt för användarna att anpassa varje krök och kurva på butikssidan. Och om du inte hittar ditt önskade element i Elementor-menyn, oroa dig inte! Det finns många andra avancerade inställningar som kan uppgradera din arsenal och lägga till flera element till ditt bibliotek. En av dem är Essential Add-ons som kommer med dedikerade element endast för WooCommerce.

Lämna en kommentar

Din e-postadress kommer inte att publiceras. Behövliga fält är markerade *