7. Third-Party Integration Guides

Using FancyBox in sliders

FancyBox and other Lightbox-like plugins in general can be used to display almost any type of content in a modal window. Images, galleries, videos, other websites, pdfs, you name it. In our example we're demonstrating how to embed Google Maps, but you can use the same method to add other embeddable web services as well.

Setting up a Google Maps modal

1. First, you need to install a FancyBox WordPress plugin. In our guide we used Easy FancyBox.
2. Make sure to review the Easy FancyBox plugin settings and enable to load videos and iframes.
3. After setting up FancyBox, jump back to LayerSlider and select a layer in the editor that you want to use with FancyBox.
4. Under the Link & Attributes tab, enter the URL you want to display with Fancybox, then enter the fancybox-iframe into the class field in the custom attributes section.
5. That's it, FancyBox should now appear when you click on the layer on your front-end pages.

Other use cases

Of course, FancyBox offers a lot more. You can also make image galleries or embed YouTube videos for example. All of these can be done by applying the appropriate class name and other special attributes described in the Easy Fancybox documentation.

For example, To group multiple layers into one gallery, enter the same rel name on all layers. It can be a custom identifier of your choosing. For example: flowers-gallery.

Troubleshooting

If you experience any issue, please verify that you've installed and activated the Easy FancyBox plugin, and you've reviewed all of its settings to allow the functionally you're seeking. For example, if you want to embed web contents, you need to allow iframes.