What an excellent, simple-to-use plugin. It does EXACTLY what I wanted with no programming, configuration or conflict problems!
I needed a lightbox which allowed me to display custom web pages uploaded to my site – specifically, I needed to display HTML5 based animated TRAINING LESSONS generated with eLearning tools. I’ve tried most lightbox plugins on the WordPress site and while they were all great (in their own way) for displaying images, trying to display other content required complicated coding, custom child themes and a fair bit of knowledge of CSS & PHP. I’m no programmer and I use Elementor Pro exclusively so these really didn’t work for me.
Then I found this plugin and it worked PERFECTLY. After installation, all I had to do was create a lessons page in Elementor, drop a text box in place and then enter the URL using the ‘insert/edit link’ from the toolbar. Then, editing the URL link in text mode (just after the ‘<a’ and before “href=”) I inserted the parameter ‘ class=”fancybox-iframe” ’ (note the space before and after) and voilà! I had a clickable URL that produced a lightbox!
Next, I experimented further by using an image box with a screen capture of the lesson, then set the link to ‘custom URL’ and inserted the same URL as before (WITHOUT the parameter – see NOTE below). Once again, it worked perfectly. I was also able to set the lightbox size and fix its position using the WordPress Admin Settings for the lightbox.
Lastly, as I wanted to create an Elementor template (and therefore required the link to be dynamic) I set up a URL field for the course – using ACF (Advanced Custom Fields) – and entered the URL there, then assigned the ACF field to the URL field in the image object’s ‘Custom URL’. Once that was set up, then paging through the lessons dynamically refreshes the URL value, giving you a lightbox unique to each Lesson. PERFECT!
NOTE: For the Elementor image box to work correctly, after you enter the URL, you also need to click on the ‘settings wheel’ beside the entry and then, under the ‘Custom Attributes’ heading, enter the parameter in the format ‘class|fancybox-iframe’ instead of the format used in the textbox above. Note the divider bar – you’ll find it on the bottom-left on your keyboard – and no quotes or spaces.
This has not only solved a MAJOR headache for me which no other plugin I tried seemed capable of, but also produced a perfect lightbox-based interactive lesson display. WELL DONE GUYS! It couldn’t be better!
- The topic ‘An excellent, simple plugin that works perfectly with no programming!’ is closed to new replies.