NearPlace

Join 1,400+ marketers, founders, UX designers, and software engineers and receive our next insights:


July 2018
M T W T F S S
« Jun    
 1
2345678
9101112131415
16171819202122
23242526272829
3031  

Categories


How To Add a Store Locator or Google Maps to BigCommerce as a Script.

NearPlaceNearPlace

Fast How-to

  1. Go to BigCommerce.com.
  2. Create an account/log into already existing one.
  3. Go to the StoreFront tab.
  4. Go to My Themes tab.
  5. Display advanced options for your current theme.
  6. Make a copy of the theme.
  7. Display a list of available options on a copied theme.
  8. Click “Edit Theme files”.
  9. Display template files.
  10.  Display layout files.
  11.  Go to base/header.html depending on the theme.
  12. Get the code from the Nearplace SaaS.
  13.  Paste your generated Nearplace code before </body>.
  14.  Your store locator or Google Maps is installed.

About the BigCommerce

Let’s start with the most important question – what is BigCommerce? BigCommerce is another well-known e-commerce software for businesses next to the Shopify and Weebly. It allows you to create your own store website on which you can advertise and sell your products, services and whatever you want. Since the platform is not free, if you want to try the software you have available 14-day trial which does not require your credit card. Of course, when it comes to the multiple stores you should get a store locator with an interesting map. Many people are using Google My Maps to make their own store locator, but if you want the best and relatively cheap store locator app you should try Nearplace. Also in this tutorial, we are going to use the Nearplace as an example of the installing a store locator or Google Maps on the BigCommerce.

BigCommerce-interface


Store locator app – Installation

Everyone would like to easily manage their multiple store locations but to do it you need to install a professional app like a Nearplace. Whatever it is, a store locator or Google Maps, steps of installation with JavaScript code are the same. At first, you need to have an account and your own theme. We will use a default theme on a trial account so it will be easier for you if you just started your journey with the BigCommerce.

Actually, the process of the installation of a store locator thanks to the code is really simple. On the left side, you can notice a menu. Choose a “Storefront” tab and once the tab is expanded, go to “My Themes”. Once you see your current theme, to edit its files you should expand advanced options, and choose “copy a theme”. If the theme is copied already, choose “Edit Theme Files”.

bigcommerce-store-locator-code-edit

Now you might be a little bit afraid of the number of available files to edit. No worries you are interested only in templates>>layouts>>base/header.html (depends on the theme) file. In our case it is base.html.

BigCommerce-edit-code

Now you only need to find the end of a <body> section so it will be </body> if you are not acknowledged with HTML. Now if you want to add a Nearplace store locator you need to paste a special JavaScript which you generate in your special Nearplace admin interface.

nearplace-store-locator-code-generate

Then you paste the code and you check in the preview if the installation of a store locator or Google Maps has ended successfully or not.

BigCommerce-store-locator-script-installation

Of course, if we are doing a guide about the store locator installation on BigCommerce it worked with our theme :). Remember to apply your theme with changed files.

BigCommerce-apply-theme

Everything looks pretty simple but if you are going to struggle with something don’t be afraid to leave a comment or type to our support for professional tips. Also, leave us a feedback if we are missed something important.