Initialize

Step 1: Decide where you would like to place the plugin, then add an empty  <div> in the <body> section of your HTML. 

<div id="aa-control"></div>

Step 2: Once that's done you initialise the plugin using the snippet below. The snippet below shows a mimimal default implementation, which can be configured further according to your needs. 

<!DOCTYPE html> 
<html lang="en"> 
    <head> 
        <!-- Latest compiled and minified CSS --> 
        <link href="https://integrations.autoaddress.com/jscontrol/autoaddress-style.css" rel="stylesheet"/> 
        <!-- Latest compiled and minified JavaScript --> 
        <script src="https://integrations.autoaddress.com/jscontrol/autoaddress.min.js"></script> 
    </head> 
    <body> 
        <div id="aa-control"></div> 
        <script>         
            var aa = Autoaddress({ 
                apiKey: 'YOUR_API_KEY', 
                elementId: "aa-control"  
            });         
        </script> 
    </body> 
</html>

You should now see the Autoaddress plugin on your page ready to use.


Notes:

  • The code snippet uses an API Key for authentication - you should replace “YOUR_API_KEY” with one of your own API keys. Information on how to create an API Key can be found here.
  • The code snippet is initialised using an API Key, for illustration purposes. For greater security, Autoaddress recommends that you initialise the plugin using a Token, created on a back-end server, using the CreateToken endpoint.
  • The code snippet uses the default integration type of “Autoaddress form”, which replaces your address from with our one line search bar and localized address form.  The integration types "Combo" and "Inline" are also available which may be more suitable for your page design. More information around our integration types can be found here.