De plugin WordPress Store Locator instellen
Instellingenpaneel
Je vindt alles in je beheerpaneel onder Store Locator -> Settings. Zie je dat menu niet, controleer dan of de plugin Redux Framework is geïnstalleerd en geactiveerd!
Algemene instellingen
In de algemene instellingen schakel je eerst de plugin in. Daarna vul je je Google API-sleutel voor de frontend in (haal hem hier op). Controleer ook of je je API-sleutel goed hebt ingesteld in de Google Console:
- Geef je domein toegang tot de sleutel
- Inschakelen: Google Places API Web Service
- Inschakelen: Google Maps JavaScript
- Inschakelen: Google Maps Geocoding
Je kunt ook een serversleutel instellen. Die wordt alleen gebruikt bij het importeren van winkels zonder breedte- / lengtegraad, om die gegevens direct bij Google op te halen.
Hieronder kun je…
- Alle winkels exporteren
- Winkels importeren
- Een voorbeeldbestand voor de import ophalen (gebruikt je categorieën / filters)
- Alle winkels verwijderen
Kaartinstellingen
Eerst schakel je de kaart in of uit. Daarna stel je een breedte en de afstandseenheid (mijlen of kilometers) in. Vervolgens een paar standaardwaarden: breedtegraad, lengtegraad, kaarttype en zoomniveau.
Voor de straal stel je de keuzestappen in, gescheiden door komma’s, plus een standaardstraal. Ook kies je of er een cirkel voor de straal wordt getekend en of de kaart wordt vergroot als er geen winkels zijn gevonden.
Stel een paar standaardiconen voor de winkels in (ook als je een icoon per categorie of per winkel hebt ingesteld). De logica voor iconen is als volgt:
- Heeft een winkel een eigen icoon -> dat wordt gebruikt
- Is er een eigen categorie-icoon ingesteld:
- Staat een winkel in maar één categorie -> dat icoon wordt gebruikt
- Heeft een winkel meerdere iconen, dan verandert het icoon pas als in de frontend een categorie is gekozen
- Is er geen winkel- / categorie-icoon -> het standaardicoon wordt gebruikt
Onderaan style je de kaart naar wens met eigen JS-stijlen. Voorbeelden vind je op https://mapstyle.withgoogle.com of https://snazzymaps.com
Instellingen voor het infovenster
Het infovenster (als je op een winkel klikt) kun je in- of uitschakelen. Staat het aan, dan stel je een eigen breedte in. Daarna bepaal je de kolomindeling voor de details, de afbeelding en de openingstijden.
Instellingen voor de resultatenlijst
Schakel je de resultatenlijst in, dan kies je een positie (linker- / rechterzijbalk, boven / onder de kaart). Ook kies je de volgorde, de breedte en of je de titel toont.
Daarnaast stel je in…
- een tekst ‘Geen resultaten’
- Maximum aantal resultaten
- Actie van de winkellink
- Icoon in de resultatenlijst tonen
- Premiumicoon in de resultatenlijst tonen
Instellingen voor het zoekvak
In de instellingen voor het zoekvak toon je de link ‘Mijn locatie bepalen’, de zoekknop, de zoektitel, het actieve filter of alle filters. Ook stel je een standaardcategoriefilter en een knoptekst in.
Daarnaast kun je:
- Automatische geolocatie inschakelen
- Automatische geolocatie in een cookie opslaan
- Automatisch aanvullen inschakelen
- Types beperken
Je kunt de resultaten van Place Autocomplete tot een bepaald type beperken. Wil je bijvoorbeeld straten verbergen, kies dan “Regions” - Automatisch aanvullen tot één land beperken (alleen ISO-codes van 2 tekens! Met bijvoorbeeld “nl” zoek je alleen in Nederland)
- Positie
- Breedte (in kolommen)
Laden
Terwijl winkels worden opgehaald, verschijnt een laadicoon. Met onze plugin pas je dat icoon volledig aan: nieuw icoon, kleur, achtergrondkleur en meer.
Te tonen gegevens
In totaal bepaal je voor 20 verschillende gegevens of ze verschijnen, bijvoorbeeld de naam van een winkel, de beschrijving, website, afbeelding, openingstijden…
Hier schakel je ook de call-to-actions in of uit. Die verschijnen als knoppen in de resultatenlijst.
WooCommerce – Store Locator-knop
Heb je een WooCommerce-shop, dan kun je de Store Locator-knop op productpagina’s tonen. In de instellingen van de knop kies je waar hij verschijnt en hoe de modal eruitziet.
Standaardwaarden voor winkels
Met standaardwaarden maak je eenvoudig winkels die steeds dezelfde gegevens hebben (zoals een website, land of openingstijden). Stel een standaardwaarde in en die wordt ingevuld telkens als je handmatig een winkel aanmaakt.
Geavanceerde instellingen
Hier voeg je eigen CSS of JS toe. Heb je problemen met de lay-out, dan kun je hier ook Bootstrap uitschakelen.