Loading...

CS-Cart 'Store locator' block

PART 1

In order to add CS-Cart "Store locator" block.

Step 1

  • Sign in the administration panel;
  • Go to the Administration tab;
  • Click on the Add-ons link;
  • Choose the Active status in the select box of the Store locator add-on;
  • Click on the edit link of the add-on;
  • Insert your Google Maps API key* in the Google key input field;
  • Click on the Save button.

*In order to get Maps API key follow this link http://code.google.com/apis/maps/signup.html (you need to have Google Account).

Step 2

  • Go to the Content tab in the top menu of the Administration panel;
  • Click on the Store locator link;
  • On the right side click on the Add store location button;
  • Specify the necessary fields;
    • Name: insert the name of the store;
    • Position: specify the store position in the list;
    • Description: insert the description of the store;
    • Country: select country in the select in the drop down list;
    • City: insert city name;
    • Coordinates: specify coordinates or click on Select button, this will open window with a map.
  • Mark the needed place by clicking on it and click on Set button. Coordinates will appear automatically.
  • Click on the Create button.

Step 3

  • Go to the Design tab;
  • Click on the Blocks link;
  • Go to the All pages tab;
  • Click on the Add block button;
  • This will open the window where you should insert the following information:
    • Block name (e.g. Store address).
    • Open Block content dropdown list, go to Standard side box section, choose Store locator.
    • In the Group* select box choose the position (top, central, bottom etc.)
    • * For CS-Cart version 2.0.x the position variants are placed in the Position select box.
    • In the Wrapper select box choose the template for displaying the block.
    • Click on the Create button.

*The Find our store block will be displayed in the storefront.

Customer can enter the store name, city or country in the input field in this block and click on the Search button to see your store closest to him on the map.

Check how the block is displayed with the chosen wrapper after you've created it.

PART 2

How to make a "store locator" link accessible from the "top menu"

After you have enabled the Store Locator Add-on and created a block Store Location as it's described above:

  • Go to the customer's area;
  • Click on the search arrow below the Store Locator block;
  • The Google map will appear;
  • Copy the URL of this page with the map;
  • Go to the administration panel;
  • Open the Design tab => Top menu tab;
  • Click on Add item button;
  • Enter the desired name of the tab, for example, Store Location in the Link text input field;
  • Click on Create button.

In case you want to display a "store locator" link only from the "top menu":

  • Go to Design tab=>Blocks tab;
  • Disable "Store location" block;
  • Check the result.

 

Comments

*****

"The link to Google API is no longer valid. Please correct this article.

------------------------------------------------------------------------------
The API keys generated by this page are no longer available. Please see the relevant section below for the API you are using.
------------------------------------------------------------------------------

See: https://developers.google.com/maps/documentation/javascript/tutorial#api_key

Also: please explain how this works with Google Places."

*****

"Dear Victor! Instruction given above applies to CS-Cart 2.0 - 2.2.x versions. CS-Cart 3.0. has a different block manager system. In CS-Cart 3.04 this tab is called Pages. Go to Design -> Blocks -> click Pages tab. There is not the "Add block" button. It is necessary to create a necessary block in a necessary grid (create the grid first if it is not created) by pressing the + sign."

****

"Hello,

i can not find on step 3

All pages tab;
and
Add block button;

i use CS CArt 3.04

thanks"

New post

Type the characters you see in the picture below.

Up