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  Locator Styles under  the Store Locator Plus Settings / View panel. The inner slide bar will show you more.

SLP SaaS view

Locator Styles vs Theme Files?

SLP Locator Style files are simple CSS files that go into the CSS directory. The header of the files is a comment block. The comments can be as simple as the file name, the label, and the description.   The layout of the header is important.  It follows the same syntax as WordPress plugin readme files and uses the built-in file header processor in WordPress to store extra data about the CSS files. This data is read and processed for display on the Settings / View panel.

Note: WordPress suggests: Before editing any of your WordPress files, BACKUP! And Work from Backups 

Work from copies of backup files when possible and/or make sure that you backup your information frequently as you work and make changes. Keep backups in a safe place.

SLP styles with Advanced Layouts

The Advanced Plug-In styles options will be evident if you have  MYSLP Professional or Enterprise Level or if using SLP plug-in the  Power , Experience or a Premier Subscription.   A brief description of the Add-ons/features that work best with the selected SLP style will appear  under the SLP Settings/View tab Gallery Style.  With the Experience or Premier Add-ons you can change the look of your location search page or results layout, and/or map.  Put the map on top with search and results below. Or on the side. Or hide it. Or you can select a style to highlight featured locations. There is probably a style perfect for you but if not you can further customize it with the Power Add-on when used with the Experience Add-on (a CSS box will appear Under View).

Gallery Styles

Pre-selected with one click built in layouts. If you are a premier or enterprise level customer you can ask for your particular style to be added to the gallery. Premier customers, use the contact us form to request your style! Feeding America Styles are also included with tMySLP SaaS plans

Creating your own Custom /Advanced Style

Advanced styles are designed to enhance your premium add-on user experience.

Whenever an Advanced Style is selected a list of Preferred Settings will be displayed on the style panel.  Implement the Preferred Settings by clicking Save Settings.    The Plugin Style features provide a simple 2-click operation to change the entire layout of the Store Locator Plus interface. You can also customize or create your own plugin style. If your style is no longer available and you are a Premier customer, search under Gallery Style for comparable styling or contact us.

How to Customize the Plug-in Style Sheet using Store Locator add-ons or the MYSLP Professional and above Plans.

The built-in Store Locator Plus CSS rules tend to take precedence over most basic HTML elements. The easiest way to ensure your Custom CSS rule is invoked is to provide a higher level of specificity in your CSS definition. In simplest terms this means that the CSS definition div#div_id input.class { blah; } will be more likely to take precedence over the applied style than simply using input.class or .class. The more “details” added the better the match for the CSS engine and more likely that the CSS engine will apply your definition (rules) to the output.
[youtube https://www.youtube.com/watch?v=6f9WGGNWSUM?list=PLRaMvRNJJlzgYJQ5N5qj0D3ZHw3gYHOwq&w=560&h=315]