5 eenvoudige manieren om producten weer te geven in een WordPress online shop

Het weergeven van producten in een WordPress-onlinewinkel kan echt een nachtmerrie zijn voor een e-commerce-nieuweling. Toen ik begon met het bouwen van mijn online winkel, dacht ik dat het een goed idee zou zijn om mijn items op de homepage van mijn website te plaatsen. Maar de hele taak was een behoorlijk zware strijd!

Volgens mijn eigen ervaring kan het veel tijd kosten om producten op uw website te laten verschijnen, vooral als u nieuw bent bij e-commerce. Ik kwam erachter dat het een taak is die enige goede kennis van WordPress vereist.

Weergegeven producten in een online winkel

Door Jan Saints (Eigen werk): CC-BY-2.0

Als u voor het eerst een WordPress-webwinkel maakt, moet u zeker leren hoe u een algemene website opzet met dit contentmanagementsysteem. U moet ook vertrouwd raken met zaken als e-commerce plug-ins, widgets en shortcodes. Als u WooCommerce gebruikt, moet u bovendien op de hoogte zijn van de beschikbare productweergave-opties en de algemene instellingen van de plug-in begrijpen. Deze eenvoudige gids over het maken van een online winkel en het weergeven van items (door Riccardo Andronaco) legt dit allemaal uit en ik vond het erg nuttig.

In dit artikel ga ik vijf manieren bespreken om producten weer te geven en te ordenen op een WordPress eCommerce-website. Lees verder om te leren hoe u items op uw webpagina's kunt laten verschijnen en hoe u ze dienovereenkomstig kunt rangschikken.

Vijf manieren om items in een WordPress Online Shop weer te geven en te rangschikken

1. De automatische methode
2. Widgets
3. Plug-ins
4. Shortcodes
5. Schuifregelaars

1. De automatische methode gebruiken

Zoals de naam al doet vermoeden, hoeft u niets te doen om de producten op de winkelpagina te laten verschijnen. De items worden weergegeven terwijl u ze toevoegt vanaf het dashboard. Ze worden automatisch in alfabetische volgorde of willekeurig met of zonder categorieën gerangschikt, afhankelijk van uw WooCommerce-weergave-instellingen.

De homepagina kan slechts een bepaald aantal producten herbergen, wat betekent dat als u een groot aantal producten heeft, sommige op de pagina's 2, 3, 4 enzovoort worden geplaatst.

Deze methode maakt het voor uw klanten moeilijk om alle soorten producten in uw winkel te kennen, aangezien deze geen categorieën bevat en sommige items op andere pagina's verborgen zijn.

Mogelijk moet u deze methode vermijden als u een aantal betere methoden (hieronder beschreven) kunt gebruiken om items weer te geven. Maar als u een aantal items heeft die op één pagina passen, dwz de homepage, dan kunt u deze methode toepassen.

Producten worden willekeurig weergegeven

Door Jan Saints (Eigen werk): CC-BY-2.0

2. Widgets gebruiken

Zoals u wellicht weet, is een widget in WordPress een klein blok met inhoud dat in de zijbalk- en voettekstsecties kan worden geplaatst. Het biedt een eenvoudige en gemakkelijke manier om een ​​website aan te passen. Enkele veelgebruikte widgets zijn: recente berichten, zoekvak, categorieën en voettekstmenu.

In een eCommerce-website kunnen widgets worden gebruikt om productcategorieën in de zijbalk of voettekst weer te geven. Ze kunnen daarom een ​​geweldige manier zijn om de automatische methode (hierboven besproken) te stimuleren die geen productcategorieën bevat.

Enkele geweldige widgets die bij eCommerce WordPress-thema's worden geleverd, zijn populaire producten, recente producten, best verkochte producten, best beoordeelde producten en aanbevolen producten. Deze widgets kunnen worden aangepast, wat betekent dat u ze kunt hernoemen met de daadwerkelijke categorieën van uw items. U kunt ze ook slepen en neerzetten om een ​​arrangement te krijgen dat bij uw stijl past.

Omdat widgets alleen producten in de zijbalken en voetteksten kunnen weergeven, vinden de meeste eigenaren van online winkels ze ongewenst. De beste plaats om items weer te geven is in de hoofdbalk van een pagina, iets wat niet kan worden bereikt met widgets.

Producten die op een zijbalk worden weergegeven met behulp van een plug-in

Door Jan Saints (Eigen werk): CC-BY-2.0

3. Plug-ins gebruiken

In WordPress is een plug-in een set programma's die een groep functies, features of services bevat. In dit contentmanagementsysteem zijn er tienduizenden plug-ins (zowel gratis als premium) die geschikt zijn voor een breed scala aan behoeften. Er zijn plug-ins voor alle soorten websites, er zijn bijvoorbeeld plug-ins voor eCommerce (zoals WooCommerce), directories, blogs, wederverkoop- en boekingsplatforms.

Als het gaat om het weergeven en rangschikken van items in een online winkel, zijn er een groot aantal plug-ins die u kunt gebruiken om deze taak uit te voeren. Maar de meeste plug-ins zijn niet helemaal effectief, dus u moet de plug-ins gebruiken waarvan is bewezen dat ze werken.

De meest aanbevolen plug-ins voor het weergeven van items in een WordPress-onlinewinkel zijn Ultimate Product Catalog en WooCommerce Productsortering en weergave.

De plug-in voor sorteren en weergeven werkt beter met een andere plug-in genaamd Endless Scroll waarmee je een groot aantal items op je winkelpagina kunt weergeven. Na het installeren en activeren van de twee plug-ins, moet u naar de productcategorieën gaan en de categorieën slepen en neerzetten om de juiste weergave te krijgen. U kunt vervolgens het aantal producten instellen dat per categorie moet worden weergegeven met links om ze allemaal te bekijken.

Wat betreft het sorteren, de plug-in wordt standaard geleverd met sorteren en sorteren op populariteit, nieuwheid, prijs (laag naar hoog en vice versa), te koop en uitgelicht. Sommige van deze functies worden geleverd met de premiumversie van de plug-in, dus het wordt aanbevolen om deze versie te gebruiken.

De andere plug-in, Ultimate Product Catalog, is een beetje ingewikkeld. Nadat u de plug-in hebt geïnstalleerd en geactiveerd, moet u al uw producten en categorieën eraan toevoegen om ID's te krijgen die u in shortcodes kunt gebruiken om uw items weer te geven. U moet ook enkele kleine catalogi voor uw items maken.

De volgende shortcode toont bijvoorbeeld producten in de catalogus met ID "x".

of

De plug-in zit boordevol functies zoals aanpasbare cataloguslay-outs, verkoopprijzen, productimport, valutasymbool, broodkruimels, delen op sociale media, productrecensies en beoordelingen, SEO door Yoast-integratie en een groot aantal instellingsopties.

De productcatalogusstijlen die in de plug-in zijn opgenomen, zijn onder meer: ​​minimalistisch, blok, hover en tabbladen. Sommige van deze stijlen, en ook enkele van de hierboven beschreven functies, zijn beschikbaar met de premiumversie van de plug-in.

Producten weergegeven in een blokstijl met behulp van een plug-in

Door Jan Saints (Eigen werk): CC-BY-2.0

4. Gebruik van shortcodes

Als u WooCommerce voor uw online winkel gebruikt, kunt u shortcodes vinden als de eenvoudigste manier om producten op uw winkelpagina weer te geven. De shortcodes werken met product- en categorie-ID's en SKU's en kunnen gewoon worden gekopieerd en geplakt op de winkelpagina om items weer te geven. Zie de shortcodes hieronder.

- toont categorielijst.

- toont een specifiek aantal categorieën, en het werkt goed met de volgende argumenten. Opmerking: deze argumenten kunnen ook werken met deze shortcode.

• number = "null" - om het aantal categorieën weer te geven.
• orderby = "name" - om categorieën te tonen wanneer ze op naam zijn gerangschikt. Opmerking: de waarde "naam" kan worden vervangen door datum, rand (willekeurig), gewijzigd en geen.
• order = "asc" - om categorieën weer te geven in oplopende volgorde. Opmerking: de waarde "asc" kan worden vervangen door "desc" om in aflopende volgorde te sorteren.
• columns = "x" - om "x" kolommen van een categorie weer te geven.
• hide_empty = "1" - om categorieën te verbergen.
• hide_empty = "0" - om categorieën te tonen.
• parent = "0" - om categorieën op het hoogste niveau weer te geven.
• ids = "x" - om categorie met id "x" te tonen.
• category = "x" - om categorie "x" te tonen.

• categories_limit - om een ​​beperkt aantal categorieën weer te geven.
• archive_template - om een ​​specifiek archiefsjabloon voor een bepaalde vermelding te tonen.
• design_scheme - om een ​​specifieke kleur of maat weer te geven.
• sort = "0" - om de productsorteerkiezer uit te schakelen.
• sort = "1" - om productsorteerselector in te schakelen.
• = "1" - om shortcode in te schakelen.
• post_type - om inzendingen van een ander berichttype te tonen.
• per_row - om producten per rij te tonen.
• leeg - om een ​​bepaalde tekst weer te geven als er geen producten zijn om weer te geven.

• - toont "y" -items van categorie "x" weergegeven in "z" -kolommen en gerangschikt in aflopende volgorde, afhankelijk van de datum waarop ze zijn gepost.
• - toont productlijst.
• - toont productnaam. Opmerking: de waarde "naam" kan worden vervangen door andere waarden om meer shortcodes te vormen. Enkele van deze waarden zijn: prijs, beschrijving, korte beschrijving, attributentabel, SKU, verzending, galerij en gerelateerde categorieën.
• - toont categorieën voor de huidige productvermeldingspagina.
• - toont producten voor de huidige productvermeldingspagina.
• - toont paneermeel.
• - toont een beperkt aantal producten.
• - toont een terug naar producten-URL die naar de hoofdpagina met productvermeldingen verwijst.
• - toont producten die momenteel in de uitverkoop zijn.
• - toont product met id "x".
• - toont producten met ids "x", "y" en "z".
• - toont product met SKU "xyz"
• - toont product met SKU "abc", "def" en "ghi".
• - toont prijs en knop voor toevoegen aan winkelwagentje voor een product met id "x".
• - toont prijs en knop voor toevoegen aan winkelwagentje voor een product met SKU "x".
• - geeft maximaal "x" items weer.
• - toont producten met een bepaald attribuut, dwz attribuut "kleur" en de kleur is "zwart".

• - toont "x" recente producten weergegeven in "y" kolommen en gerangschikt in aflopende volgorde, afhankelijk van de datum waarop ze werden gepost.
• - toont "x" uitgelichte producten weergegeven in "y" kolommen en gerangschikt in aflopende volgorde, afhankelijk van de datum waarop ze werden gepost.
• - toont "x" populaire producten weergegeven in "y" kolommen en gerangschikt in aflopende volgorde, afhankelijk van de datum waarop ze zijn gepost.
• - toont "x" best beoordeelde producten weergegeven in "y" kolommen en gerangschikt in aflopende volgorde, afhankelijk van de datum waarop ze zijn gepost.
• - toont "x" best verkochte producten weergegeven in "y" kolommen en gerangschikt in aflopende volgorde, afhankelijk van de datum waarop ze werden gepost.
• - toont "x" gerelateerde producten weergegeven in "y" kolommen en gerangschikt in aflopende volgorde, afhankelijk van de datum waarop ze zijn gepost.
• - toont productvermelding met klassieke lijstsjabloon. Opmerking: andere sjablonen zoals 'grid' en 'standaard' kunnen worden gebruikt in plaats van 'lijst'.
• - toont producten uit categorie met id "x" en met klassieke lijstsjabloon.

Opmerking: als u goed bent in coderen, kunt u deze shortcodes aanpassen om een ​​betere productweergave en rangschikking te krijgen.

Een shortcode die op een pagina is geplakt

Door Jan Saints (Eigen werk): CC-BY-2.0

5. Schuifregelaars gebruiken

Voor het geval je het nog niet wist, is een schuifregelaar een webpagina-element dat wordt gebruikt om een ​​groep geselecteerde berichten te markeren. Het is als een diavoorstelling, wat betekent dat het één bericht per keer weergeeft, automatisch of door te klikken van het ene naar het andere.

Om producten met schuifregelaars weer te geven, moet u de berichten vervangen door uw producten. Als het gaat om het maken van een productslider, heb je een responsieve slider-plug-in nodig, zoals Soliloguy. Na het installeren en activeren van de plug-in, moet u een nieuwe schuifregelaar toevoegen, en u kunt dit doen door foto's, links en andere noodzakelijke details van uw items te gebruiken. De volgende stap is om uw slider op te slaan of te publiceren om een ​​shortcode en sjabloontag te krijgen.

Ten slotte moet u de shortcode op uw startpagina of een andere pagina kopiëren en plakken om de producten weer te geven. De sjabloontag kan items weergeven in het koptekstgedeelte van uw thema. U hoeft alleen maar de tag te kopiëren, uw header.php te openen en op de gecodeerde pagina te plakken.

WooCommerce heeft een plug-in genaamd Products Slider die op maat is gemaakt voor eCommerce. Het werkt als een typische slider-plug-in, maar het heeft wat meer instellingen en opties. Ik moedig je aan om te zien of het je kan helpen bij het weergeven en rangschikken van items.

Producten die op een schuifregelaar worden weergegeven

Door Jan Saints (Eigen werk): CC-BY-2.0

Conclusie

Het weergeven en rangschikken van items op uw WordPress eCommerce-website is vrij eenvoudig en gemakkelijk met deze vijf methoden. Als u het moeilijk vindt om producten in uw online winkel weer te geven en te rangschikken, moet u deze twee taken nu gemakkelijk gaan uitvoeren. Kies gewoon een methode waarvan u denkt dat deze voor u werkt en plaats die producten op een slimmere manier op uw homepage.

Referenties

1. Mening. R. Hoe een online winkel te bouwen met WordPress en WooCommerce. websitesetup.org . Website SetUp. (2017).
2. Andronaco R. Hoe maak je een online winkel met WooCommerce en Wordpress: eenvoudige gids voor het perfecte opzetten van een e-commerce website. (2017).
3. Rastaurius E., Etoile Web Design. eCommerce-productcatalogus voor WordPress. wordpress.org. implecode. (2017).
4. WooCommerce. Shortcodes inbegrepen bij WooCommerce. docs.woocommerce.com . WooCommerce. (2016).
5. Truman S., Tuan N., Ar3rev Software. WooCommerce productsorteer- en weergaveplug-in. wordpress.org. Ar3rev-software. (2013).
6. YiThemes. Yith Infinite Scrolling-plug-in. wordpress.org. YITHEMES. (2017).
7. Razzak S. Een exclusieve gids voor WooCommerce Products Slider Plugin. cloudways.com. Cloudways Ltd. (2016).
8. Balkhi S. Hoe u eenvoudig een responsieve WordPress-schuifregelaar kunt maken met Soliloquy. wpbeginner.com . WPBeginner. (2014).

© 2017 Januaris Saint Fores