Skip to content

Lightbox

Generally people upload MASSIVE images to their site so opening lightbox at full image size can be very very slow. For this reason Total uses the custom functions called wpex_get_lightbox_image and wpex_lightbox_image throughout the theme to return the “large” size image for any image that opens in lightbox and help keep your site fast. In some cases…

Alter The Default Lightbox Image Size

The Total theme includes the popular Fancybox script which is a very popular and extensive lightbox solution which supports iFrames, which means you to easily open any Wistia video using lightbox. To do so simply follow the steps below: Step 1: Locate Your Wistia Video iFrame src This is very simple to do, have a…

Open A Wistia Video In Lightbox

The Total theme includes a built-in version of the FancyBox 3 javascript script for all image, video, modal and gallery lightbox functionality. Fancybox lightbox is used for various Total elements: Button, Heading, Icon Box, Image, Image Grid, Image Carousel, Post Cards…etc. While many of these elements have some settings to control the lightbox, the theme…

Global Lightbox Settings

In the Total theme by default images inserted to the post do not open with lightbox because it could create lots of conflicts with 3rd party plugins, however, we did include a setting to enable that in the Customizer at Appearance > Customize > General Theme Settings > Lightbox > Auto Lightbox. When enabled if you insert…

How to Enable Auto Lightbox for Post Images

The Fancybox script included in the Total theme allows you to open any content via lightbox and Total has some functions built-in to make this easier. The guide below explains how to add a popup with custom content using the included WPBakery plugin but this could also be done manually via HTML if wanted. Add…

How to Display Custom Content in a Modal Popup Window

The Total theme includes built-in javascript for the modern dialog element. In fact, it’s used for a few features such as the Social Sharing element (when set to Modal) and the Post Cards when the link type is set to modal. The dialog element is a core browser element that allows for creating popups with…

Adding Modal Dialogs using HTML
Back To Top