3D FlipBook - Show Lightbox from link (without using a shortcode)

3***t@horecawebservice.nl
2024-07-03
2024-08-23

Hi,

Is it possible to show a lightbox from it’s permalink without using a shortcode? I need to link to a flipbook from a hyperlink in a piece of text and from a page builder button?

I know the usual way is to use a shortcode like this: [3d-flip-book mode=”link-lightbox” id=”11792″]Open Flipbook[/3d-flip-book]

But you can’t use a shortcode to create a hyperlink on a word in a piece of text, and it can't be used for the url of a button in the Gutenberg button block (nor any other page builder like Divi, Elementor etc).

So I have this flipbook permalink: /mydomain/3d-flip-book/myfirstflipbook

I tried to use that as the hyperlink in text and for a button, but when you click that, you go to the Flipbook post itself, while I need it to popup on to current page, just like how it works when you use the shortcode. Is there a url parameter for such option? Something like this?

/mydomain/3d-flip-book/myfirstflipbook?mode=link-lightbox

Thanks JP

Replies

a***r@3dflipbook.net
2024-07-05
2024-07-05

Hi, it is possible to do what you want with JavaScript in some tricky way, but there is not such function out of the box.

3***t@horecawebservice.nl
2024-07-05
2024-07-05

Thank you for replying. That's a pitty. Is it something you would consider to implement? Given that such feature is already kind of available with the shortcode?

a***r@3dflipbook.net
2024-07-07
2024-07-07

In any way you need to add the book shortcode, otherwise WordPress will not include the plugin scripts. But you can include the book shortcodes in the end of your page and hide them with css, then you need to trigger their activation when users click on the links/buttons in your text using JavaScript.

3***t@horecawebservice.nl
2024-07-07
2024-07-07

So how do I trigger the script?

a***r@3dflipbook.net
2024-08-23
2024-08-23

We added this function in 1.16.1. You need to use trigger parameter:

[3d-flip-book mode="link-lightbox" id="1" trigger="start-book1"]Book #1[/3d-flip-book]

where start-book1 is CSS class that you need to add to any button, link, image and whatever you wish to launch the book lightbox (For Gutenberg: Block-> Advanced-> Additional CSS class(es) = start-book1).

3***t@horecawebservice.nl
2024-08-29
2024-08-29

Sorry late reply due to holiday.

That works, awesome. Thank you very much!

Log In to leave a comment