[Niels BParticipant]

Dear support

What’s the best way for an image to appear in Lightbox from a text link?

Regards,
Niels

[CousettMember]

Hi Niels,
Thanks for writing in! There is a great lightbox shortcode walkthrough available – http://theme.co/x/member/kb/shortcode-walkthrough-lightbox/

I would recommend watching this and coming back if you have additional questions.

[Niels BParticipant]

Hi

Watched it but it does not say anything about Lightbox images from a text link.

Note that I work in Classic Composer and do not use WYSIWYG but HTML mode.

I’ve downloaded a plugin called “Lightbox Plus Colorbox”. That seems to do the job but I was wondering how to let an image in Lightbox appear whem clicked on a text link using Theme X coding.

Thanks in advance!

Regards,
Niels

[ChristopherModerator]

Hi Niels,

Here is the code that I use in Classic Editor:

<a href="http://localhost:8888/x/wp-content/uploads/2014/08/slide1.jpg" class="link-lightbox">Trigger LightboX!</a>

[lightbox selector=".link-lightbox"]

The href for the link is connected to a url for an image 🙂

Thanks.

[Niels BParticipant]

Ah, thanks very much.

You’re the best!

[RadModerator]

You’re welcome Neils!

[martiniusParticipant]

Hi,
how do you do a text triggered lightbox in topbar (Topbar Content)?

Trigger LightboX!
[lightbox selector=”.link-lightbox”]

—> That won’t work! -> [all text in brackets are shown…??]

[Rue NelModerator]

Hello There,

Thanks for updating this thread! Regretfully shortcodes will not work in your topbar content. If you want to have a link that will trigger a lightbox, you have to manually code it using plain html. Please insert this code instead:

<a class="link-lightbox" href="http://bergfrieden.at/webcam/Leutasch-Webkamera-Livebild-Gross.jpg" rel="nofollow">Trigger LightboX!</a><br>
<span id="x-lightbox-1" data-x-element="lightbox" data-x-params="{&quot;selector&quot;:&quot;.link-lightbox&quot;,&quot;deeplink&quot;:false,&quot;opacity&quot;:&quot;0.85&quot;,&quot;prevScale&quot;:&quot;0.85&quot;,&quot;prevOpacity&quot;:&quot;0.65&quot;,&quot;nextScale&quot;:&quot;0.85&quot;,&quot;nextOpacity&quot;:&quot;0.65&quot;,&quot;orientation&quot;:&quot;horizontal&quot;,&quot;thumbnails&quot;:false}"></span>

Hope this helps.

[LiamParticipant]

<a href="http://localhost:8888/x/wp-content/uploads/2014/08/slide1.jpg" class="link-lightbox">Trigger LightboX!</a>

[lightbox selector=".link-lightbox"]

This code works well, thanks Christopher, but what I want to achieve is this:

In this example, I’d click ‘Trigger LightboX!’ and it would open up a lightbox, but it would have multiple images in rotation (not just the one that appears as per the above code.

How can I achieve a multi-image lightbox being triggered from a single text link?

[Paul RModerator]

Hi,

Regretfully this isn’t a feature offered by X. It could be possible with custom development, but this would be outside the scope of support we can offer. You may wish to consult a developer to assist you with this. X is quite extensible with child themes, so there are plenty of possibilities. Thanks for understanding. Take care!

[Author]

Posts