Toolset Map Documentation

Rough Draft

Toolset Setup

An example Toolset Mapping site that allows users to create a post that displays and image and text on a map using a front-end form.

Components:

• Default WordPress post type
• Post content
• Featured image
• Toolset plugins

Activate the following four Toolset Plugins

Dashboard>Plugins>Installed Plugins

1. Toolset Forms
2. Toolset Maps
3. Toolset Types
4. Toolset Views

Add Google Maps API

Dashboard>Toolset>Settings>Google Map API key

Create a Custom Field to Collect Location

Dashboard>Toolset>Custom Fields>Add New>Post Fields

• Give the Post Forms a meaningful name
• Click Add New Field button and select Address
• Enter Field name and slug
• Click Save Field Group

Once Field Group is savd we need to associate it with the default WordPress posts

• Expand Settings for Location Post Field (or whatever you named it)
• Click Edit and select Posts
• Click Apply and Save Field Group

 

Create a View

Dashboard>Toolset>Views

• Click the Add New button
• Select Display all results
• Provide a name for the View and click Create View
• In the Content Selection section select Posts
• Click Skip wizard
• After use Fields and View to insert Map
• After <wpv-loop> insert Map Marker,  select A post field storing an address and the Custom Field that you are using to collect the location
• Click Insert shortcode
• Save View

Insert View into Page

Goto to your Map page

Dashboard>Pages>All Pages

Edit page and insert Map shortcode using the Fields and Views button (appears at the bottom of the list)

Click the Update button to save Page changes.

 

Theme Setup

Single page setup using Fluida Theme

Activate Fluida WordPress Theme

• Dashboard>Appearance>Themes

Create Three Pages

• Map Overview/Information
• Map
• Map Submission Form

Theme Settings

Customizer

• Homepage Settings>A static page>Map
• Landing Page>Settings
  • Landing Page – Enabled
  • Layout – Wide
• Landing Page>Slider
  • Adjust basic settings accodringly
  • Call To Action (CTA) Buttons can been links to page sections
    • View Map – https://yourdomain.com/#lp-text-two
    • Add Map Location – https://yourdomain.com/#lp-text-three
• Featured Icon Boxes – Disabled
• Featured Boxes – Disabled
• Featured Boxes 2 – Disabled
• Text Areas
  • Text Area 1 – Map Overview
  • Text Area 2 – Map
  • Text Area 3 – Map Submission Form
  • Text Area 4 – Disabled
• Featured Content – Disabled

Display Map on Home Page

Edit Map page

• Goto Dashboard>Pages>All Pages – Edit Map page
• Click on the Fields and Views button above the text editing area
• Under Post View click Map, leave default settings and click Insert shortcode
• Click the Update button
• The map should now be in the middle section of the home page

 

Create and Display Map Posting Form

Create Form

• Goto Dashboard>Toolset>Post Forms
• Click the Add New button
• Review the details and click Continue
• Give the form a suiteable name (eg. Map Submission) and click Continue
• Adjust the following settings:
  • Post type to create/edit: Posts
  • Set this post status: Published
  • Leave Submit this form without reloading the page (use AJAX) unchecked
  • After visitors submit this form: Go to a page: (leave second dropdown black, this is just to refresh the page to display the new map post)
  • Check Hide comments when displaying this form
• In the Form Editor section add:
  • Post Title
  • Featured Image
  • Post Content
  • Note: It is recommend that you obtain a reCaptcha API and add a reCaptcha field to your form to block spam
  • Click the Continue button after all fields have been added.
• Adjust email notification settings if needed and click the Finish button

Display Form

• Goto Dashboad>Pages>All Pages – Edit the Map Submission Form page
• Click the Toolset Forms button
• Under Add Post Forms select the Map Submission button and the short code will be added to the text editor
• Click the Update button
• The map submission form should now be in the bottom section of the home page