BigCommerce Installation Guide

Overview

The AutomaticFFL ™ Checkout App replaces the One-Page Optimized Checkout of a BigCommerce store with one that makes it convenient for customers to ship their purchased firearms to their local FFL (Federal Firearms Licensee). The application provides facilities for the store owner to define which products must be shipped to an FFL, and which FFLs they can be shipped to.


Customers of the store are provided with an FFL locator powered by Google Maps. The locator is presented to the customer on the checkout page, and allows them to easily search for, and select the FFL of their choice. Customers are unable to from complete any firearms-related purchase without first selecting an FFL.

Installation is Easy as 1-2-3

Get the App from the BigCommerce App Store
Add a payment method to your AutomaticFFL account to start your 30-Day Free Trial
Redirect your checkout to the AutomaticFFL custom checkout
Note: You must be the owner of a BigCommerce store to install apps.

Installation Guide

Get The App

  1. To begin the installation process, log in to your BigCommerce storefront portal at bigcommerce.com.
  2. Locate and click on the Apps tab in the sidebar to the left.
  3. You should now be on the Apps page. Click the button that reads “BIGCOMMERCE.COM/APPS” to be taken to the BigCommerce App Store.
  1. Use the search bar at the top of the page to lookup “Automatic FFL.”
  2. Click on the Automatic FFL Checkout app out of the list or results. On the application page, click the Install button.  You will be redirected back to your storefront portal with the option to add the application to your store.
  3. If you wish to proceed, click the Install button once more. The app will now request permission to access a number of store features. You must accept the terms and conditions to continue.
  4. Once you’ve agreed to the terms of service, click the Continue button to complete the application installation process.

Add Payment Method

  1. Navigate to the App Control panel within your BigCommerce store admin panel by clicking Apps > AutomaticFFL
  2. Edit your profile information including a billing address
  3. Edit your payment information by adding a credit card Note: Your credit card will not be charged until the end of your 30 Day trial period

Redirect Checkout

  1. Follow the instructions to run the custom checkout, in this way you be able to customize the checkout the way you want.
  2. Once you have the application running, go to your store under Advanced Settings > Checkout.
  3. Select Custom Checkout.
  4. Roll down until “Custom Checkout Settings.”
  5. Paste https://app.automaticffl.com/big_commerce/checkout/auto-loader.js into the Script Url box.
  6. Check This checkout supports Optimized One-Page Checkout settings. checkbox, and click SAVE.
  7. Clear your browser cache and your new checkout will appear.

Inventory Management

For the application to properly identify firearms and shipping-restricted products, the store owner must first flag them with a specific custom field and value. This can be done in the store control panel under the Products tab.

Simply click on the action menu and select Edit. Once you’ve begun editing a product, you can scroll down to the Custom Fields section.

Then, add a custom field with the name ‘FFL’ and the value ‘Yes’. Click the Save button to confirm your changes. It will now be restricted to FFL shipping.

This process can be simplified with BigCommerce’s bulk edit to easily update the entire catalog.

Customizing Dealer Settings

See how you can customize your dealer list here.

Customer Experience

After installing the app, your optimized one-page checkout will be replaced with the Automatic FFL Checkout application. Depending on the contents of a customer’s cart, extra steps will be added to the checkout process. These steps ensure that products restricted to FFL shipping cannot be shipped (intentionally or otherwise) directly to the customer’s shipping address.

If a customer has added a product to their cart that can only be shipped to an FFL, a button to open an FFL locator will appear at the top of the checkout. A prompt will then appear instructing them to use the locator to select the FFL of their choice.

Clicking on ‘Select Your Dealer’ will open the locator. Using Google Maps, the customer can then search any location to find FFLs within a specific radius.

After searching, a list of any FFLs in the area will be displayed. If the customer fails to select an FFL, they will not be able to complete the checkout process so long as the restricted product remains in their cart.

Once a customer has successfully selected an FFL, the shipping information of that dealer will be automatically loaded into the checkout. All FFL-restricted products will then be assigned to that shipping address. If a customer has purchased both restricted and non-restricted products, the checkout app will automatically separate them. Restricted products will end up being shipped to the FFL, while any non-restricted products will be sent to the customer’s supplied shipping address.

Styling

The application will do its best to match the store’s styling by using the active Stencil theme. If for any reason it clashes, the store owner can style any element they’d like using the attached CSS classes. A developer can find these classes attached to the elements on the checkout page.

Locator

Editing the store theme will also allow you to display the FFL locator on pages other than the checkout. Adding an HTML div with the id of ‘ffl-locator-component’ to any page in your Stencil theme will cause the locator to appear in that element.

When used outside the checkout, the locator will work with any Stencil theme based on Cornerstone from BigCommerce. Deviations from the styling standards of that theme will cause the locator to experience issues, such as appearing outside the page, or stretching the view of the store. These issues can be solved by a developer, but will require custom styling based on your store.