Installing Stockist Store Locator on Wix

Stockist works with Wix, and offers a simple way to add a store locator to your Wix website.

Adding Stockist to your Wix site

To add your store locator to a page on your site, follow these steps:

  1. In Wix, click Edit site and navigate to the page where you'd like to add your locator
  2. In the Wix editor, click the Add button to add a new component:
  3. Choose the Embed category:
  4. Under Custom Embeds, find the HTML iframe element:
  5. Drag an HTML iframe element into your page where you'd like the locator to appear:
  6. Move and resize the HTML element however you'd like, then click on the element and choose Enter code:
  7. In your Stockist Store Locator dashboard, open the Installation > Embed code page and copy the HTML snippet shown there.
  8. Back in the Wix editor, paste the snippet into the code box:
  9. Click Apply to save the code, and your locator should now appear in the page.

Adjusting the font

Unlike other website platforms, Wix doesn’t allow you to add HTML code directly into your page. Instead, embedded apps like Stockist can only be added inside a container called an "iframe".

This limitation prevents Stockist from automatically using the styles from the rest of your site like the font and text color. As a result, your locator may use your browser’s default text styles, which don’t fit with your site.
This can be fixed by adding a custom style rule in your Stockist account to change the font. To use a nicer font, you can paste the following code into the Custom CSS box on the Settings > Appearance page of the app dashboard: 
#stockist-widget {
  font-family: -apple-system, BlinkMacSystemFont, avenir next, avenir, helvetica neue, helvetica, Ubuntu, roboto, noto, segoe ui, arial, sans-serif;
}