Addressfinder for BigCommerce

The Addressfinder verification tag for BigCommerce adds address autocomplete, email, and phone verification to the checkout and account pages of your BigCommerce store.

Installation

Stencil theme (v2)

The v2 verification tag is only suitable for the optimised one-page checkout in the Stencil theme.
For express checkout or other themes, use the v1 verification tag.

1. Open your BigCommerce Admin Dashboard.
2. Click Settings in the sidebar.
3. Scroll down to the Advanced section
4. Click Data solutions.
5. Select Site Verification Tags and click Connect.
6. Copy the code snippet below and paste it into the input field.
7. Replace the ADDRESSFINDER_DEMO_KEY in the code snippet with your license key.
8. Click Connect to save your configuration, the autocomplete and verification service should now be working on the checkout and create account pages of your store.

Verification tag snippet for BigCommerce

<script>
(function(d, w) {
    w.AddressFinderConfig = {
        key: "ADDRESSFINDER_DEMO_KEY", // Replace this with your license key

        addressWidgetEnabled: true,
        emailWidgetEnabled: true, // Change this to false to turn off Email Verification
        phoneWidgetEnabled: true, // Change this to false to turn off Phone Verification

        auWidgetOptions: {
            address_params: {
                source: "gnaf,paf",
                post_box: "0" // Delete this line to allow Australian PO Boxes
            }
        },

        nzWidgetOptions: {
            address_params: {
                delivered: "1",
                post_box: "0" // Delete this line to allow New Zealand PO Boxes
            }
        },

        evWidgetOptions: {
            rules: {
                disposable: {
                    rule: "block",
                    message: "Disposable email addresses are not permitted."
                },
                role: {
                    rule: "allow"
                },
                public: {
                    rule: "allow"
                },
                unverified: {
                    rule: "block",
                    message: "This email address could not be verified. Check spelling and retry."
                }
            }
        },

        pvWidgetOptions: {
            defaultCountryCode: "AU",
            // allowedCountryCodes: "AU,NZ",

            rules: {
                unverified: {
                    rule: "block",
                    message: "Phone number not verified."
                },
                countryNotAllowed: {
                    rule: "block"
                },
                nonMobile: {
                    rule: "allow"
                }
            }
        }
    };

    w.addEventListener("DOMContentLoaded", function() {
        var s = d.createElement("script");
        s.src = "https://api.addressfinder.io/assets/bigcommerce/v2/boot.js";
        s.async = 1;
        d.body.appendChild(s);
    });
})(document, window);
</script>

To get a license key, sign up for a 30-day free trial.
Already have a subscription? Find your key in the Credentials section in the Portal.

The Addressfinder plugin for BigCommerce source code is also available on Github.

Older themes (v1)

As BigCommerce no longer supports BluePrint themes, we have also dropped our support for the Addressfinder-BluePrint plugin.

If you still use a BluePrint theme, you are welcome to follow the integration instructions below and test the plugin. If things work as expected then feel free to use the plugin, however, if testing reveals issues we suggest you remove it as we are not in a position to resolve these.

1. Log into the control panel for your site, and navigate to Store Setup > Design.
2. Your current theme will be displayed in the Themes tab; click Edit HTML/CSS to access your template files.
3. Install the plugin:
   1. Find the checkout_express.html file.
   2. Scroll to the bottom of the page.
   3. Copy the JavaScript snippet below and paste it in just before the closing </body> tag.
   4. Replace the ADDRESSFINDER_DEMO_KEY placeholder in the snippet you added in the previous step with your own Addressfinder keys.
4. Then, repeat step 3 for the files createaccount.html and shippingaddressform.html.

<script>
    (function(d,w){
      w.AddressFinderConfig = {
        key:"ADDRESSFINDER_DEMO_KEY"
      };
      w.addEventListener('DOMContentLoaded', function(){
        var s = d.createElement("script");
        s.src = "https://api.addressfinder.io/assets/bigcommerce/v1/boot.js";
        s.async = 1;
        d.body.appendChild(s);
      });
    })(document, window);
</script>

If you want to adjust the default behaviour of the widget, you may add additional options. For a list of possible options, see our Address Verification reference.

Example config with options

w.AddressFinderPlugin = {
key_nz: "ADDRESSFINDER_DEMO_KEY",
key_au: "ADDRESSFINDER_DEMO_KEY",
widgetOptions: {
    byline: false
}
};