WooCommerce (deel 2): producten plaatsen & design aanpassen

WooCommerce (deel 2): producten plaatsen & design aanpassen

Met WooCommerce verander je jouw WordPress-site met een paar clicks in een volledige webshop. Dankzij de WooCommerce-blokken ben je helemaal vrij in het ontwerp.

In het eerste deel van deze blogserie hebben we WooCommerce opgezet en de voor- en nadelen van deze plug-in op een rij gezet. Nu gaan we een stap verder. We voegen producten toe en passen het ontwerp aan.

1. Producten toevoegen

Is het technische en juridische werk gedaan? Dan kun je de producten toevoegen (Producten -> Nieuw toevoegen). Dit werkt op dezelfde manier als het maken van artikelen in de klassieke editor. De titel is de productnaam, de tekst is de productbeschrijving. Ook kun je net als bij een “normaal” WordPress-artikel foto’s toevoegen. Onder de editor kun je de productgegevens zoals prijs, voorraadstatus, verzending en eigenschappen invullen.

Productgegevens invoeren met WooCommerce
Productgegevens invoeren met WooCommerce

Voor je bezoekers ziet het er met het thema Twenty Nineteen dan zo uit:

Voorbeeld-productpagina met WooCommerce
Voorbeeld-productpagina voor een hele luide wekker

WooCommerce maakt standaard een eigen pagina voor je shop aan. Net als alle andere pagina’s kun je deze bewerken in de Gutenberg-editor (Pagina’s -> Alle pagina’s -> Winkel -> Bewerken). Open de blokselectie via het ‘+’-symbool. Voer je ‘Woo’ in het zoekvak in? Dan zie je de WooCommerce-blokken. Je kunt bijvoorbeeld aanbiedingen of nieuwe producten weergeven.

WooCommerce Widgets
Handig: WooCommerce-blokken

2. Design aanpassen

De meeste WordPress-thema’s zijn ontwikkeld voor blogs. Maar in een webshop ligt de focus op de verkoop van producten, in plaats van op teksten. Daarom zijn er thema’s die speciaal zijn aangepast voor WooCommerce.

Onder de gratis thema’s is Storefront bijvoorbeeld een aanrader. Dit thema is ook ontwikkeld door de WordPress-makers en is heel flexibel. Na het activeren van het thema heb je een groot aantal shop-specifieke opties beschikbaar in de customizer (Weergave -> Customizer). Je kunt onder andere de kleuren van de knoppen aanpassen, shopmeldingen aanmaken en productafbeeldingen bewerken.

Je begint met een geschikte headerafbeelding. Die upload je in de customizer. Verwijder vervolgens alle widgets uit de zijbalk om de volledige breedte te gebruiken (Weergave -> Widgets). Daarna maak je een menu aan met een beperkt aantal opties, zodat je klanten niet worden afgeleid (Weergave -> Menu’s). De links naar bijvoorbeeld de algemene voorwaarden en het privacybeleid kun je beter in de footer zetten. Onze testshop ziet er na deze stappen zo uit:

 Voorbeeld van shoppagina met WooCommerce
Klokkenwinkel met WooCommerce

Lastig te leren voor shop-eigenaren

In deze inleiding kunnen we maar een paar van de vele mogelijkheden van WooCommerce laten zien. De plug-in is namelijk nogal complex en het kost je veel tijd om alle opties te begrijpen. Vanwege de ingewikkelde juridische en technische eisen die aan een open shopsysteem worden gesteld, kan dit ook niet anders. Ben je bereid om deze tijd te investeren? Dan word je beloond met een uiterst flexibel systeem, dat je ongetwijfeld zult waarderen.

Vind je WooCommerce toch te ingewikkeld? Kijk dan eens naar de webshops van STRATO:

Naar STRATO Webshop
Zoekwoorden: ,

Delen

Je kunt pas een reactie plaatsen nadat je ons privacybeleid en cookies hebt geaccepteerd. Om privacyredenen mogen wij jouw persoonsgegevens anders niet verwerken.

Klik onderaan de pagina op de blauwe button OK. Nadat je de pagina opnieuw hebt geladen, kun je een reactie achterlaten.