Step one: Familiarize yourself with Google Maps Embed API; and sign up for API key:
The iframe embed option, unlike the Javascript API, does not have usage limits but does not have as many options/features. Determine which MODE you require and observe the required url format and parameters.
Step two: Collect address from user. For the sake of this discussion I will show an example where the user adds the address into custom metabox fields on a post and will assume the field data has been validated/sanitized.
Step three: Create a function to construct the iframe. Here is an example..I’m sure this could be cleaner. The example function can be called with the post $id of the post containing the address fields or from within the loop without the argument.
function build_map($id = NULL) {
/* Custom metabox field ids
/* Steet Address 'location_address'
/* City 'location_city'
/* State 'location_state'
/* Postcode 'location_postcode'
*/
if( empty($id) ){
$id = get_the_ID();
}
$address = array(
/*urlencode to replace spaces with +, etc.,. */
'address' => urlencode(get_post_meta($id, 'location_address', TRUE)),
'city' => urlencode(get_post_meta($id, 'location_city', TRUE)),
'state' => urlencode(get_post_meta($id, 'location_state', TRUE)),
'zip' => urlencode(get_post_meta($id, 'location_postcode', TRUE)),
);
/* Make sure we have each required field to build iframe*/
if( count( array_filter($address) ) < 4 ){
return;
}
/* contruct your output as you desire, this is my method: */
$op = '<div class="google-map-embed">';
$op .= '<iframe width="{DESIRED WIDTH}" height="{DESIRED HEIGHT}" frameborder="0" style="border:0" ';
/* src attribute formatted for place mode: */
$op .= 'src="https://www.google.com/maps/embed/v1/place?q=';
$op .= implode(',', $address);
$op .= '&key={YOUR API KEY FROM STEP ONE GOES HERE}';
/* configure optional zoom parameter: */
$op .= '&zoom=11"></iframe></div>';
print $op;
}