Adjust Locator Styling

This set of instructions will require you to be using the MySLP Professional level of service or higher.   The Professional level includes the Experience add on that provides the Custom CSS rules interface.   Instructions here are specific to MySLP but will work for WordPress plugin users as well.

Get The Existing Style Rule

Open your website with your browser.

In your browser menu bar open developer tools.  This will open a developer section on your browser window.

Right-click on the element you wish to re-style.  This will show the page HTML and CSS rules in the developer window.

Select “Inspect Element”.

You will see the specific element highlighted in the HTML section of the developer window and the set of CSS rules that are applied to the element.

Right-click the top rule and select “copy”.  This will copy the entire rule including the CSS selector.

Modify The Rule Via Store Locator Plus

Login to your MySLP account or WordPress admin panel.

Go to Advanced Options in MySLP (Store Locator Plus in WordPress).

Select Settings | View from the menu.

Scroll down the page and paste the copied rule in the Custom CSS box.

You can now add to the rule using standard CSS notation.

Click Save.

View The Changes

Reload your web page.

Notes

Keep in mind many web hosts cache CSS.   Make sure you have cleared any proxy cache you have running as well as your browser cache.

A simple way to force your browser cache to reload (most of the time) is to hold down the shift key while clicking the “page reload” in your browser’s address bar.   Some browsers are overly-aggressive with caching (Safari!) and you may need to clear your history.

 

The Video

An example for our Weebly South Carolina Ice Cream site on how to tweak the CSS.

 

Featuring Locations – Top of Results and Highlighting

Store Locator Plus allows you to feature specific locations in your search results.   This requires the Experience add on for WordPress or a Professional or Enterprise account for My Store Locator Plus.    Some of the interface styles provided by the style gallery support featured location highlighting “out of the box”, such as the Default With Font Tweaks style.

Select A Style That Supports Featured Locations

The Default With Font Tweaks Style is one of the styles that highlights locations and is a good starting point for testing this functionality.  You can adjust the layout and styling afterwards to meet your specific design requirements.

WPSLP – Select the Store Locator Plus entry in the side menu.

MYSLP – Select Advanced Options in the side menu.

Go to the Settings Tab and select the View subtab.

Click on the activate button on Default With Font Tweaks in the style gallery.

Settings/View for styles

Continue reading “Featuring Locations – Top of Results and Highlighting”

Using Custom Map Markers

Store Locator Plus allows you to set a custom marker for all of your locations.

Upload Your Marker

Start by uploading the marker to a web accessible location.

WP SLP

Go to Media / Add New in the WordPress admin panel.

Upload your marker.

View the attachment details for the newly uploaded marker and copy the URL.
Continue reading “Using Custom Map Markers”

Make a Dial Link Phone number (clickable)

A check box under SLP/Experience/Results/Appearance titled “Use Dial Link for Phone” when checked makes the phone number in your locations results clickable to auto dial.  This feature is available  exclusively with the  Experience Add-on (also with Premier)

Experience Add on find this feature under Experience results panel
Experience Add on find this feature under Experience results panel

 

 

 

 

Q. What is meant by formerly named menu tab Experience in the User Interface (back end)

A. If you see the word Experience in the SLP back end you are not using the latest version of SLP. As of version 4.7.9 the menu tab formerly named “Experience” is now named Settings in Store Locator Plus . This change was made because of the confusion people had with the name in the menu and the Experience add-on.  The settings under this tab determine how the front end, that part of the plugin your site visitors interact with, looks and behaves. The settings under this  tab change how the plugin appears to the site visitor and what functionality is available to the site visitor. Some of the attributes set here can be overridden via shortcode attributes with the Experience Add-on.

Store Locator Plus Base free plugin under the OLDExperience tab
Store Locator Plus Base free plugin under the OLD Experience tab
SETTINGS Tab under version 4.7.9

Q. How do I change this heading “Dealers and Contractors” in the template of the Above & Beyond NyloBoard Rev 04 style?

You can do that with the Experience Add-on
Continue reading “Q. How do I change this heading “Dealers and Contractors” in the template of the Above & Beyond NyloBoard Rev 04 style?”

Hide Google Pegman (Street View)

Hide Street View is available as part of the Premier plugin included with the Premier Subscription for Store Locator Plus.  The Street View icon , also known as “pegman” appears on all Google Maps by default.  The Premier plugin allows you to turn this off.

Premier 4.5 Pegman Active
Premier 4.5 Pegman Active
Premier 4.5 Cluster Map Markers
Premier 4.5 Pegman Inactive

 

Turning Street View On or Off

Go to the Store Locator Plus Experience Map tab and look for Hide Street View in the Appearance group.

Premier 4.5 Experience Map Settings
Premier 4.5 Experience Map Settings

Cluster Map Markers

Cluster Map Markers is available as part of the Premier plugin included with the Premier Subscription for Store Locator Plus.   Cluster Markers show a single map marker graphics when two or more markers are within close proximity to one-another on the current map view.   As a user zooms in the clusters break apart to show individual markers.  When the zoom out the individual location markers combine into a single marker graphic with the count of locations represented by the graphic shown in the center.

Premier 4.5 Cluster Map Markers
Premier 4.5 Cluster Map Markers

Turn On Cluster Markers

Go to the Store Locator Plus Experience / Map tab and look in the Appearance section for “Enable Cluster Markers”.

Premier 4.5 Experience Map Settings
Premier 4.5 Experience Map Settings

Read the Store Locator Plus news articles about Cluster Map Markers.

Selecting and Customizing your Style

Store Locator Plus Appearance

Store Locator Plus comes with a variety of styles to provide a basic style framework that will attempt to match your locator page to various WordPress themes  installed on your site. You can see the list of  Plugin Styles under  the Store Locator Plus Settings Tab / View panel.

 

Continue reading “Selecting and Customizing your Style”