WordPress.org

Ready to get started?Download WordPress

Forums

Adding a Google Map without using iframe or plugin? (3 posts)

  1. anna_manana
    Member
    Posted 2 years ago #

    I'd like to embed a Google Map into a WordPress post but without using an iframe or a plugin. This is because I want to do some more complex stuff, styling and adding overlays to the map.

    I have tried using the following HTML in the post:

    <div id="map_canvas" style="border: 1px solid black;" width="100%" height="500px"></div>

    But this gives me a map of zero height. I'd like to use a percentage-width map as I'm using a TwentyEleven child theme, so the site is responsive.

    Can anyone suggest how I should style map_canvas so it doesn't collapse?

    Thanks.

  2. BeautyPirate
    Member
    Posted 2 years ago #

    I´ve just tried that and you know what? Forget it, I got the Iframe plugin and thats it ;-) Use the link, not the iframe embed code and put it beween:

    [iframe src="http://yourgooglemapsurl.com" width="640" height="480"]

    Feel free to replace the width and height, but that actually works on WP 3.3.1

    http://wordpress.org/extend/plugins/iframe/

  3. anna_manana
    Member
    Posted 2 years ago #

    Thanks - yes, it's looking like I need to create a separate page that I host, with the map and all the JavaScript code on, and then iframe that into my WordPress post.

Topic Closed

This topic has been closed to new replies.

About this Topic