...
The basic setting for the store locator page can be found in; Stores -> Configuration -> MageSuite -> Store Locator
...
Field | Option | Comment |
|---|---|---|
Is Enabled | Yes/No | If disabled customer will be redirected to the Base URL. |
Meta title | Field is used to set meta tile for store locator page. | |
Meta description | Field is used to set meta description for store locator page. |
Backend
| Note |
|---|
In progress |
Controller
vendor/creativestyle/magesuite-store-locator/Controller/Index/Index.php:34
| Code Block |
|---|
class Index extends \Magento\Framework\App\Action\Action
{
public function execute()
{
$result = $this->pageFactory->create();
.....
if (!empty($this->configuration->getMetaTitle())) {
$result->getConfig()->getTitle()->set($this->configuration->getMetaTitle());
}
if (!empty($this->configuration->getMetaDescription())) {
$result->getConfig()->setDescription($this->configuration->getMetaDescription());
}
return $result;
}
} |
Frontend
Files structure
storelocator_index_index.xml is a store locator layout.
...
After clicking on a marker a popup with shop information is displayed.
...
Options (default values)
Option | Default value | Comment | ||
|---|---|---|---|---|
mapOptions → zoom | 7 | Initial zoom that is set when the map is loaded. It is usually quite small to show at least a greater part of an area where the majority of stores is located | ||
mapOptions → center | { lat: 51, lng: 9 } | Coordinates for initial central point of the map. By default they are set to show the most part of Germany. | ||
mapOptions → mapTypeControl | false | https://developers.google.com/maps/documentation/javascript/controls | ||
mapOptions → streetViewControl | false | https://developers.google.com/maps/documentation/javascript/controls | ||
mapOptions → fullscreenControl | false | https://developers.google.com/maps/documentation/javascript/controls | ||
basicZoom | 13 | Desktop basic zoom is set when the map centers on a specific location (for example when the user is geolocalized or when we pan to a specific store or a location) | ||
basicZoomSmallDesktop | 12 | Tablet/small desktop map zoom. | ||
basicZoomMobile | 12 | Mobile zoom. | ||
useDefaultMapStyles | false | When set to true default google maps styles are used. If not, styles from store-locator/ map-style.js file are used. | ||
markerIcons |
| |||
clusterStyles |
| Styles for clusters (circles that groups stores ans show their amount if there is no space to show all markers separately) | ||
limitOfShopsInitiallyDisplayed | 50 | Browsers may have problems with rendering hundreds or thousands of store in the sidebar. If there is a lot os subsidiaries limit is necessary to avoid performance problems | ||
storeData |
| Fields included in graphql call |
| Code Block |
|---|
mapOptions: {
zoom: 7, //
center: { lat: 51, lng: 9 },
mapTypeControl: false,
streetViewControl: false,
fullscreenControl: false,
},
basicZoom: 13,
basicZoomSmallDesktop: 12,
basicZoomMobile: 12,
useDefaultMapStyles: false
markerIcons: {
pin: {
sizes: {
x: 18,
y: 25,
},
},
pinAlt: {
sizes: {
x: 18,
y: 25,
},
},
pinActive: {
sizes: {
x: 18,
y: 25,
},
},
userLocation: {
sizes: {
x: 25,
y: 25,
},
},
},
clusterStyles: {
url: '',
height: 22,
width: 22,
textSize: 12,
textColor: '#fff',
backgroundPosition: 'center',
},
limitOfShopsInitiallyDisplayed: 50,
storeData: `
name
latitude
longitude
city
street
postCode
description
sourceCode
countryId
phone
fax
email
url
`, |
...