Ontwerp uw WooCommerce-productcategorieën met Elementor

Elementor is een uitstekende WordPress-paginabuilder om de functionaliteit van de standaard WordPress-builder te verbeteren door nieuwe functies toe te voegen.

Zoals u zich herinnert, waren de vroege versies van WordPress niet bijzonder gebruiksvriendelijk. Naast de beperkte functionaliteit moest u vertrouwen op vooraf gemaakte WordPress-thema's om een ​​basisontwerp voor uw website te maken. Voor veel gebruikers was de basisfunctionaliteit van WordPress-thema's echter onvoldoende, waardoor de installatie van plugin of het handmatig bewerken van themacode noodzakelijk was.

• Combinatie WooCommerce en Elementor
• Categoriepagina maken in Elementor
• Lay-out instellingen

Elementor is een op blokken gebaseerde bouwer vergelijkbaar met WordPress, maar is veel geavanceerder dan de WordPress-bouwer omdat deze intuïtiever, responsiever en rijker aan functies is. Het belangrijkste is dat u een fantastische website kunt maken zonder ooit een regel code te hoeven schrijven!!

Combinatie WooCommerce en Elementor

WP-WooCommerce en Elementor zijn twee van de meest gebruikte WordPress- plugin die momenteel beschikbaar zijn. De hoeveelheid flexibiliteit en het enorme aantal functies dat elk van hen biedt, is gewoonweg van onschatbare waarde. Als u een e-commerce winkel heeft, is WooCommerce de beste plugin voor vrijwel elke behoefte die u heeft. Het is de meest uitgebreide plugin die beschikbaar is voor vrijwel elke behoefte.

Bovendien is Elementor een van de meest effectieve websitebouwers met slepen en neerzetten die op de markt verkrijgbaar zijn. Het geeft u de mogelijkheid om vrijwel elke pagina op uw website snel te ontwerpen, aan te passen en in te richten. Sterker nog, er zijn functies beschikbaar, zoals het maken van megamenu's en toegang tot een breed scala aan add-ons en sjablonen die zeer handig zijn. Met de hulp van zowel WooCommerce als Elementor kunt u winkel- en bedrijfspagina's van professionele kwaliteit ontwerpen en bouwen met zo min mogelijk kosten en moeite. Met behulp van Elementor kunt u uw winkellay-outs, productrasters en carrousels volledig aanpassen en kiezen uit een verscheidenheid aan prachtige lay-outs. Ook beschikbaar is de mogelijkheid om uw afreken- en winkelwagenpagina's in te stellen en te personaliseren, en deze te integreren met een verscheidenheid aan betalingsopties en functies om uw klanten meer gemak te bieden.

Daarnaast kunt u onder andere aangepaste pagina's en ontwerpen voor digitale goederen maken, aangepaste pagina-opties opnemen voor verzending en betalingen en post- en pre-aankooppagina's. Dit alles draagt ​​ertoe bij dat de website van uw bedrijf zowel professioneel als gebruiksvriendelijk overkomt. Samen met de gebruiksvriendelijke call-to-action-knoppen, parallax-ready sliders en tal van andere functies, kunt u de WooCommerce-functionaliteit in uw website integreren. Het enorme aantal beschikbare mogelijkheden is vrijwel onbeperkt. Als u voldoende overtuigd bent, laten we u dan door het proces leiden om uw plan in praktijk te brengen. U kunt verschillende dingen doen om uw winkelpagina gastvrijer te maken, en het doel is dat deze stappen u helpen bij het creëren van een gastvrijere winkelpagina voor uw WooCommerce-winkel.

WooCommerce-categoriepagina maken in Elementor

Als u bekend bent met WooCommerce, weet u dat productcategorieën van cruciaal belang zijn bij het organiseren van uw producten voor een juiste weergave en toegang door klanten. Hoe sneller ze kunnen vinden wat ze zoeken, hoe beter. Maar wat zijn productcategorieën precies?

Klanten besteden een aanzienlijke hoeveelheid tijd aan het bekijken van uw producten op uw winkelpagina, dus ze moeten een positieve ervaring hebben. Er is niets frustrerender dan door tientallen pagina's te moeten navigeren om producten op de website van uw winkel te bekijken.

Daarom is categorisatie essentieel om uw klanten een betere winkelervaring te bieden. Klanten zullen het gemakkelijker vinden om hun voorkeuren te sorteren en eruit te filteren als er een overzichtelijke sectie is voor alle soorten artikelen, zoals kleding of schoenen. Het toevoegen van elementen voor het genereren van leads, zoals call-to-action-knoppen, aanbevolen productsecties, pop-ups voor verkopen of aanbiedingen en andere soortgelijke componenten aan deze sectie, kan deze aantrekkelijker maken voor bezoekers.

Als je een WooCommerce-winkel hebt en deze een facelift wilt geven, is deze tutorial precies wat je nodig hebt om aan de slag te gaan.

Veel WooCommerce-thema's bevatten een standaardlay-out voor productcategorieën, die wel of niet het beste bij uw zakelijke behoeften past. Hoewel deze standaardinstellingen enkele nuttige functies kunnen bevatten, kunnen ze niet vaak worden aangepast.

Laten we aan de slag gaan.
Nadat u uw product heeft ingesteld, moet u het volgende doen voordat u het publiceert, zodat het in een categorie verschijnt:

U stelt de voorwaarden in die bepalen waar uw productsjabloon tijdens deze fase zal verschijnen. Wanneer u een sjabloon gebruikt, wordt deze automatisch toegepast op alle productpagina's op uw site. U kunt uw zoekopdracht ook verfijnen tot een specifieke productcategorie.

Klik op Publiceren en uw product is nu te koop!

We zijn nog niet klaar. Wat we zojuist hebben gedaan is niet genoeg om categorieën live op onze site te krijgen; Om categorieën live te krijgen op alle of sommige pagina's van onze website, moeten we nog een paar dingen instellen.
Om de taak te voltooien, maakt u een productcataloguspagina die van invloed is op alle producten, of een cataloguspagina die van invloed is op een specifieke productcategorie. Om dit te doen, gaat u eerst terug naar Elementor > Mijn sjablonen en maakt u een productarchiefsjabloon. Kies vervolgens een bestaand sjabloon of maak een nieuw sjabloon.
Pas het uiterlijk van de Archiefproducten-widget en de Archieftitel-widget aan door ze aan uw pagina toe te voegen.

Gebruik de kopieerstijlfunctionaliteit tussen pagina's om deze aan te passen aan het ontwerp dat u al voor uw afzonderlijke productsjabloon hebt gemaakt, en sla vervolgens uw wijzigingen op. Keer terug naar de productpagina en selecteer Kopiëren in het vervolgkeuzemenu. Klik met de rechtermuisknop op Stijl plakken als u weer in het archiefproduct bent.
Kies Nieuwste producten in het vervolgkeuzemenu Query > Bronnen in de Archiefproducten-instellingen. Selecteer vervolgens ringen in het vervolgkeuzemenu Productcategorie. Op deze manier wordt alleen de ringcategorie weergegeven.
Als u een lange lijst met producten voor een bepaalde categorie heeft, moet u paginering inschakelen.
U kunt de afstand tussen de kolommen en rijen aanpassen door het tabblad Stijl te selecteren. Wijzig de kleuren, lettertypen en andere aspecten van het ontwerp.

Selecteer vóór publicatie de voorwaarden die bepalen waar het archief zal verschijnen, net zoals u deed voor de sjabloon voor één product, en publiceer vervolgens.

Zodra u op 'publiceren' heeft geklikt, is uw archiefpagina live.

Elementor pro geeft u de mogelijkheid om snel schone productcategorieën te ontwerpen met zijn arsenaal aan opties;

U kunt het volgende doen met de opties die beschikbaar zijn op Elementor Pro:

Lay-outinstellingen voor WooCommerce-productcategorieën

• Kolommen: Stel het exacte aantal kolommen in dat moet worden weergegeven, van 1 tot 12
• Aantal categorieën: Selecteer het aantal categorieën dat u wilt weergeven

Query-instellingen

• Bron: Selecteer de bron waarvan u de categorieën wilt weergeven, door te kiezen uit Alles, Handmatige selectie, Op bovenliggende categorie of Huidige subcategorieën. Als Handmatige selectie is gekozen, selecteert u handmatig welke categorieën u wilt weergeven. Als “Door ouder” is gekozen, selecteert u Alleen op het hoogste niveau of selecteert u een individuele categorie in de vervolgkeuzelijst.
• Leeg verbergen: Stel in op Ja voor categorieën waarin geen producten voorkomen
• Sorteren op: Stel de volgorde in waarin de categorieën worden weergegeven. Opties zijn onder meer Naam, Naaktslak, Beschrijving of Aantal
• Volgorde: Selecteer om categorieën weer te geven in ASC- of DESC-volgorde (oplopend of aflopend).

Stijlinstellingen

• Kolommenafstand: Stel de exacte opening tussen de kolommen in
• Rijafstand: Stel de exacte afstand tussen de rijen in
• Uitlijning: Lijn de productgegevens links, rechts of in het midden uit

Beeldinstellingen

• Randtype: Selecteer het type rand, kies uit geen, effen, dubbel, gestippeld, gestippeld of gegroefd
• Randradius: Stel de straal in om de hoekronding van de rand te bepalen
• Afstand: Pas de hoeveelheid ruimte tussen de afbeeldingen en hun gegevens aan

Titel instellingen

• Kleur: Kies de titelkleur
• Typografie: Stel de typografie-opties in voor de titeltekst

Tel instellingen

• Kleur: Kies de kleur voor de telling
• Typografie: Stel typografie-opties in voor de telling

Conclusie

De WooCommerce Builder in Elementor biedt u de ontwerpflexibiliteit die u nodig heeft om uw productpagina's visueel te maken en te verfijnen. De tijd die nodig is om van een idee naar een leven te gaan, en volledig functionele online WooCommerce winkel wordt aanzienlijk verminderd als gevolg van deze tijdsbesparing. Over het algemeen heeft het aanpassen van uw WooCommerce-winkelpagina met Elementor het potentieel om de algehele prestaties van uw website aanzienlijk te beïnvloeden. U kunt de verkoop helpen of belemmeren door uw producten op de best mogelijke manier te organiseren en weer te geven, zodat klanten ze kunnen zien en kopen. Het instellen en aanpassen van uw WooCommerce-winkelpagina in Elementor wordt gedemonstreerd via de stappen in deze handleiding. Houd er echter rekening mee dat dit slechts het topje van de ijsberg is als het gaat om de omvang van het probleem. In deze basisdemonstratie wordt een introductie gegeven over het gebruik van Elementor om de ideale winkelpagina voor uw winkel te maken. Gebruik dit als uitgangspunt en speel ermee om het meeste uit deze fantastische paginabuilder te halen