Fetchify Documentation

Shopify Plus Integration Guide

Integration with Shopify Plus address forms made simple

A step-by-step guide to integration with Shopify Plus address forms.

If you have a standard Shopify store, click here.

Installation

We offer plugins for Address Auto-Complete (global address lookup for over 240 countries) and Postcode Lookup (UK only).

Select the plugin you would like to install.

Note

Installing Address Auto-Complete and UK Postcode Lookup at the same time is not supported and attempting to do so causes multiple issues.

Install Address Auto-Complete

Step 1

In the admin panel for your store, you can add in our custom code to the checkout's layout. This can be found in Online Store / Themes / Your theme > Edit HTML / CSS.

Then, if you don't have the checkout layoutopen in new window existing yet, add a new layout (from checkout). Otherwise, use the already existing checkout.liquid file.

Note

Changes made to the checkout.liquid file will not take effect unless it has been activated by Shopify. Instructions on how to do this can be found hereopen in new window.

Find an ideal place (we suggest just before the end body tag) and copy and paste the following code snippet to allow our extension to load on the page. Replace xxxxx-xxxxx-xxxxx-xxxxx with your real access token.

<script type="text/javascript">
//CONFIGURATION
var c2a_config = {
	active: true,
	showLogo: false,
	access_token: 'xxxxx-xxxxx-xxxxx-xxxxx',
	position: 0, // 0 - new input field for search, 1 - uses address line 1 for search
	hideFields: 0, // 0 - do not hide address fields, 1 - hide address fields
	countrySelector: true,
	enabledCountries: [],
	countryLanguage: 'en',
	design: {
		mode: 1,
		ambient: 'light',
		accent: 'default'
	},
	texts: {
		country_button: 'Select Country',
		country_placeholder: 'Type here to search for a country',
		default_placeholder: 'Start with post/zip code or street',
		placeholder_country_overrides: {},
		generic_error: 'An error occured. Please enter your address manually',
		no_results: 'No results found',
		search_label: 'Address Search'
	},
	_enable_phone_validation: false, // Set to true if you want to use our phone validation service
	_enable_email_validation: false,
	excludeAreas: [],
	transliterate: false,
	beforePopulate: function(c2a, elements, address) {
        // Perform any action here with the available data.
        // For example, you may want to alter part of the address before the address fields are filled.
    },
	phone: {
		ignore_nonnumeric_chars: false,
		beforeCorrect: function(element, result) {
			// Perform any action here with the available data.
			// For example, you may want to modify part of the phone number before the field has been populated with the corrected phone number.
		}
	}
};
</script>
<script src="https://cc-cdn.com/generic/scripts/v1/cc_c2a.min.js" type="text/javascript"></script>
<script src="https://cc-cdn.com/shopify/scripts/v1/cc_c2a_shopify.js" type="text/javascript"></script>

Step 2 (Optional)

Edit the other configuration options in the code snippet to customise the search interface to suit your checkout.

A quick customisation guide can be found here.

Install UK Postcode Lookup

Step 1

In the admin panel for your store, you can add in our custom code to the checkout's layout. This can be found in Online Store / Themes / Your theme > Edit HTML / CSS.

Then, if you don't have the checkout layoutopen in new window existing yet, add a new layout (from checkout). Otherwise, use the already existing checkout.liquid file.

Find an ideal place (we suggest before the end body tag, right after the tracking code) and copy and paste the following code snippet to allow our extension to load on the page. Replace xxxxx-xxxxx-xxxxx-xxxxx with your real access token.

<script type="text/javascript">
//CONFIGURATION
var cc_config = {
	// CONFIGURATION (REQUIRED)
	_cp_access_token : 'xxxxx-xxxxx-xxxxx-xxxxx',
	// CONFIGURATION (OPTIONAL)
	_cp_hide_fields : false, // Hide address fields until result selected
	_cp_button_below_postcode : false, // Place the 'Find Address' button below the postcode field rather than next to it - true/false
	_cp_button_text : 'Find Address', // Text displayed on the lookup button
	_cp_button_class : '', // Class applied to the button
	_cp_busy_img_url : '', // The url of the image to show while waiting for lookup results, e.g. a spinning wheel
	_enable_phone_validation: false // Set to true if you want to use our phone validation service
};
</script>
<script src="https://cc-cdn.com/shopify-uk/scripts/v1/shopify_crafty_clicks.js" type="text/javascript"></script>
<script src="https://cc-cdn.com/generic/scripts/v1/cc_c2a.min.js" type="text/javascript"></script>

Step 2 (Optional)

Edit the other configuration options in the code snippet to customise the search interface to suit your checkout.

FAQ

Do you have a Shopify App?

We do have a post-checkout address check and validation app for Shopify Basic, Shopify and Shopify Advanced stores. This app is available to install directly from the Shopify App Marketplace. Due to restrictions on cart modifications by Shopify this app works in a very different way to our normal product but is currently the only address verification option available in non-Shopify Plus stores.

You can find more information about the app, and install it to your store, hereopen in new window.

Why does the integration require Shopify Plus?

While in the past we supported Shopify's basic version, a recent change (February 2019) has resulted in Shopify locking down the checkout entirely for non Shopify-Plus merchants.

Shopify allows Plus merchants to customise the template for the Checkout, so Shopify Plus merchants still have the capability to add in UK Postcode Lookup, or similar checkout improvements to their store.

Questions

  • Do you offer support? Yes, we do offer support during normal business hours in the UK. If you run into any issues, let us know and we will be happy to help.
  • Is this free? The extension is free to download and try, but to use it on a live site you will need a paid account with us.
  • Do I need to sign up for an account to try it? Yes, you’ll need a trial account, at least. You can easily sign up for a free trial account.