Integrating The Wave2 Locator Into Your Website

Integrating The Wave2 Locator Into Your Website

Wave2 Locator integration is a fairly straightforward process.

Just follow these simple steps:
  1. Get your Site Integration Tag from the Wave2 Locator Portal.
    • Login to the Portal at https://portal.wave2.io/
    • Either click the blue Integration button on the main dashboard, and then on the Integration Dashboard click on the Site Integration Tag.
    • OR click Integration on the menu and then Basic Site Integration.

  2. Copy the displayed Site Integration Tag. It should look very similar to the following sample tag, but it will use your own branded URL.
       <div style="height: 800px"><script id="W2L" src="https://demolocator.wave2.io/load.min.js"></script></div>

  3. Open your website editor or Content Management System and open your locations page for editing. Be sure you are directly editing the HTML Source of the page, not just using a WYSIWYG-style editing view.

  4. Paste the Site Integration Tag above directly into your page HTML, directly where you would like the locator to appear.  

  5. The locator will take the position and size of its container element (for example a container DIV), and will responsively resize itself to fill that container as your site changes with mobile responsive CSS rules for different devices and screen sizes. 

  6. Important Note: The container that contains the Wave2 Locator MUST have a defined height; otherwise the locator will not know which height to use. That height definition can be responsive and dynamic or it can be static, but it must be defined. You can define height for the container in a number of ways - it can be defined in the container tag, or it can be defined by style tags, or it can be defined in the CSS of the site. In the example in #2 above, the height is defined by the surrounding DIV tag. You can edit the 800px value to set any reasonable locator height.
That's it!  After you publish your page, your locator should be live!

    • Related Articles

    • Adding a Website Location Search Feature

      Wave2 has website search support built right in, so adding a Location Search feature to your website, either in your homepage or across all pages in your header or footer, should be a fairly straighforward task. Just follow the steps below, and ...

    • Using the Wave2 Locator 3D Mapping Interface and Toolbars

      The Wave2 Locator features an intuitive, mobile-resonsive, ADA accessible, 3D interactive mapping experience that aggregates all of your own branches and ATMs, all of your surcharge-free ATMs, all of your shared branches, any other cooperative or ...

    • Wave2 Locator Admin Portal - Tracking and Reporting - Statistical Overview

      The Wave2 Locator Admin Portal offers extensive and detailed tracking and reporting, including a statistical overview screen, search option / search filter usage, reports on types of searches, on email, and SMS/text sharing, as well as search and ...

    • Wave2 Locator Admin Portal Navigation

      The Wave2 Locator Admin Portal gives you control over all your location details, locator configuration settings, locator style settings, images, branding, integration options, and more. Navigation is straightforward and is managed by a hierarchical ...

    • Wave2 Locator Admin Portal - Configuration - Showing / Expanding Search Filter Options On Load

      The Wave2 Locator Admin Portal makes it easy to configure your locator to automatically expand and show the "search options" search filter checkboxes inside the Search Panel. Expanded Search Options inside Search Panel You can set this Search Options ...