PrestaShop, begin je eigen webwinkel bij Antagonist! Het complete stappenplan

Een aantal maanden geleden heb ik jullie laten zien hoe je met behulp van WordPress en WooCommerce gemakkelijk een webshop opzet. Deze keer laat ik jullie zien hoe je eenvoudig een PrestaShop-webshop installeert en configureert.

Wat is het verschil tussen PrestaShop en WooCommerce?

WooCommerce is een plug-in, waarmee je eenvoudig een WordPress-website (CMS) kunt uitbreiden met een webshop. PrestaShop is een stuk software wat dient als een volledige webshop en niet als een contentmanagementsysteem. Wil je bijvoorbeeld een bedrijfswebsite uitbreiden met een webshop dan kun je beter kiezen voor een WordPress-website in combinatie met WooCommerce-webshop. Wil je een website die volledig dient als webshop (geen extra’s), dan kun je kiezen voor het volledige systeem van PrestaShop.

Het stappenplan voor het starten van een webwinkel

• PrestaShop hosting bij Antagonist
• Installatie van PrestaShop met behulp van Installatron
• Instellen van PrestaShop (Functies)
  • Dashboard: Het dashboard voor het overzicht van je webshop
  • Catalogus: Het inrichten van jouw webwinkel
    • Het beheren/toevoegen van de categorieën
    • Het beheren/toevoegen van de producten
    • Het monitoren van je bestellingen
    • Diverse productattributen
    • Verschillende productkenmerken
    • Fabrikanten
  • Beheren van je bestellingen
  • Beheren van je klanten
  • Instellen van betaalmethodes

1. PrestaShop-hosting bij Antagonist

Bij Antagonist heb je de keuze uit een aantal pakketten. Alle pakketten zijn geschikt voor het hosten van een PrestaShop-webshop. Voor kleinschalige webshops is een Basic-pakket zeer geschikt. Denk je dat je snel gaat groeien, dan kun je kiezen voor een Unlimited-pakket. Je kunt overigens altijd nog later switchen van een Basic- naar een Unlimited-pakket. Leg nu direct je pakket en domeinnaam vast!

Bekijk hostingpakketten →

2. Installatie van PrestaShop met behulp van Installatron

Heb je een pakket bij Antagonist aangeschaft, dan heb je de mogelijkheid om PrestaShop te installeren. Dat kan dankzij Installatron met een paar klikken. Lees meer over software installeren met Installatron.

2.1 Waar vind ik Installatron bij Antagonist?

Nadat je de hosting hebt afgesloten bij Antagonist heb je de mogelijkheid om in te loggen via Mijn Antagonist.

Eenmaal ingelogd klik je op “Producten” bovenaan in de navigatiebalk. Je krijgt nu je pakket te zien. Je ziet twee producten: “jouw hosting” + “jouw domeinnaam”.

Nu is het de bedoeling dat je op je hosting-pakket klikt (Alles-in-1 Basic debXXXX). Wanneer je eenmaal op je pakket geklikt hebt, krijg je diverse mogelijkheden te zien. Het lijkt misschien allemaal heel spannend, maar het is vrij eenvoudig. Het enige wat je vanaf dit scherm hoeft te doen, is inloggen op de webserver met behulp van DirectAdmin. In onderstaande screenshot zijn er drie punten uitgelicht.

1. Je inlognaam voor DirectAdmin.
2. Kun je een wachtwoord aanvragen.
3. Hier klik je op om in te loggen met de zojuist aangemaakte credentials op de server.

Wanneer je eenmaal op nr #3 in bovenstaande screenshot hebt geklikt, krijg je het onderstaande scherm te zien. Via DirectAdmin kun je inloggen met de zojuist aangemaakte gegevens.

2.2 Installeer PrestaShop via Installatron.

Binnen DirectAdmin heb je verschillende mogelijkheden waaronder het aanmaken van e-mailaccounts, instellen van je spamfilter etc. Helemaal onderaan heb je een sectie “Installatron“. Installatron geeft je de mogelijkheid om diverse applicaties op een eenvoudige en snelle manier te installeren of te configureren. Klik op “PrestaShop“.

Hierna krijg je een scherm te zien van Installatron met meer informatie over de desbetreffende applicatie. Je kunt PrestaShop installeren door rechtsbovenin op “Install this application” te klikken.

Vervolgens krijg je een aantal blokken te zien, waaronder “Location”, “Version”, “Settings” en “Advanced”. Bij het eerste blok staat jouw domeinnaam vermeld. Je kunt hieronder de locatie aangeven waar PrestaShop geïnstalleerd moet worden, hier staat nu ecommerce.

Wanneer je dus straks je webshop wilt bereiken moet je naar “jouwdomeinnaam.nl/ecommerce” gaan. Wil je direct je webshop bereiken wanneer je naar jouwdomeinnaam.nl gaat dan kun je “ecommerce” weghalen.

Als je iets naar beneden scrollt kom je bij het volgende blok: “Version“. Je kunt hier de juiste versie en taal selecteren. Tevens heb je hier de mogelijkheid om demo-content toe te voegen aan je webshop, zodat je een duidelijk beeld krijgt van de webshop wanneer deze gevuld is. Hierna moet je akkoord gaan met de licentieovereenkomst. Ook kun je instellen of je een back-up wilt realiseren en of je ervoor wilt zorgen dat PrestaShop automatisch updatet, wanneer er een nieuwe versie gelanceerd wordt.

Het volgende blok is het aanmaken van een algemeen account, waarmee je de webshop kunt beheren. Vul hier jouw e-mailadres in en bedenk een sterk wachtwoord, minimaal twee hoofdletters met minimaal twee cijfers. Het laatste blok “Advanced” is speciaal voor de mensen die nog een aantal extra’s willen instellen, zoals de locatie en de tijd wanneer er een back-up gemaakt wordt. Indien je hier geen interesse in hebt dan vink je “Automatically manage advanced settings for me” aan. Hierna druk je onderaan op install. Wanneer PrestaShop succesvol geïnstalleerd is zie je het volgende scherm.

Let op! De tweede link is in bovenstaande screenshot verwijderd, maar dit is de link om bij je admin panel te komen. Uit veiligheidsoverwegingen maakt PrestaShop gebruik van een random map om bij je admin panel te komen. Kopieer deze link en bewaar deze goed! Bij mij is het “http://www.domeinnaam.nl/ez0xetzjobbh6yyy”.

Vind je deze naam te lastig en wil je deze graag aanpassen dan kan dat op twee verschillende manieren. De eerste manier is het aanmaken van een FTP-account via DirectAdmin, hierna een programma zoals Filezilla downloaden, inloggen met de account en dan de mapnaam wijzigen naar je eigen naam. De twee manier is het veranderen van de mapnaam via de “FileManager” in Direct Admin.

Je klikt op “File Manager” > “Public_html” en dan zie je daar de mapnaam staan, deze kun je aanpassen door op “rename” te klikken achter de mapnaam.

3. Instellen van PrestaShop (Functies)

Wanneer je naar jouw admin panel gaat (voor mij dus: http://www.domeinnaam.nl/ez0xetzjobbh6yyy), kun je inloggen met de credentials die je eerder aangemaakt hebt. PrestaShop werkt zeer eenvoudig en het is gemakkelijk om je webshop in te richten. Wanneer je eenmaal ingelogd bent, zie je aan de linkerkant een zwart menu. De belangrijkste onderdelen die je helpen tijdens de start van je webshop worden uitvoerig besproken.

3.1 Het dashboard van PrestaShop

Bovenaan in het linkermenu kun je klikken op dashboard. Hier kom je overigens ook wanneer je inlogt. Via het dashboard kun je in één oogopslag zien hoeveel bezoekers er online zijn en hoeveel producten je hebt verkocht.

Wat kun je allemaal bekijken in het dashboard van PrestaShop?

• Instellen van een bepaalde periode (statistieken bekijken).
• Activiteiten bekijken: aantal bezoekers, bestellingen en productbeoordelingen.
• Overzichtelijke grafiek van de aantal bestellingen, omzet en winst.
• Klanten die zich hebben ingeschreven voor de nieuwsbrief.
• Recente bestellingen en best verkochte producten.
• Inkomende verkeer.

Je hebt tevens de mogelijkheid om eenvoudig extra modules aan je dashboard toe te voegen. Onderaan op de dashboard-pagina vind je hier een knop voor. Je wordt doorverwezen naar de officiële PrestaShop-website.

3.2 Catalogus: Het inrichten van jouw webwinkel

Ook het inrichten van je webshop is heel eenvoudig geregeld. Het is uiteraard belangrijk dat je een overzicht hebt van je inventaris voordat je deze gaat invoeren in je webshop. Wil jij een succes van je webshop maken dan is het overzicht behouden één van de belangrijkste factoren.

Wanneer je in het linkermenu over “Catalogus” heen gaat krijg je de volgende mogelijkheden. Ik bespreek alleen de belangrijkste opties.

• 3.2.2 Producten
• 3.2.1 Categorieën
• 3.2.3 Monitoring
• 3.2.4 Productattributen
• 3.2.5 Productkenmerken
• 3.2.6 Fabrikanten

3.2.1 Het toevoegen en wijzigen van categorieën in PrestaShop

Nu ga ik het lijstje op een andere volgorde benaderen. Voordat je producten kunt toevoegen aan de categorieën is het belangrijk dat je daadwerkelijk categorieën hebt aangemaakt. Wanneer je op categorieën klikt dan zie je daar een enkele categorie staan. De wijze waarop PrestaShop dit laat zien, vind ik persoonlijk vrij onhandig en ik mis hier een beetje het overzicht. Je ziet alle onderliggende categorieën pas wanneer je op een categorie klikt.

Om even duidelijkheid te creëren laat ik je zien waarom deze indeling voor een beetje verwarring kan zorgen op je website. Als ik bijvoorbeeld nu naar mijn webshop heen ga met demo-content dan zie ik toch meerdere categorieën in mijn menu staan? “Women”, “Dresses”, “T-shirts” en “Blog”.

Dresses en T-shirts zijn een onderliggende categorie van “Women”, maar via deze methode kun je een onderliggende categorie gewoon verwijzen vanuit dezelfde laag in de navigatiebalk. Straks laat ik jullie zien hoe je het menu kunt aanpassen.

Je kunt een categorie aanmaken door op de “+” te drukken rechtsboven in de hoek. Een categorie wijzigen kan met het icoon ernaast. Om als voorbeeld te laten zien hoe je een nieuwe categorie aanmaakt heb ik het voorbeeld gebruikt van de webshop.

Alle velden spreken voor zich. Je kunt bij “ouder categorie” selecteren of je nieuwe categorie onder een bestaande categorie moet komen.

Binnen deze categorie is ook een afbeelding toegevoegd. Wil je ook graag een afbeelding toevoegen zorg dan dat deze 870 x 217 pixels is voor een optimaal resultaat.

In deze categorie zijn ook miniaturen toegevoegd, deze kun je terugvinden in het menu van je webshop. Zie onderstaande screenshot hoe dat er dan uit komt te zien.

Categorie toevoegen aan het menu van je webshop

Nu heb je een categorie aangemaakt maar nu wordt hij nog niet getoond in het menu van je webshop. Om de navigatiebalk (menu) van je PrestaShop-webshop aan te passen moet je klikken op “Modules” in het admin-menu (linkerkant).

Schrik niet! Je ziet nu een lange lijst met verschillende modules. Als het goed is staat het overzicht automatisch op “Allemaal”.

Je moet op zoek gaan naar de module: “Horizontaal top menu” of “Top horizontal menu” indien je gebruik maakt van de Engelse versie. Deze module kun je aan de rechterkant “configureren”. Je komt nu op de pagina waar je de categorie kunt toevoegen aan je menu.

Nu ben je al een heel eind op weg! Je hebt nu categorieën aangemaakt en toegevoegd aan het menu. De volgende stap is het toevoegen van producten.

3.2.2 Het toevoegen van producten in PrestaShop

Nu ik heb laten zien hoe je categorieën aanmaakt en toevoegt aan het menu is het tijd voor  het toevoegen van producten. In het linkermenu ga je naar “Catalogus” > “Producten“. Je ziet hier een overzicht van de diverse producten in je webshop. Je kunt gebruik maken van de invulvelden indien je wilt filteren op een specifieke categorie of referentie.

Om een product toe te voegen kun je rechtsboven op het plusje klikken. Hierna krijg je het volgende scherm te zien.

Je moet even rekening houden met het feit dat je vrij veel moet invullen per product. Aan de linkerkant zie je weer een submenu die je kunt gebruiken om je product te definiëren. Het kopje waar je mee begint is “Informatie“. De velden binnen dit tabblad spreken voor zich. Je moet alleen even een goede indeling bedenken voor je referentiecode, zodat je op ieder moment intern je product makkelijk kunt identificeren.

Het tabblad SEO is vrij belangrijk voor je webshop. Zorg dat je een duidelijke omschrijving van je product invult. Gebruik de zoekterm waar je op gevonden wilt worden en zorg dat je een pakkende titel bedenkt om de CTR (Click-Through Rate) te verhogen.

Het tabblad Associaties wordt gebruikt voor het indelen van het product in een bepaalde categorie/categorieën. Je ziet waarschijnlijk alleen “Home” staan als categorie, maar deze moet je eerst uitklappen voordat je alle categorieën ziet. Je kunt hier overigens ook nog aangeven of het product een accessoire is van een ander product. (Hier kun je gewoon de naam van een ander product invoeren)

Het volgende tabblad (Verzending) is zeer belangrijk. Voor ieder product moet je de verzendafmetingen invullen plus het gewicht van het product. Wanneer mensen producten gaan bestellen moet er automatisch berekent worden hoeveel de verzendkosten zijn, bijvoorbeeld indien iemand meerdere producten gaat bestellen. Je kunt zelf een selectie maken of mensen kunnen zelf kiezen via welke vervoerder de pakketjes worden afgeleverd.

Nu begint het leuk te worden want nu heb je zometeen de mogelijkheid uit een aantal keuzes. Voordat ik begin aan het tabblad “Combinaties” ga ik eerst afbeeldingen toevoegen aan mijn product. Ik laat ook meteen het effect zien in mijn webshop zodat je een duidelijk beeld krijgt van het verschil. Ik druk op het tabblad “Afbeeldingen” en upload drie foto’s van het product. In onderstaande screenshot zie je hoe het product er nu uitziet in de webshop.

Je ziet nu de drie afbeeldingen onder de afbeelding. Wanneer stel je het op deze manier in? Wanneer je maar een enkele versie van een product hebt en je wilt het product in verschillende aanzichten tonen.

Let op! Normaal gesproken zou je dus drie keer een wit t-shirt op deze manier tonen. Nu zul je je afvragen: “Hoe geef ik de bezoeker de mogelijkheid om uit diverse kleuren te kiezen?” Nu komen we bij het tabblad “Combinaties“.

Het ziet er misschien een beetje ingewikkeld uit, maar het is vrij simpel! Je drukt op “Nieuwe combinatie“. Hierna selecteer je het juiste attribuut: “Color” en je selecteert de kleur, daarna klik je rechts op toevoegen.

Aan de kleur kun je ook weer een referentienummer koppelen zodat je intern precies weet om welk product het gaat in combinatie met welke kleur. Ik kies voor “Product00002-W“. Onderaan zie je de drie afbeeldingen staan die ik eerder heb toegevoegd. Ik vink het witte shirt aan en ik klik op “opslaan“. Ik maak nog twee combinaties aan voor het gele shirt en het blauwe shirt. Wanneer je nu weer naar de webshop gaat zie je direct het verschil. Wanneer je een kleur selecteert verandert de foto.

Je weet nu hoe je meerdere foto’s aan een product koppelt en je weet hoe je meerdere kleuren aan je product koppelt, verschillende maten koppel je op precies dezelfde manier aan je producten.

Let op! Het wordt redelijk complex indien je gebruik maakt van vier kleuren en vier verschillende maten. Je moet dus goed nadenken over de referentiecode van ieder product.

Bijvoorbeeld:

• shirt000001 (algemene code shirt);
• shirt000001-W-S (shirt wit small);
• shirt000001-W-M (shirt wit medium);
• shirt000001-W-L (shirt wit large);
• shirt000001-B-S (shirt blauw small).

Je kunt het volledig op je eigen manier invullen! Zorg voor een overzichtelijke methode zodat je direct weet over welk product het gaat indien iemand een bestelling plaatst.

We komen nu bij het tabblad “Aantallen“. Je kunt hier gewoon handmatig aangeven hoeveel voorraad er aanwezig is. Het systeem zal zelf de berekening maken indien er een product verkocht wordt.

De overige tabbladen kun je zelf even bekijken. Deze tabbladen zijn niet noodzakelijk voor een correcte werking van jouw webshop.

3.2.3 Monitoring van je bestellingen

Nu we eenmaal weten hoe we categorieën en producten kunnen aanmaken komen we bij het kopje “Monitoring”. Klik weer in het linker admin panel op “Catalogus” > “Monitoring”.

De monitoring feature is een belangrijke feature binnen PrestaShop. Je wilt totale controle over je webshop. Wanneer er iets gebeurt dan wil je weten wat er aan de hand is en waarom een product uit de catalogus is gehaald, bijvoorbeeld als de voorraad op is. In het monitoring panel worden vier secties weergegeven.

1. Overzicht van lege categorieën

Als een categorie leeg is dan wordt dat hier direct aangegeven. Je wilt voorkomen dat mensen kunnen klikken op een categorie en hierna uitkomen op een lege pagina. Zorg daarom dat er altijd één product in je categorie aanwezig is!

2. Overzicht van producten zonder beschikbare aantallen

Geeft de producten weer die niet langer meer te koop zijn in je webshop. De reden kan nog onduidelijk zijn en die zul je zelf even moeten uitzoeken. Je kunt de producten eventueel direct weer online zetten.

3. Overzicht van producten zonder beschikbare hoeveelheden

Geeft net zoals bij twee aan welke producten niet langer verkocht worden via je webwinkel.

4. Overzicht met uitgeschakelde producten

Alle producten die uitgeschakeld zijn door bijvoorbeeld een te lage voorraad. Schakel deze producten weer in met een correcte voorraad of verwijder ze uit je webshop.

Je ziet dus dat je vrij eenvoudig en snel kunt zien of er producten niet meer verkocht worden. Vooral bij zeer veel producten en categorieën kun je het beheer vereenvoudigen en hoef je niet telkens te zoeken of alles goed gaat met je producten.

3.2.4 Wat zijn productattributen en waarom instellen?

Als je nu weer in het admin panel klikt op  “Catalogus” > “Productattributen”, dan krijg je het volgende scherm te zien.

We hadden net al een product aangemaakt en toen kon je kiezen uit een aantal attributen. Vooraf stonden de bepaalde waardes zoals “Color” en “Size” al voor je ingesteld omdat dit de meest voorkomende waardes zijn. Wil je zelf de mogelijkheid hebben om mensen te laten kiezen uit een “custom” attribuut? Verkoop je bijvoorbeeld producten met eigenschappen die niet aangegeven zijn dan kun je deze hier toevoegen.

3.2.5 Wat zijn productkenmerken en waarom instellen?

De pagina om productkenmerken in te stellen kun je ook weer bereiken via “Catalogus” > “Productkenmerken”. Het werkt hetzelfde als de productattributen. Indien je eigen waardes voor een product wilt tonen binnen je website, bijvoorbeeld om extra informatie te verschaffen, dan kun je een apart productkenmerk aanmaken.

3.2.6 Fabrikanten vermelden bij de producten

Wil je graag laten zien door welke fabrikant bepaalde producten gerealiseerd worden? Bekijk dan de mogelijkheid: “Catalogus” > “Fabrikanten”. Voeg hier een fabrikant toe inclusief logo. Indien je een fabrikant bij het product wilt vermelden dan kun je dit weer instellen als je een product aanmaakt.

Let op! Deze functie is krachtiger dan je nu misschien zult denken, wanneer je namelijk op de fabrikant klikt kun je precies in de gaten houden welke producten door welke fabrikant geleverd worden en hoeveel er nog op voorraad zijn.

Zo kun je dus overzichtelijk in de gaten houden wanneer er weer nieuwe producten gekocht moeten worden en bij welke fabrikant je deze producten kunt kopen. Overzicht is de sleutel tot een succesvolle webshop.

3.3 Beheren van je bestellingen

Nu komen we bij één van de belangrijkste onderdelen van je gehele webwinkel. Het financiële beheer! Het overzicht van de bestellingen is zeer overzichtelijk geordend. Als je in het adminpanel op “Bestellingen” > “Bestellingen” drukt dan krijg je een overzicht van alle bestellingen.

Achter iedere bestelling kun je duidelijk zien of een betaling voldaan is of dat de bestelling geannuleerd is. Uit ervaring controleer ik iedere bestelling en betaling met mijn online rekening (PSP). Staat er bijvoorbeeld in de webshop dat de betaling voldaan is ga er dan niet met 100% zekerheid vanuit dat de betaling dan ook echt voldaan is. Controleer dit altijd door in te loggen op je online rekening (PSP). Indien daar de betaling ontvangen is kun je met 100% zekerheid zeggen dat de betaling succesvol voltooid is.

Achter iedere bestelling zie je een knop staan “Bekijken”. Als je hier op klikt kom je op de pagina met alle informatie over de bestelling.

Schrik niet! Het lijkt misschien allemaal een beetje rommelig en je weet op het eerste moment niet precies waar je overal moet kijken, maar als je het onderverdeeld in bepaalde secties dan is het vrij eenvoudig. Je ziet in de bovenste balk van sectie #1 een knop met “Bestelling afdrukken” en hiernaast twee knoppen voor het afdrukken van een factuur en een pakbon. De knop van de factuur wordt pas zichtbaar indien je de betaling eronder op “Payment accepted” hebt staan en de “Pakbon” wordt pas beschikbaar als je de status op “Delivered” zet.

In sectie #2 zie je meer informatie over de klant inclusief het factuuradres en het verzendadres. Je hebt ook de mogelijkheid om notities te maken bij de desbetreffende klant.

In sectie #3 kun je meer informatie vinden over de betaling die voldaan is en in sectie #4 kun je de klant een bericht sturen.

Onderaan op de pagina zie je de diverse producten die besteld zijn en de kostenberekening. Wanneer je een factuur verzendt moet je zorgen dat deze voldoet aan bepaalde eisen. Je zult namelijk al snel opmerken dat je je eigen bedrijfsgegevens, inclusief KVK en BTW, niet op de factuur ziet staan. Wil je deze op de factuur vermelden dan ga je naar: “Instellingen” > “Winkelcontacten“.

Onderaan kun je jouw winkel gegevens invullen. De standaard PrestaShop-factuur zet hierna de gegevens in de footer van je factuur. Het is uiteraard niet de mooiste manier maar dan heb je in ieder geval wel alle verplichte gegevens op de factuur staan. Er zijn overigens ook plug-ins beschikbaar waarmee je de factuur kunt aanpassen (“Custom Invoice“).

3.4 Beheren van je klanten

In het linkermenu van het adminpanel kun je op de knop “Klanten” klikken. Ik ga hier niet al te veel op in omdat dit niet zo moeilijk is om te beheren. Je vind hier alle klanten inclusief alle bestellingen. Je kunt ook exact traceren welke producten populair zijn bij welke doelgroepen. Deze informatie kun je tevens gebruiken tijdens je marketingcampagne.

3.5 Het instellen van de betaalmethodes

Wanneer je in het menu op “Modules” > “Betalingen” klikt dan krijg je diverse mogelijkheden om online betalingen te ontvangen. Er zijn diverse mogelijkheden, waaronder Sisow. Bij deze instanties betaal je een klein bedrag per transactie. Je kunt tevens ervoor kiezen om een account aan te maken bij Moneybookers om gebruik te maken van de “Skrill” betaalmodule die ook al in PrestaShop zit. IDEAL betalingen kunnen hier makkelijk mee afgerond worden.

Het is zeker een aanrader om je volledig in de instantie te verdiepen. Zorg dat je van tevoren weet hoe alles in elkaar steekt en hoe je calamiteiten zo snel mogelijk kunt oplossen. Meer informatie over PSP’s kun je vinden bij de webwinkelcommunity.

Veel succes!

Veel succes met het opzetten van jouw webshop! Wil je graag jouw mening over PrestaShop delen of heb je problemen met het instellen van jouw webshop? Laat het ons weten!