Docs Facebook Customizations

Display an icon when hovering over a photo or video

To display an icon when hovering over a photo or video, add the following CSS to your preferred custom CSS location or stylesheet. One option is the default additional CSS location found at WordPress Dashboard > Appearance > Customize > Additional CSS.

#cff .cff-photo-hover .fa{ display: block; }

You can change the icon to be any icon listed here. To change the icon, you can add the following JavaScript to your site. This can be done manually using a custom JavaScript plugin. For further information see our documentation here.

$('#cff .cff-photo-hover .fa').attr('class', 'fa fa-arrows-alt').show();

You can change fa-arrows-alt in the snippet above to be any of the icon shown in the list. For example:

$('#cff .cff-photo-hover .fa').attr('class', 'fa fa-plus-circle').show();