Add To Cart Widget låter kunder lägga till produkter i sin virtuella kundvagn. Detta är en widget för en produktmall. Du kan lägga till den här widgeten för att designa din enda produktsida med ShopEngine.

Låt oss lära oss hur du kan använda Add To Cart Widget på din wooCommerce-webbplats:

Steg 1: Aktivera widgeten #

För att aktivera widgeten,

• Gå till: ShopEngine > Widgets > Add To Cart 
• Sätta på 
• Spara ändringar

Notera: Du kan också aktivera produktlager med en global inställning som slår på alla widgets i ShopEngine på samma gång.

Steg 2: Lägg till Lägg till i kundvagn Widget #

Innan du kan lägga till widgeten måste du först skapa en enstaka produktmall. Kolla in dokumentationen på hur man skapar en enstaka produktmall.

Tillägga Lägg till i kundvagn:

• Gå till ShopEngine > Templates > Single Product Page Template
• Klicka på Redigera med Elementor

• Sök för Lägg till i kundvagnen på Elements Search-alternativet
• Dra och släpp widgeten 
• Klicka på Uppdatering för att spara ändringar.

Steg 3: Inställningar för Lägg i kundvagn #

Gå till Innehåll > Inställningar för att anpassa följande alternativ:

• Antal inställningar:
  • Knappstil: You can change the button style. You can set the increase (+) and decrease (-) buttons on both sides, both left, both right or you can leave it as default.  You also have the option to choose custom Plusikon (+) och Minusikon (-).
• Stock:
  • Visa lagerstatus: Du kan visa aktiestatusen genom att aktivera det här alternativet.
• Variation:
  • Variationsbeskrivning: Aktivera det här alternativet för att visa produktvariantbeskrivningen.
• Databeställning:
  • Aktivera beställning: Aktivera det här alternativet för att anpassa positionen för Kvantitet, Lägg i kundvagn, Snabbutcheckning, önskelista och jämförelseposition. Du kan använda – värde för positionen, ju mindre värde (-5) kommer att få högre prioritet.
  • Antal Position: Du kan inte ändra detta alternativ för gruppprodukter. I så fall kommer det här alternativet alltid att vara först.

Fyll i resten av värdena enligt den ordning du vill att de ska visas och klicka på Uppdatering att spara.

Steg 4: Stilinställningar för Lägg i kundvagn #

Byt till fliken Stil för att få tillgång till alla stilalternativ.

Expandera lagerstatus och redigera följande inställningar:

• Typografi:  Du kan ändra teckensnittsfamilj, teckenstorlek, teckensnittsvikt, transformation och radhöjd för lagerstatustexten här.
• Inriktning: Du kan välja att justeringen ska vara vänster, höger eller mitten.
• I lager färg: Välj textfärg när produkten finns i lager.
• Slut i lager Färg: Välj färg på texten när produkten är slut i lager.

Bygga ut Lägg till i varukorg-knappen för att redigera följande stilalternativ:

• Typografi:  Du kan ändra teckensnittsfamilj, teckenstorlek, teckensnittsvikt, transformering och linjehöjd för Lägg till i kundvagn-knappen här.
• Normal/Hover: Ändra färg och bakgrundsfärg för både normala och svävande vyer.
• Kanttyp: du kan välja att ramtypen ska vara heldragen, prickad, dubbelstreckad eller ingen.
• Bredd: Välj den övre, vänstra, högra och nedre bredden på kanten.
• Färg: Välj en färg för kanten.
• Gränsradie: Sätt de övre, högra, nedre och vänstra värdena för radien.
• Stoppning: Justera topp-, vänster-, höger- och bottenstoppningen.
• Marginal: Ge en marginal till toppen, vänster, höger och botten om du vill.

Bygga ut Kvantitetsinmatning för att redigera följande stilalternativ:

• Typografi:  Du kan ändra teckensnittsfamilj, teckenstorlek, teckensnittsvikt, transformation och radhöjd för inmatningsalternativet för kvantitet.
• Färg: Välj en färg för kvantitetstext.
• Bakgrundsfärg: Du kan ändra bakgrundsfärgen härifrån om du önskar.
• Plus minusknapp:
  • Ikonstorlek: Svälj storleken på plus-minus-knappen.
  • Färg och bakgrund: Ändra färgen och bakgrundsfärgen för både normalvyn och svävvyn.
• Utfyllnad av knappar: Ange ett utfyllnadsvärde runt knappen.
• Ingångsutfyllnad: Ange ett utfyllnadsvärde runt inmatningsfältet.
• Kanttyp: du kan välja att ramtypen ska vara heldragen, prickad, dubbelstreckad eller ingen.
• Bredd: Välj den övre, vänstra, högra och nedre bredden på kanten.
• Färg: Välj en färg för kanten.
• Gränsradie: Sätt de övre, högra, nedre och vänstra värdena för radien.
• Omslutningsmarginal: Ange ett topp-, höger-, vänster- och bottenvärde för marginalen.

Bygga ut Variationer för att redigera följande stilalternativ:

• Inriktning: Du kan välja att justeringen ska vara vänster, höger eller mitten.
• Etikett/ Beskrivning/ Pris: Ändra flikarna och redigera typografi, färg, visningsstil för etikett, beskrivning och pris.
• Etikettbredd:  Välj etikettens bredd i pixlar här.
• Variation Artikelmarginal (px): Välj marginal mellan variantartiklar här.
• Variation Wrap Marginal: Ange topp-, vänster-, höger- och bottenvärden för variationsmarginalen.
• Variation dropdown: Välj rullgardinsmenyn här.
• Kanttyp: du kan välja att ramtypen ska vara heldragen, prickad, dubbelstreckad eller ingen.
• Bredd: Välj den övre, vänstra, högra och nedre bredden på kanten.
• Färg: Välj en färg för kanten.
• Gränsradie: Sätt de övre, högra, nedre och vänstra värdena för radien.

Bygga ut Variationsprover för att redigera följande stilalternativ relaterade till variationsrutor:

• Färg/bild/etikett: Växla till varje flik för att ställa in färgprovets bredd, höjden och ramradien för färg, bild och etikett.
• Kanttyp: kan välja att ramtypen ska vara hel, prickad, dubbelstreckad eller ingen.
• Bredd: Välj den övre, vänstra, högra och nedre bredden på kanten.
• Färg: Välj en färg för kanten.
• Vald kantfärg: Välj en kantfärg för de valda objekten.

Bygga ut önskelista för att redigera följande stilalternativ relaterade till önskelistor:

• Ikonstorlek: Välj ikonstorlek för önskelistan.
• Normal/Hover: Välj färg och bakgrundsfärg för både normalvyn och svävvyn.
• Kanttyp: kan välja att ramtypen ska vara hel, prickad, dubbelstreckad eller ingen.
• Bredd: Välj den övre, vänstra, högra och nedre bredden på kanten.
• Färg: Välj en färg för kanten.
• Gränsradie: Sätt de övre, högra, nedre och vänstra värdena för radien.
• Stoppning: Justera topp-, vänster-, höger- och bottenstoppningen.
• Marginal: Ge en marginal till toppen, vänster, höger och botten om du vill.

Klicka på Uppdatering för att spara alla ändringar du gjort.

Här är en förhandsvisning av Lägg till i kundvagn-widgeten: