Naar de hoofdinhoud
Alle collectiesPlus+ Add-ons
Productpage preview
Productpage preview
Nick Paul avatar
Geschreven door Nick Paul
Meer dan 9 maanden geleden bijgewerkt

Een mini productpage op je collectiepagina, dat is nice! πŸ›οΈ

Met de quickshop add-on kan de klant al bestellen op de collectiepagina's alsof hij op de productpagina zit!

"Een snelle weergave op de collectiepagina, zonder dat de klant naar de productpagina moet, is dat te ontwikkelen?" dat was een veel voorkomende vraag. Geïnspireerd door jullie feedback! Hier is hij dan, de Quickshop add-on. 🀝
​
Met deze add-on maak jij het mogelijk voor de klant om varianten te selecteren vanaf de collectiepagina's, informatie in te lezen en reviews te bekijken. Als het ware een slide-in mini productpagina! De klant hoeft hierdoor niet meer naar de productpagina te navigeren om een variant te selecteren en informatie op te doen πŸ”Ž

Installatie πŸ› οΈ
​

mceclip0.png


Om deze add-on te installeren is er wel een implementatie nodig van een ontwikkelaar. Het kan dus eventjes duren voordat de add-on actief is. Klik simpelweg op "Add-on aanvragen" en laat Plus+ onze development helden op de hoogte brengen. πŸ‘¨β€βš•οΈ
​
Nadat je op "Add-on aanvragen" hebt geklikt, zou je worden doorgestuurd naar de pagina "Mijn Plus+ add-ons". Tevens zie je de volgende melding verschijnen in de rechterbovenhoek van het dashboard.
​

mceclip3.png


​
​Add-on instellingen/overzicht βš™οΈ
Na de installatie zul je zien dat de add-on in je overzicht staat, inclusief installatiedatum en status.
​
Bij deze add-on zou de status eerst op "Open" staan, dit komt omdat de developers eerst de code zouden moeten toevoegen aan jouw webshop.

Zodra de developers hier mee bezig zijn zou je de status zien veranderen in "Work in progress"

Als de developers de code hebben toegevoegd word deze status op "inactief" gezet, zodat jij hem eerst goed kan instellen en dan kan activeren!βœ…
​

Om de add-on te activeren klik je op het hamburger menu en kies je "activeren". Liever eerst een preview zien in test modus? Dat kan. Klik op "Activeren in preview-modus" en de add-on zou alleen zichtbaar zijn voor jou. Dus niet voor de klanten!
​

mceclip5.png


​
​Instellingen βš™οΈ
​

Algemeen πŸ›’

De algemene instellingen die nodig zijn om de add-on te laten werken, tevens zorgt dit voor de mogelijkheden op je quickshop pagina.
​
β€‹πŸ›’ Toon 'korte productomschrijving':
Is er een korte omschrijving beschikbaar van het product? Zo ja, dan kan je deze laten zien door de knop te activeren. Zo kan de klant de belangrijkste informatie al meteen zien! πŸ˜„
​
β€‹πŸ›’ Toon merk:
Wil je het merk laten zien op de quickshop? Zo ja, dan zal dit in vorm zijn van een linkje, als de klant er op klikt word hij doorgeleid naar de overzichtspagina van het betreffende merk.
​
β€‹πŸ›’ Toon review sterren:
Is jou product de ster? Laat de gemiddelde reviewscore meteen zien op de quickshop!
​
β€‹πŸ›’ Toon levertijd:
Levertijden zijn onmisbaar natuurlijk, wil je de levertijden ook communiceren op het quickshop element? Activeer dan deze setting.
​
πŸ›’ Toon een icoon voor de levertijd tekst:
De levertijden zijn er natuurlijk in verschillende teksten, wil je daar nog een icoontje voor zetten? Ziet er wel een stuk leuker uit! 🎨
​
πŸ›’ Icoon:
De setting hierboven geactiveerd? Kies hier de styling van jouw icoontje!


Variant dropdown πŸ›’

Met de variant dropdown instellingen bepaal je wat er getoond word in deze dropdown.
​
β€‹πŸ›’ Titel 'Kies uitvoering' tonen:
Wil je een titel boven de dropdown laten zien? Activeer deze setting.
​
β€‹πŸ›’ Toon varianten die niet op voorraad zijn:
Wil jij de uitverkochte varianten zichtbaar maken? Dan word de variant in de dropdown weergegeven als 'Tijdelijk uitverkocht'. (Tipje, uit laten staan als je The Perfect Stock gebruikt!) Zet deze setting dan aan.
Wil je het niet tonen? Laat hem dan uit staan.
​
β€‹πŸ›’ Toon beschikbaarheid met voorraadaantallen:
Heel simpel, wil je de exacte voorraad laten zien? Dus bijvoorbeeld: 'Nog 3 op voorraad'
​
β€‹πŸ›’ Toon aantal bij een maximale voorraad van:
Wanneer wil je dat de bovenstaande optie ingeladen word? Welke voorraad moet er actief zijn? In het voorbeeld word gesproken over 3, dus ligt de voorraad op 3 of lager, dan word de exacte voorraad weergegeven.
​
β€‹πŸ›’ Toon product thumbnail:
Heel simpel, wil je de productafbeelding van de variant laten zien? Voor varianten zonder afbeelding word de hoofdfoto van het product ingeladen.
​
β€‹πŸ›’ Toon altijd standaard productafbeelding:
Activeer deze instelling als je een productafbeelding wilt tonen in de dropdown voor varianten die geen afbeelding actief hebben (dit is standaard de eerste afbeelding van het product).
​
β€‹πŸ›’ Toon standaard eerste variant:
De klanten het nog makkelijker maken? Selecteer vast de eerst beschikbare variant voor de klant, zonder dat hij/zij dit zelf hoeft te doen.

Prijs instellingen πŸ›’

Met de prijs instellingen kan je de prijzen op exact de goede manier laten weergeven op basis van jouw thema, dit wilt nog wel eens verschillen per thema. Zo kan jij alles gelijk trekken.
πŸ›’ Toon ,00 achter de komma:
Heel simpel, moet er een ,00 worden toegevoegd achter de komma als de prijs rond is?
​
πŸ›’ Toon valuta-teken:
Wil je het valuta teken voor de prijs laten zien? Activeer dan deze optie.
​
πŸ›’ Toon spatie tussen valuta-teken en prijs:
Heb je het valuta teken actief? Dan kan je natuurlijk altijd nog kiezen om een spatie tussen de valuta en de prijs te zetten.


The Perfect Stock πŸ›’

Wat is een add-on als deze nou zonder de perfect stock? Bepaal met de volgende setting of je de stock notifier wilt tonen in de quickshop.
​
β€‹πŸ›’ Toon envelop-icoon:
Zoals hierboven al gemeld, heb je de toon varianten die niet op voorraad zijn aan staan? Dan zal de perfect stock hier mee werken.
Wil je voor de tekst nog een envelop icoontje laten zien? Activeer dan deze instelling.

Design instellingen πŸ›’

Met de design instellingen bepaal jij de vormgeving van de quickshop. Stel hem dus in naar jouw huisstijl en smaak!
πŸ›’ Toon button op desktop:
Als je deze instelling activeert, dan verschijnt er een button/label op de productcards waar men op kan klikken op de quickshop te laten zien.
​
πŸ›’ Positie button horizontaal desktop:
De naam van de setting zegt het al, op welke positie wil je de button hebben, is dit links of rechts?
​
πŸ›’ Positie button verticaal desktop:
Netzoals de bovengenoemde setting, de naam van de setting zegt het al, op welke positie wil je de button hebben, is dit boven of beneden?
​
πŸ›’ Afstand tot rand horizontaal/verticaal desktop:
Stel met deze settings de positie van de button in, zodat hij niet geblokkeerd word door andere elementen op de productcard.
​
πŸ›’ Positie button horizontaal mobile:
De naam van de setting zegt het al, op welke positie wil je de button hebben, is dit links of rechts?
​
πŸ›’ Positie button verticaal mobile:
Netzoals de bovengenoemde setting, de naam van de setting zegt het al, op welke positie wil je de button hebben, is dit boven of beneden?
​
πŸ›’ Afstand tot rand horizontaal/verticaal mobile:
Stel met deze settings de positie van de button in, zodat hij niet geblokkeerd word door andere elementen op de productcard.

Kleur instellingen πŸ›’

Met de kleur instellingen bepaal jij de styling van het label en de button op de productcard. Stel hem dus in naar jouw huisstijl zodat alles in 1 lijn klopt! πŸ˜„
πŸ›’ Toon schaduw:
Wil je dat de lichte schaduw verschijnt achter het labeltje voor de quickschop? Dit kan je doen om hem er net wat meer uit te laten springen. Activeer dan deze setting.
​
πŸ›’ Button achtergrondkleur:
De naam van de setting zegt het al, welke achtergrondkleur moet de button krijgen?
​
πŸ›’ Button textkleur:
Net zoals de bovengenoemde setting, de naam van de setting zegt het al, welke kleur moet de tekst in de button krijgen?
​
πŸ›’ Button randkleur:
Wat toevallig zeg, ook deze setting geeft al aan wat het doet. welke kleur moet de rand van de button krijgen?

Vertalingen πŸ›’

Binnen deze add-on word gebruik gemaakt van vertalingen, hiermee kun je de tekst van de add-on aanpassen naar je eigen tekst. Dit kan je doen door de gewenste vertaling in de tekstvelden neer te zetten.


​
​
​

Was dit een antwoord op uw vraag?