Design dine WooCommerce -produktkategorier med Elementor

Elementor er en enestående WordPress -sidebygger for å forbedre standardfunksjonen for WordPress -byggherre ved å legge til nye funksjoner.

Hvis du husker, var de tidlige versjonene av WordPress ikke spesielt brukervennlige. I tillegg til å ha begrenset funksjonalitet, krevde det deg å stole på ferdiglagde WordPress-temaer for å lage et grunnleggende design for nettstedet ditt. For mange brukere var imidlertid den grunnleggende funksjonaliteten til WordPress -temaer utilstrekkelig, noe som nødvendiggjorde installasjon av plugin eller manuell redigering av temakode.

Elementor er en blokkbasert byggherre som ligner på WordPress, men den er mye mer avansert enn WordPress-byggherren ved at den er mer intuitiv, lydhør og funksjonsrik. Viktigst av alt, du kan lage et fantastisk nettsted uten å måtte skrive en kodelinje !!

WooCommerce og Elementor kombinasjon

WP-WooCommerce og Elementor er to av de mest brukte WordPress- plugin er tilgjengelige i dag. Mengden fleksibilitet og det store antallet funksjoner som hver av dem tilbyr er ganske enkelt uvurderlig. Hvis du kjører en eCommerce butikken, er WooCommerce den beste plugin for nesten ethvert behov du måtte ha. Det er den mest omfattende plugin tilgjengelig for praktisk talt ethvert behov.

I tillegg er Elementor en av de mest effektive dra-og-slipp-nettstedbyggerne som er tilgjengelige på markedet. Det gir deg muligheten til raskt å designe, tilpasse og levere nesten hvilken som helst side på nettstedet ditt. Enda flere funksjoner er tilgjengelige, for eksempel å lage megamenyer og få tilgang til et stort utvalg av tillegg og maler som er veldig praktiske. Ved hjelp av både WooCommerce og Elementor kan du designe og bygge butikk- og forretningssider av profesjonell kvalitet med minst mulig kostnad og innsats. Ved hjelp av Elementor kan du tilpasse butikkoppsettene, produktnettene og karusellene helt, samt velge mellom en rekke flotte oppsett. Muligheten til å sette opp og tilpasse kassen og handlevognene dine, samt å integrere dem med en rekke betalingsalternativer og funksjoner, er også tilgjengelig for å gi kundene større bekvemmelighet.

I tillegg kan du opprette egendefinerte sider og design for digitale varer, inkludere tilpassede sidealternativer for frakt og betalinger og legge ut og forhåndskjøpe sider, blant annet. Alt dette bidrar til at bedriftens nettsted ser ut som både profesjonelt og brukervennlig. Sammen med de brukervennlige handlingsfremmende knappene, parallaksklare glidebrytere og en rekke andre funksjoner, kan du integrere WooCommerce-funksjonalitet på nettstedet ditt. Det store antallet muligheter som er tilgjengelig er praktisk talt ubegrenset. Hvis du er overbevist nok, la oss lede deg gjennom prosessen med å sette planen din i verk. Du kan gjøre en rekke ting for å gjøre butiksiden din mer innbydende, og målet er at disse trinnene skal hjelpe deg med å lage en mer innbydende butikside for din WooCommerce -butikk.

Opprette WooCommerce kategoriside i Elementor

Hvis du er kjent med WooCommerce, vet du at produktkategorier er avgjørende for å organisere produktene dine for riktig visning og tilgang for kunder - jo raskere de kan finne det de leter etter, jo bedre. Men hva er egentlig produktkategorier?

Kunder bruker mye tid på å bla gjennom produktene dine på butikksiden din, så de må ha en positiv opplevelse. Det er ingenting mer frustrerende enn å måtte navigere gjennom dusinvis av sider for å se på produktene på butikkens nettsted.

Som et resultat er kategorisering avgjørende for å gi kundene en bedre handleopplevelse. Kunder vil finne det lettere å sortere og filtrere ut preferansene sine hvis det er en velordnet og organisert seksjon for alle typer varer som klær eller sko. Hvis du legger til blygenereringselementer som oppfordringsknapper, utvalgte produktseksjoner, forgrunnsvinduer for salg eller tilbud og andre lignende komponenter i denne delen, kan det gjøre det mer attraktivt for besøkende.

Hvis du har en WooCommerce -butikk og ønsker å gi den en ansiktsløftning, er denne opplæringen akkurat det du trenger for å komme i gang.

Mange WooCommerce -temaer inkluderer et standardoppsett for produktkategorier, som kanskje ikke passer best for dine forretningsbehov. Selv om disse standardene kan bestå av noen nyttige funksjoner, kan de ikke ofte tilpasses.

La oss komme i gang.
Etter å ha satt opp produktet ditt, må du gjøre følgende før du publiserer, slik at det vises i en kategori:

Du vil angi vilkårene som skal avgjøre hvor produktmalen din skal vises i dette stadiet. Når du bruker en mal, gjelder den automatisk for alle produktsidene på nettstedet ditt. Du kan også begrense søket til en bestemt produktkategori.

Klikk på Publiser, og ditt eneste produkt er nå tilgjengelig for kjøp!

Vi er ikke ferdige ennå.
Det vi nettopp har gjort er ikke nok til å få kategorier live på siden vår; for å få kategorier live på alle eller noen sider av nettstedet vårt, må vi fortsatt sette opp noen få ting. For å fullføre oppgaven, opprette en produktkatalogside som vil påvirke alle produkter eller en katalogside som vil påvirke en bestemt produktkategori.
For å gjøre dette, gå først tilbake til Elementor > Mine maler og lag en produktarkivmal. Velg deretter en eksisterende mal eller lag en ny. Tilpass utseendet til widgeten Arkivprodukter og arkivtittel ved å legge dem til på siden din.

Bruk kopistilfunksjonaliteten mellom sider for å tilpasse den til å matche designet du allerede har laget for enkeltproduktmalen, og lagre deretter endringene.
Gå tilbake til produktsiden og velg Kopier fra rullegardinmenyen. Høyreklikk Lim inn stil når du er tilbake i arkivproduktet. Velg Siste produkter fra rullegardinmenyen Spørring > Kilder i innstillingene for arkivprodukter.
Velg deretter ringer fra rullegardinmenyen Produktkategori. Bare ringekategorien vil vises på denne måten. Hvis du har en lang liste med produkter for en bestemt kategori, bør du slå på paginering.
Du kan tilpasse avstanden mellom kolonnene og radene ved å velge stilfanen. Endre farger, fonter og andre aspekter av designet.

Forhåndspublisering, velg betingelsene som bestemmer hvor arkivet skal vises, akkurat som du gjorde for den ene produktmalen, og publiser deretter.

Når du har trykket på "publiser", vil arkivsiden din være aktiv.

Elementor pro gir deg muligheten til å designe kinkige, rene produktkategorier med sine mange alternativer;

Du kan utføre følgende med alternativene som er tilgjengelige på Elementor Pro:

Layoutinnstillinger for WooCommerce -produktkategorier

  • Kolonner: Angi det eksakte antallet kolonner som skal vises, fra 1 til 12
  • Kategorier teller: Velg antall kategorier som skal vises

Spørringsinnstillinger

  • Kilde: Velg kilden du vil vise kategorier fra, og velg fra Alle, Manuelt valg, Av overordnet eller Gjeldende underkategorier. Hvis Manuelt valg er valgt, velger du manuelt hvilke kategorier som skal vises. Hvis "By Parent" er valgt, velg fra Bare toppnivå, eller velg en individuell kategori fra rullegardinlisten.
  • Skjul tomt: Sett til Ja for kategorier uten produkter i dem
  • Bestill etter: Angi rekkefølgen som kategoriene skal vises i. Alternativene inkluderer Navn, Slug, Beskrivelse eller Antall
  • Ordre: Velg for å vise kategorier i ASC eller DESC (stigende eller synkende) rekkefølge

Stilinnstillinger

  • Kolonnemellom: Angi det nøyaktige gapet mellom kolonnene
  • Radeavstand: Angi det nøyaktige gapet mellom radene
  • Justering: Juster produktdataene til venstre, høyre eller senter

Bildeinnstillinger

  • Kanttype: Velg type kant, velg blant ingen, solid, dobbel, stiplet, stiplet eller rillet
  • Border Radius: Angi radius for å kontrollere hjørnens rundhet på grensen
  • Avstand: Juster mengden plass mellom bildene og dataene deres

Tittelinnstillinger

  • Farge: Velg tittelfargen
  • Typografi: Angi typografialternativer for tittelteksten

Telle innstillinger

  • Farge: Velg fargen for tellingen
  • Typografi: Angi typografialternativer for tellingen

Konklusjon

WooCommerce Builder i Elementor gir deg designfleksibiliteten du trenger for å lage og finjustere produktsidene dine visuelt. Tiden det tar å gå fra en idé til en live , og fullt ut funksjonell online WooCommerce -butikk reduseres betydelig som følge av at du sparer tid. Samlet sett kan det å tilpasse WooCommerce -butikksiden din med Elementor potensielt påvirke nettstedets generelle ytelse betydelig. Du kan enten hjelpe eller hindre salg ved å organisere og vise produktene dine på best mulig måte for kundene å se og kjøpe dem. Oppsett og tilpasning av WooCommerce -butikksiden i Elementor vil bli demonstrert gjennom trinnene i denne veiledningen. Husk imidlertid at dette bare er toppen av isfjellet når det gjelder omfanget av problemet. En introduksjon til hvordan du bruker Elementor til å lage den ideelle butikksiden for butikken din, er demonstrert i denne grunnleggende demonstrasjonen. Bruk dette som utgangspunkt og lek med det for å få mest mulig ut av denne fantastiske sidebyggeren

19 tanker om “Design WooCommerce-produktkategoriene dine med Elementor”

    1. Hei, du må sørge for at Elementor -temabetingelsene er konfigurert for å lastes inn i WooCommerce -kategorier

    1. Hei, nei, jeg er ikke overbevist om at det er mulig, du kan muligens randomisere kategoriene, men ikke bildene.

    1. Hei, for den gratis Elementor-versjonen må du bruke WooCommerce-widgeten eller installere en annen plugin som gjør jobben.

  1. Hei!

    Vet du om man kan redigere kategoribeskrivelsen med Elementor? Kan du legge til et ekstra tekstfelt under kategorien og SEO-hensikten? Tenk om det er verdt å kjøpe Pro-versjoner

    1. Hei, ja, du kan legge til en beskrivelse til WooCommerce-kategorien med pro-versjonen, da det kreves for å bruke WooCommerce-kategorioppsettet.

  2. Herzlichen Dank for den super Beitrag. Wie kann ich eigentlich die Anzahl der Produkte in reiner Reihe ändern? Insbesondere für die responsive bzw. Mobil Anzeige. Wir möchten for Desktop 4 Produkte in einer Reihe and für Mobile nur 1 pro Reihe.

    1. Hvis det bare er en spesifikk mobilkonfigurasjon, kan du gjøre det fra Elementor-widgeten. Hvis du vil ha noe helt annet på mobil, kan du lage 2 widgets, en for datamaskin og en for mobil. Valget av mobilenhet er i avansert-fanen.

Legg igjen en kommentar

E-postadressen din vil ikke offentliggjøres. Obligatoriske felt er merket med *