Add Facebook event details to the lightbox

By default, only the event name and date is displayed in the pop-up lightbox. To display all of the information just follow these directions.

First, make all of the event details visible in the feed by ensuring the following setting is enabled: Facebook Feed > Customize > Post Layout > Show/Hide > Event Title & Event Details.

If you don’t want this information to be visible then you can hide it by adding the following CSS to the plugin’s Custom CSS section (Customize > Misc):

#cff .cff-event .cff-details { display: none; }

Then, to add the event details into the lightbox add the following to the plugin’s Custom JavaScript section (which is beneath the Custom CSS section):

$('.cff-event .cff-photo').on('click', function(){
    var $event = $(this).closest('.cff-event'),
    	title = $event.find('.cff-event-title').html(),
    	date = $event.find('.cff-date').html(),
    	location = $event.find('.cff-location').html(),
    	desc = $event.find('.cff-desc').html();

	$('.cff-lightbox-details').html( '<p class="cff-lightbox-caption">'+title+'<br />'+date+'<br />'+location+'<br /><br />'+desc+'</p>' );
});

Couldn’t find your answer in the docs?

Contact Support