possible to use built in prettyphoto to call up google maps?

resolved (12 posts) (4 voices)

  1. webzo

    I have no idea how I would go about doing this. Can someone helpe me with the proper shortcode or html? To clarify I would like to use the built in prettyphoto to open up a map from google with predefined width and height.

    Posted 3 years ago #
  2. Uniq

    Hello webzo,

    In the HTML editor (not Visual!) of Wordpress, when creating / editing a page / post, use the following code:

    <a href="GOOGLE_MAPS_LINK" rel="prettyPhoto">IMAGE / TEXT</a>

    You will have to replace GOOGLE_MAPS_LINK with the link you will be using for the google maps or image, and IMAGE / TEXT with the image or text you are willing to use to pop the prettyphoto box!

    Let me know if you managed to get it working!


    Posted 3 years ago #
  3. webzo

    this is the code i typed <a href="http://maps.google.com/?ie=UTF8&ll=29.866847,-95.322876&spn=1.531445,2.123108&z=9" rel="prettyPhoto">IMAGE / TEXT</a>

    and it says cannot load, make sure the path correct and image exists.

    Posted 3 years ago #
  4. Uniq

    Hi webzo,

    You have to use the iframe link for this. Here's an example:

    <a href="http://maps.google.com/maps?f=q&source=s_q&hl=en&geocode=&q=Granville+Island,+Vancouver&sll=49.293533,-123.13189&sspn=0.010454,0.032637&ie=UTF8&hq=&hnear=Granville+Island,+Canada&ll=49.279565,-123.129787&spn=0.020917,0.065274&t=h&z=14&iwloc=A&output=embed?iframe=true&width=640&height=480" rel="prettyPhoto[map]" title="This is a map.">THE LINK</a>

    Please notice the ;output=embed?iframe=true&width=640&height=480 code. This is what you are looking for.


    Posted 3 years ago #
  5. webzo

    Dorian, perfect! It works great now! :) Thank you so much! Awesome customer support for an awesome theme. This is the best theme ever!

    Posted 3 years ago #
  6. Strategerizer

    @Dorian, the link provided fails to work in IE9.

    I used the same code:

    <a href="http://maps.google.com/maps?f=q&source=s_q&hl=en&geocode=&q=Granville+Island,+Vancouver&sll=49.293533,-123.13189&sspn=0.010454,0.032637&ie=UTF8&hq=&hnear=Granville+Island,+Canada&ll=49.279565,-123.129787&spn=0.020917,0.065274&t=h&z=14&iwloc=A&output=embed?iframe=true&width=640&height=480" rel="prettyPhoto" title="This is a map.">

    The overlay comes up but it is empty, the map does not appear. Do you know why?


    Posted 3 years ago #
  7. Ruderic


    The problem here is that you need to update the prettyPhoto files.

    1. Create a backup of your theme folder.
    2. Download the latest version of prettyPhoto, http://www.no-margin-for-errors.com/projects/prettyphoto-jquery-lightbox-clone/, make sure to select the "Production Version".
    3. Extract the files from the downloaded zip and copy the "prettyphoto" folder into /wp-content/themes/awake/lib/scripts/ directory. You may have to rename the folder to "prettyPhoto".

    Just make sure that you are naming the new files exactly as the old ones, and it should work.

    Posted 3 years ago #
  8. Strategerizer


    I have updated the files but the issue remains the same. Here is a test page:

    Posted 3 years ago #
  9. Strategerizer

    Hmmm... I went to double-check what was going on the server an noticed there were two Pretty Photo folders - the old one called "prettyphoto" and the new one, per your instructions, "prettyPhoto". I deleted the old files and now it is not working at all... I'll get back shortly with more info...

    Posted 3 years ago #
  10. Strategerizer

    OK, so I figured out the correct name for the folder is "prettyphoto", the same as previous folder was named. This makes it the updated files work in Firefox. Still, they fail in IE.

    Now this test makes me think... maybe there is a cap typo in the Awake code and that may be why IE fails (though I would think IE would be less cap sensitive, like Windows, not more...). It is just that I have noticed the original files from Pretty Photo had the folder names with "prettyPhoto"...

    Please let me know what else I should try to get the overlay working in IE. http://formotus.komotion.com/test-map-prettyphoto-ie/


    Posted 3 years ago #
  11. Ruderic


    I just tested your website in Internet Explorer, and it works fine. You should clear the cache of your browser, and then try again.

    Posted 3 years ago #
  12. Strategerizer

    I tried the website on another machine with IE9 and it came up, although on subsequent refreshes of the page sometimes it would fail. Not sure why the inconsistent behavior but I'll just chuck it to IE idiosyncrasies...

    Thanks for looking into it.

    Posted 3 years ago #


You must log in to post.

Construct WordPress Theme
Construct wordpress theme
Myriad WordPress Theme
Myriad wordpress theme
Method WordPress Theme
Method wordpress theme
Fusion WordPress Theme
Fusion wordpress theme
Elegance WordPress Theme
Elegance wordpress theme
Echelon WordPress Theme
Echelon wordpress theme
Dejavu WordPress Theme
Dejavu wordpress theme
Modular WordPress Theme
Modular wordpress theme