› Forums › Easy FancyBox Pro › Open lightbox from included anchor
- This topic has 6 replies, 2 voices, and was last updated 7 years, 4 months ago by Rolf.
11 January 2016 at 18:55 #5983
Love this plugin.
One of our clients (http://www.voalte.com) would like to be able to send their customers a link and have it open up a lightbox within that page. An example of a page customers will be sent is http://www.voalte.com/resources/infographics. Within that page are a number of links that open up in a lightbox when clicked. We would like to have a particular image open up on page load when clicking a link like http://www.voalte.com/resources/infographics#img-xxxx – where #img-XXXX is a unique identifier.
Can we do something like this with your plugin? And if not, do you have another solution?
For your reference, their previous website was doing this functionality here: http://hub.media/voaltebackup/resources/video. Click on the first image to see the URL change at the top. The client could paste this URL into email newsletters and have the lightbox pop up while staying on that page. Very useful. (The feature isn’t working because the website broke a little with the migration.)
Thanks for your help!
11 January 2016 at 19:25 #5984
Hi Anatoliy, welcome on this forum 🙂
To answer your question shortly: Yes it is possible.
Lower on that same page, you’ll see a script snippet that was placed on the site to trigger a click based on the # identifier. Of course, the identifier must match the ID given to the link you want to fire on page load.
So to be clear, you’ll need to (1) add that script snippet to the site and (2) give each media link that you want to have opened on page load a unique ID. Then, this ID should be appended with a # after the page URL and sent to your clients customers.
Hope that helps 🙂
11 January 2016 at 21:11 #5985
Thanks for the detailed post! Definitely sounds doable.
So the main question is how do I set the identifier for each post? Each item is its own post within WordPress. Is there a plugin you would recommend or can I used something like the post or image ID?
11 January 2016 at 22:01 #5986
I’m not completely sure if I understand correctly so tell me if I’m wrong…
If I go to the example page you you gave earlier http://www.voalte.com/resources/infographics/ then I suppose each item there is created from a Portfolio Post with a Featured Image, a title and a short text. Correct?
Is that part of the theme or is that a plugin? And did you already modify the theme/plugin so that these items link not to the portfolio item itself but to the large image version or was that already the case?
In any case, to make it work, you’ll have to modify the theme/plugin to include an ID for each item link there. This ID can simply be done by adding something like
id="resource-<?php echo get_the_ID() ?>"
in the correct place in the corresponding template file. Note that (1) this only works inside a Loop and (2) an ID in HTML may not start with a number, hence the prefix.
The resulting link source should then be like
... <a class="w-portfolio-item-anchor" id="resource-12531" href="..." ...
Then, since you’re modifying the template already, find a good spot outside the loop where you can add
so that it only occurs once on the resulting page source.
From then on, each item can be triggered with a corresponding URL like http://www.voalte.com/resources/infographics/#resource-12531
12 January 2016 at 16:56 #5987
Thank you! I’ll let you know how it goes for us.
13 January 2016 at 15:41 #5991
That worked great! You can see it working here:
Thank you for the detailed info, it really helped my team.
13 January 2016 at 16:40 #5992
Great! That looks good 🙂
One more tip: I notice you tried adding
?rel=0to disable Youtube’s “Related Videos” at the end of the video URL. Adding a rel=0 is the correct approach but it needs to be
&rel=0in this case.
To be completely correct the
&actually needs to be
& amp;(without that space between the & and the amp;) but that’s only for strict compliance…
- You must be logged in to reply to this topic.