Zo werkt ‘t: WooCommerce themes installeren en aanpassen

Lysanne Hopman
leestijd
Zo werkt ‘t: WooCommerce themes installeren en aanpassen

Voor WooCommerce zijn er tienduizenden themes verkrijgbaar. Hiermee maak je een spetterende eerste indruk op je webshopbezoekers. Maar hoe installeer je een WooCommerce theme? En hoe pas je dit naar wens aan? Dat en meer kom je te weten in dit artikel.

Ben je nog niet begonnen met WooCommerce? Dan dien je eerst WordPress te bestellen en vervolgens WooCommerce te installeren. Daarna kun je aan de slag met een WooCommerce-webshop maken.

Product

Performance Hosting

Boost jouw groeiende website of webshop. Dankzij de optimale performance van een Managed VPS.

  • Eenvoudig opschaalbaar
  • De beste performance voor je site of shop
  • Veilig en betrouwbaar high-end datacenter
  • Geen omkijken naar het technisch beheer
  • Installeer in 1 klik WordPress
  • Persoonlijke accountmanager en technici

Wat is een WooCommerce theme?

Een WooCommerce theme is een webshop theme voor WordPress. Het design is zo gemaakt dat het optimaal werkt met WooCommerce en WordPress. 

Niet alle WordPress-thema’s werken met WooCommerce

Je kunt WooCommerce themes vergelijken met WordPress-thema’s. Maar niet elk WordPress-thema is geschikt voor WooCommerce. Je kunt wel WooCommerce als functionaliteit toevoegen, maar meestal wordt het design niet meegenomen. Hierdoor kan het gebeuren dat de WordPress-plugin of extension die je hebt geïnstalleerd een heel andere opmaak heeft dan de rest van het design. 

Om ervoor te zorgen dat het design 1 geheel blijft, moet je de code induiken. En daarvoor heb je technische kennis nodig. Om het voor jou makkelijker te maken, kies je het liefst voor een theme dat compatibel is met WordPress en WooCommerce.

Waar vind ik WooCommerce themes?

Je vindt diverse WooCommerce themes in de Theme Store van WooCommerce. Dit zijn themes waarvan je kunt uitgaan dat ze optimaal werken met WordPress en WooCommerce. Daarnaast zijn er gratis WooCommerce themes beschikbaar in de WordPress thema directory. Zoek naar ‘WooCommerce’ of filter je zoekopdracht met ‘E-commerce’. Tip: kijk in de beschrijving of het theme overweg kan met WooCommerce. Als laatste kun je een kijkje nemen op ThemeForest voor een mooi theme. Zo’n theme bevat vaak ook meerdere templates.

Twijfel je of je geld wilt uitgeven aan een WooCommerce theme? Lees meer over het kopen van een WordPress-thema.

5 tips om een WooCommerce theme te kiezen

Het belangrijkste om te onthouden bij het kiezen van een theme is dat het overweg kan met WordPress en WooCommerce. Maar denk ook aan deze tips:

  1. Past het theme bij de inhoud van je webshop?
  2. Is het theme geschikt voor desktop, tablet en mobiel (responsive)?
  3. Wanneer is het theme voor het laatst bijgewerkt?
  4. Hoe vaak is het theme geïnstalleerd?
  5. Wat zijn de beoordelingen van het theme?

De beste WooCommerce themes

Er zijn veel verschillende soorten themes voor WooCommerce verkrijgbaar, waaronder deze vallen onder de beste WooCommerce themes:

  1. Astra
  2. Avada
  3. OceanWP
  4. Storefront
  5. Bogita
WooCommerce configuratie

Een WooCommerce theme installeren

Een WooCommerce theme installeren, is niet moeilijk. Als je voor het eerst een WooCommerce-webshop maakt, krijg je tijdens de configuratie van de belangrijkste onderdelen een aantal themes voorgeschoteld. Wanneer je een van deze themes kiest, wordt het direct voor je geïnstalleerd. Wil je een ander WordPress WooCommerce theme installeren? Dan kun je dit op 3 manieren doen:

  1. via de Admin-omgeving
  2. via de Customizer-omgeving
  3. uploaden via een ftp-programma

Een WooCommerce theme installeren via de Admin-omgeving

Allereerst kun je een WooCommerce theme installeren via de Admin-omgeving van je WordPress-installatie. Volg hiervoor de onderstaande stappen:

  1. Ga in het Dashboard-menu links naar ‘Weergave’.
  2. Klik op ‘Thema’s’.
  3. Bekijk via ‘Nieuwe toevoegen’ alle beschikbare themes.
  4. Klik op ‘Installeren’ als je een theme hebt gevonden.
  5. Activeer je theme en pas het naar eigen wens aan via ‘Customizer’.

Heb je een theme gekocht? Dan upload je dit op het Thema-overzicht via de linkerbovenknop ‘Thema toevoegen’ > ‘Thema uploaden’.

Een WooCommerce theme installeren via de Customizer-omgeving

Via de volgende manier installeer je een theme via de Customizer-omgeving. Het voordeel hiervan is dat je direct het theme naar wens kunt aanpassen.

  1. Ga in het Dashboard-menu links naar ‘Weergave’.
  2. Klik op ‘Customizer’.
  3. Klik in het linkermenu bij ‘Actief thema’ op ‘Veranderen’.
  4. Ga naar ‘WordPress.org-thema’s’.
  5. Zoek op thema of filter op ‘E-Commerce’.
  6. Klik op ‘Installeren en voorbeeld tonen’.

Een WooCommerce theme uploaden via (s)ftp

Tot slot kun je een WordPress WooCommerce theme uploaden via sftp. Dit is een beveiligde verbinding waarmee je bestanden uploadt naar de server (computer) waarop de bestanden van je webshop staan. Zo werkt het:

  1. Download jouw gewenste theme en pak het .zip-bestand uit. Bewaar het bestand op een makkelijk te vinden plek op je computer.
  2. Maak via FileZilla verbinding met de server waarop jouw website draait. Gebruik hiervoor onze handleiding ‘Website uploaden en downloaden via FileZilla’.
  3. Zoek aan de linkerkant van FileZilla naar de computermap waarin het theme staat.
  4. Ga aan de rechterkant naar de map ‘webspace’ en dubbelklik op deze map om de inhoud ervan te bekijken. Let op: een VPS heeft geen webspace-map.
  5. Ga naar de root-folder via ‘httpdocs’ > jouw domeinnaam > ‘wp-content’ > ‘themes’.
  6. Sleep het theme naar deze map.
  7. Ga naar de Admin-omgeving van je WordPress-website.
  8. Ga in het Dashboard-menu links naar ‘Weergave’.
  9. Klik op ‘Thema’s’.
  10. Klik op ‘Activeren’ bij het theme dat je hebt geüpload.

Let op: Weet je niet wat je root-folder is? Gebruik dan de stappen in onze handleiding ‘Wat is de root-folder van mijn website?’.

Maak je site met een WordPress-pakket van Hostnet. Inclusief installatie en andere extra’s.

Een WooCommerce theme aanpassen

Zodra je een WooCommerce theme hebt geïnstalleerd, kun je deze naar wens aanpassen. Dit doe je via de Customizer-omgeving van jouw WordPress-installatie. 

Eerst een back-up maken

Voordat je het theme gaat aanpassen, raden we je aan om een back-up te maken. Wanneer er iets verkeerd gaat bij het aanpassen, kun je de meest recente versie terugplaatsen. Je kunt een back-up maken met een van de volgende WordPress-plugins:

Heb je een unmanaged VPS? Dan kun je ervoor kiezen om Acronis Backup te bestellen. Je regelt en controleert zelf de back-ups. Voor een managed VPS gebruik je Managed Backup. Onze experts regelen de back-ups dan voor je. Check voor meer informatie onze pagina over back-ups.

Een handmatige back-up maken

Wil je geen plugin installeren? Dan kun je ook handmatig een back-up maken. Hiervoor volg je de stappen uit het onderstaande artikel.

De Customizer-omgeving

Om bij de Customizer-omgeving te komen, volg je deze stappen:

  1. Ga in het Dashboard-menu links naar ‘Weergave’.
  2. Klik op ‘Customizer’.

In de Customizer-omgeving zie je aan de linkerkant een menu met verschillende onderdelen staan die je kunt aanpassen. Denk aan een logo, de site-titel en de slogan. Ook heb je de mogelijkheid om via css-code de styling zelf aan te passen. Welke opties er beschikbaar zijn, zijn afhankelijk van het gekozen theme. 

Aan de rechterkant in de Customizer-omgeving zie je hoe jouw webshop eruitziet. Pas je wat aan? Dan zie je gelijk de aanpassing. Ook heb je de mogelijkheid om het design van je webshop te bekijken op desktop, tablet en mobiel. Zo weet je zeker dat je shop er goed uitziet op elk apparaat.

Het resultaat publiceren

Ben je tevreden over het resultaat? Dan heb je linksboven 4 opties:

  1. Je kunt het ontwerp direct publiceren.
  2. Je kunt het ontwerp als concept opslaan.
  3. Je kunt het ontwerp inplannen op een bepaalde datum.
  4. Je kunt het ontwerp delen met anderen via een ‘geheime’ link.

Een ander WooCommerce theme installeren

Ben je niet tevreden over je huidige WooCommerce theme? Dan heb je altijd de mogelijkheid om een ander theme te installeren. Om een nieuw theme te installeren, volg je de installatiestappen die je eerder in dit artikel hebt gevolgd. Vervolgens activeer je het nieuwe theme via deze stappen:

  1. Ga in het Dashboard-menu links naar ‘Weergave’.
  2. Klik op ‘Thema’s’.
  3. Ga met je muis op het nieuwe theme staan.
  4. Klik op ‘Activeren’.
Waarom WooCommerce

Waarom een WooCommerce theme verwijderen?

Om de Admin-omgeving van je WordPress-installatie opgeruimd te houden, raad ik je aan om de WordPress WooCommerce themes die je niet gebruikt te verwijderen. Daarnaast geldt, hoe meer themes, hoe langer het duurt voordat alle bestanden van je webshop zijn ingeladen. En dat veroorzaakt een tragere shop. 

Voordat je een theme verwijdert, raden we je aan om een back-up te maken van je website. Als er iets misgaat, kun je altijd de meest recente versie van je shop terugzetten.

Verwijder niet zomaar een theme

Het is belangrijk om te weten dat je niet zomaar een theme moet verwijderen. Werkt je huidige theme niet naar behoren? Dan heb je nergens om op terug te vallen en werkt je webshop niet meer. Daarom is het aan te raden om een standaard WordPress-thema als back-up te houden. Gebruik je een child theme? Dan moet je het ‘parent theme’ behouden. Anders werkt je webshop ook niet meer.

Een WooCommerce theme verwijderen

Je kunt op 2 manieren een WooCommerce theme verwijderen:

  1. via de Admin-omgeving
  2. via een ftp-programma

Hieronder leg ik beide manieren aan je uit.

Een WooCommerce theme verwijderen via de Admin-omgeving

  1. Ga in het Dashboard-menu links naar ‘Weergave’.
  2. Klik op ‘Thema’s’.
  3. Ga met je muis op het theme staan dat je wilt verwijderen.
  4. Klik op ‘Themadetails’.
  5. Klik rechtsonder op ‘Verwijderen’.

Let op: Je kunt niet het theme verwijderen dat geactiveerd is. Je moet eerst een ander theme activeren als je het huidige theme wilt verwijderen.

Een WooCommerce theme verwijderen via een ftp-programma

  1. Maak via FileZilla verbinding met de server waarop jouw website draait. Gebruik hiervoor onze handleiding ‘Website uploaden en downloaden via FileZilla’.
  2. Ga aan de rechterkant naar de map ‘webspace’ en dubbelklik op deze map om de inhoud ervan te bekijken. Let op: een VPS heeft geen webspace.
  3. Ga naar de root-folder via ‘httpdocs’ > jouw domeinnaam > ‘wp-content’ > ‘themes’.
  4. Zoek naar het theme dat je wilt verwijderen. Zorg ervoor dat het theme niet actief is op je webshop.
  5. Klik met je rechtermuisknop op het theme en kies voor de verwijderoptie.

Let op: Weet je niet wat je root-folder is? Gebruik dan de stappen in onze handleiding ‘Wat is de root-folder van mijn website?’.

Een WooCommerce theme opnieuw installeren

Heb je per ongeluk een theme verwijderd? Of wil je toch terug naar je oude theme? Geen probleem. Je kunt een theme altijd opnieuw installeren. Dit doe je op dezelfde manier als je een nieuwe installeert.

Een WooCommerce theme installeren is gelukt!

Je bent geslaagd in het installeren van een WooCommerce theme. Nu heb je een prachtig design voor je webshop. Heb je al producten in WooCommerce toegevoegd? En de WooCommerce-betalingen beheert? Op Hostnet Academy vind je meer WooCommerce-artikelen die je verder op weg helpen met het bouwen van jouw shop. Veel succes!

Welk WooCommerce theme gebruik jij? Laat het weten in de comments!

Product

Performance Hosting

Boost jouw groeiende website of webshop. Dankzij de optimale performance van een Managed VPS.

  • Eenvoudig opschaalbaar
  • De beste performance voor je site of shop
  • Veilig en betrouwbaar high-end datacenter
  • Geen omkijken naar het technisch beheer
  • Installeer in 1 klik WordPress
  • Persoonlijke accountmanager en technici
Delen
Lysanne Hopman

Lysanne Hopman is SEO Content Specialist bij Hostnet. Haar passie voor schrijven en SEO komt tot leven in zowel haar werk bij Hostnet als op haar lifestyleblog.

Reacties
Reageer

Praat mee over dit onderwerp

  • Laat hier jouw reactie achter.
  • Vul jouw naam in.
  • Vul jouw e-mailadres in.

Met het plaatsen van mijn reactie ga ik ermee akkoord dat Hostnet Academy (indien van toepassing) een afbeelding van https://en.gravatar.com/ toont die gekoppeld is aan het door mij opgegeven e-mailadres. Ook ben ik mij bewust van de gedragscode van Hostnet Academy.

Hostnet