How to Create a New Map with MapifyPro

Posted OnDec 2, 2014     CategoryPlugins     CommentsNo comment

In this section of the guide to the MapifyPro plugin, we will show you how to add a new Map.

Step 1) Login to the WordPress Dashboard.

Step 2) From the left-hand sidebar of the Dashboard navigate to MapifyPro -> Maps.

km-mapify-add-00a

Step 3) Click the Add New button.

km-mapify-add-01a

Step 4) There are two different Map Modes available. For this example, Google Maps will be used.

  • Google Maps – where you can select to use a map from Google.
  • Image Map – where you can select a custom image as your map.

Step 5) Complete the fields as outlined below:

  • Map Options

    A. Title Enter a Title for the Google Map. This Title is used for reference purposes only such as selecting a specific map. For this example, Saks Map was entered.
    B. Mode Select whether you want to display a Custom Image or a Google Map.
    For this example, Google Maps was selected.

    km-add-22a

    C. Enable Search From the dropdown list, select Yes if you would like the map to have search capabilities. For this example, Yes was selected. The default value is No.

    km-mapify-add-01b

    D. Enable Filters From the dropdown list, select Yes if you want this map to include a dropdown list containing pre-defined filters. Filters are the Location Tags.

    For this example, Yes was selected. The default value is No.

    km-mapify-add-01c

    E. Enable Clustering From the dropdown list, select Yes to enable clustering on the map.
    For this example, the default value No was not changed.
    F. Default Pin Image You can use a custom pin image for your Map by clicking the Image button located at the right to display the Media Library.

    From the Media Library select an existing image or click the Upload button to upload a new image.

    km-mapify-edit-03aa

    Alternately, you can leave this area blank and use the default pin that comes with Mapify.

    For this example, a custom image was uploaded.

    km-mapify-add-02ab

    G.
    H.
    I.
    Tooltip Background Color
    Popup Background Color
    Map Background Color
    Below are instructions on how to change the Background Colors for the Tooltip, Popup and Map.

    • Click the Background Color button located to the right of the selected field to display the Color Wheel

      The Background Color button is a toggle button. Clicking the Background Color button again will hide the Color Wheel.

    • To select a background color, drag the circles around the wheel and the Background Color textbox will update with the Hex value of the selected color and the color of the Background Color button will change to reflect the selected color.
    • Alternately, you can enter a Hex Value directly in to the Background Color textbox. Click here for a list of available Hex Values.

    km-mapify-edit-05ab

    K. Enable Zoom In Google Mode you may lock the map so that it does not zoom in or out.

    For this example, Yes was selected.

    km-mapify-add-10ab

    L. Animated Tooltips? From the dropdown list, select Yes to Animate Tooptips on the map.
    For this example, Yes was selected. The default value is Yes.
    M. Animated Pinpoints? From the dropdown list, select Yes to Animate Pinpoints on the map.
    For this example, Yes was selected. The default value is Yes.
    N. Center Map on Search Results From the dropdown list, select Yes to Center Map on Search Results.
    For this example, Yes was selected. The default value is No.
    O. Center Map on Filters From the dropdown list, select Yes to Center Map on Filters.
    For this example, Yes was selected. The default value is No.

    km-mapify-edit-11a

  • Image Options

    To add in your own custom image instead of using a Google Map, perform the following steps:

    • Click the Image button to display the Media Library.

      km-mapify-edit-07ab

    • Select an image from the existing images in the Media Library or click the Upload tab to browse and select an image to upload.

      map-usa

    • Click the Insert into Post button or the Select Image button (depending on whether the image was uploaded or selected from an existing image in the Media Library).

      Uploading a Custom Image will override the Google Map selections made earlier.
      (See B. above.)
  • Google Map Mode Settings

    P. Mode From the dropdown list, select one of the following options:

    Road
    Satellite
    Hybrid
    Terrain

    For this example, Road was selected.

    Q. Style MapifyPro offers many different map styles.

    From the dropdown list select a style.

    For this example, the style Default was not changed.

    map-default-med

    R. Search Radius Enter your search radius in miles.
    For this example, 1300 (miles) was entered.
    S. Main Location A Main Location needs to be selected for the map.

    For this Guide, several Map Locations were added for you.

    Normally you would need to create a Map Location before you can set the Main Location. Click here for instructions on how to add a Map Location.

    For this example, select Saks 5th Ave. from the dropdown list.

    km-mapify-edit-09a

    There are two ways to add Map Locations:
    Manually Add a New Map Location
    Batch Upload

    T. Zoom Level From the dropdown list, select a Zoom Level for the map. The higher the Zoom Level the more detailed the Map.

    For this example, 7 was entered.

    km-mapify-edit-08aab

  • Initial Zoom and Style Preview

    Below is a preview of the map based on the selections made above.

    km-mapify-edit-12abd

    Add Location Tags to Map

    The next step is to add Location Tags for the four Map Locations we will be adding:

    • Saks Main Location – 10022
    • Greenwich Location – 06830
    • Hackensack Location – 07601
    • Bergen Town Center Location – 07652

    To add the four Location Tags perform the the following steps:

    Step 6) From the right sidebar, of the Add New Map page, enter in the four Zip Codes shown above (separate location tags with commas).

    km-add-map-filter-tag-01

    Step 7) Click the Add button to complete this process.

  • Due to the size of the textbox, not all four Zip Codes entered are visible.

    Finishing Up

    Step 8) Click the Save Draft button to continue tweaking the map, or click the Publish button to publish the map.

    The new map is now available in MapifyPro -> Maps.

    km-mapify-edit-13a

The next step of the guide will focus on How to Add a New Map Location to An Existing Map in MapifyPro.

 

Tags:

Leave a Reply

Your email address will not be published. Required fields are marked *

Send this to friend