Wave2 Locator integration is a fairly straightforward process.
Just follow these simple steps:
- 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.
- 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>
- 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.
- Paste the Site Integration Tag above directly into your page HTML, directly where you would like the locator to appear.
- 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.
- 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!