January 24, 2014 at 1:22 pm #214381January 27, 2014 at 9:43 am #215226
You can’t link the entire/slide image to an lightbox iframe popup. However you can select “Slide Link?” – “No Link” and then insert your iframe link into the slide title or description field (both fields support html code). The link must look like
<a href="http://www.google.com?iframe=true&width=100%&height=100%" rel="prettyPhoto[iframes]" title="Google.com opened at 100%">Google.com</a>
and replace http://www.google.com with your url and the title and link text with your custom text. Note that you can not use the slide itself as a link if you add a link to the title/description field . otherwise you would add a link to a link and that’s not a valid html code.
PeterJune 24, 2014 at 7:44 am #282842
Can you shed some light – why this does not work for a google map ?
<a href="http://maps.google.com.au/maps?q=new+york&hl=en&sll=43.299428,-74.217933&sspn=6.571804,14.765625&hnear=New+York,+New+York+County,+New+York,+United+States&t=m&z=10&iframe=true&width=100%&height=100%" rel="prettyPhoto[iframes]" title="New York Map">New York Map</a>
even short url does not work
<a href="http://goo.gl/maps/ShS5K?iframe=true&width=640&height=360" rel="prettyPhoto[iframes]" title="New York Map">New York Map</a>
The lightbox opens but no content is loaded into the iframe
I have even checked out the authors website :: http://www.no-margin-for-errors.com/projects/prettyphoto-jquery-lightbox-clone
Is there another way within ENFOLD theme to have a google map open in a lightbox from a button or link ?June 25, 2014 at 12:03 pm #283527June 25, 2014 at 1:16 pm #283573
thanks for the reference blog which mentions embedding a google map
it only took 5 min to workout the embed and test!
It took much longer to write these instructions ;)
You can open a google map in a lightbox iframe as long as your google map url reference includes “&key= ” a google map API key.
login with your google account
Create a project – “website domain name”
on the left menu
APIS &AUTH / APIs
enable :: Google Maps Embed API
on the left menu
APIS & AUTH / Credentials
Create new Key / Browser Key “This key can be deployed in your clients’applications.”
Enter the domain name of your clients website
A Public API Access key is generated.
copy the API KEY
GO HERE :: https://developers.google.com/maps/documentation/embed/start
setup your map / looks good!
paste your API KEY
Copy the <iframe code
you can use the <a href=”https://
for your lightbox
don’t forget to add the “&iframe=true&width=100%&height=100%” to the end or the URL address
see example below ::
<a href="https://www.google.com/maps/embed/v1/place?q=New%20York%2C%20NY%2C%20United%20States&key=apikeyhere&iframe=true&width=100%&height=100%" rel="prettyPhoto[iframes]" title="New York Map">New York Map</a>
cheers :)June 26, 2014 at 8:02 am #283940November 10, 2015 at 5:01 am #533028
You can also embed using an iframe without the API as Google fully allows it. I use it all over my travel website.
Here is some sample code
<iframe src="https://www.google.com/maps/d/embed?mid=zkPgKhjKqT-I.kt828za9IaU0" width="460" height="490"></iframe>
Works great and is responsive depending on how you use it.
Thanks for the heads up on the light box method
November 12, 2015 at 3:42 pm #534830
- This reply was modified 1 year, 9 months ago by millertimesites.
The topic ‘Open link in Lightbox/iframe’ is closed to new replies.