Add Google Maps Driving Directions to Your Website

Home Elementor Add Google Maps Driving Directions to Your Website

January 20, 2022

In this video I will show you how to add Google Maps directions to your website for free!

Timestamps:

  • 0:00 Introduction
  • 2:05 Example 1
  • 5:02 Example 2
  • 7:27 Example 3
  • 10:03 Add Form To Default WordPress Page
  • 11:14 Open in New Tab

GitHub Link:
https://github.com/solodev/form-posting-to-google-maps

Example #1 HTML Code:

				
					<form action="//www.google.com/maps" id="">
      <input aria-label="From Location" id="" name="saddr" placeholder="FROM" type="text">
      <input aria-label="To Location" id="" name="daddr" placeholder="TO" type="text">
      <input type="submit" value="PLAN NOW">
</form>
				
			

Example #2 HTML Code:

				
					<form action="//www.google.com/maps" id="">
    <input aria-label="From Location" id="" name="saddr" placeholder="FROM" type="text">
    <input aria-label="To Location" id="" name="daddr" placeholder="TO" type="hidden" value="Philadelphia PA">
    <input type="submit" value="PLAN NOW">
</form>
				
			

Example #3 HTML Code:

				
					<form action="//www.google.com/maps" id="">
    <input aria-label="From Location" id="" name="saddr" placeholder="FROM" type="text">
    <input aria-label="To Location" id="" name="daddr" placeholder="TO" type="text">
        <select name="dirflg">
            <option value="r">Public Transit</option>
            <option value="d">Driving</option>
            <option value="w">Walk</option>
            <option value="b">Biking</option>
          </select>
    <input type="submit" value="PLAN NOW">
</form>
				
			

Open in New Tab HTML Code:

				
					<form action="//www.google.com/maps" id="" target="_blank">
      <input aria-label="From Location" id="" name="saddr" placeholder="FROM" type="text">
      <input aria-label="To Location" id="" name="daddr" placeholder="TO" type="text">
      <input type="submit" value="PLAN NOW">
</form>
				
			

*Some of the links on this page are affiliate links, meaning we may receive a commission if you follow them. This allows us to continue providing free content and educational resources for you. Thank you for supporting our small business!

More Free Resources