Add LocationCode to your own website
Two free widgets, no API key and no sign-up. Paste the HTML where you want the widget to appear, add the script line once per page, and you're done. Codes are worked out in the visitor's browser — we never store coordinates or codes.
1. Create a LocationCode
The visitor taps a button, their browser asks permission, and their LocationCode appears with a map, a copy button and a link to the full page. Choose which formats they can pick: standard, precise, 3d, a comma-separated mix, or all.
<div data-locationcode-widget="create" data-types="all"></div>
<script src="https://locationcode.me/widget.js" async></script>One format only
<div data-locationcode-widget="create" data-types="standard"></div>
<script src="https://locationcode.me/widget.js" async></script>A chosen mix
<div data-locationcode-widget="create" data-types="standard,3d"></div>
<script src="https://locationcode.me/widget.js" async></script>2. Look up a code and get directions
The visitor types any Standard, Precise or 3D LocationCode. The widget checks it, shows the place on a map and offers a directions button that opens their maps app.
<div data-locationcode-widget="lookup"></div>
<script src="https://locationcode.me/widget.js" async></script>Show your own place straight away
Add data-code to open the widget on a particular LocationCode — handy for a “find us” page — and data-title to change the heading.
<div data-locationcode-widget="lookup" data-code="HDK.SZF.VKD" data-title="Find our entrance"></div>
<script src="https://locationcode.me/widget.js" async></script>Options
| Attribute | Used by | What it does |
|---|---|---|
| data-locationcode-widget | both | create or lookup |
| data-types | create | all, or any of standard, precise, 3d separated by commas |
| data-code | lookup | A LocationCode to show as soon as the widget loads |
| data-title | both | Your own heading text |
| data-height | both | Starting height in pixels — the widget resizes itself afterwards |
Good to know
- • Your page must be served over https — browsers only share a location on secure pages.
- • You can put several widgets on one page; the script line only needs to appear once.
- • Nothing is stored: coordinates, heights and codes stay in the visitor's browser.
- • Maps use OpenStreetMap. Directions open in the visitor's own maps app or Google Maps.
- • Building something bigger, or doing bulk conversions? Use the LocationCode API.