Automatically link the photo in each feed to a custom URL in the post text

Plugin Version 4.0 and above

You can link the photo in a post to a Custom URL by using the following snippet:

$('#paste_post_id_here').find('.cff-photo').attr('href', 'http://custom-link-here');

You’d need to add the code snippet using a custom JavaScript plugin or your preferred method. For further information see our documentation here. Then disable the popup lightbox so that it links to the URL instead of launching the lightbox: Facebook Feed > All Feeds > select Edit for the relevant feed > Lightbox and turn off the Enable switch.

Link photos automatically

If you’d like to link a lot of posts, then to make life easier you can use the following snippet to grab the first link from the text in your Facebook post (ignoring any Facebook links such as hashtags/mentions) and link the photo in the post to that URL:

$('.cff-item').each(function(){
  var $self = $(this),
    url_arr = [];
  $self.find('.cff-text a').each(function(){
    if( $(this).attr('href').indexOf('facebook.com') == -1 ) url_arr.push( $(this).attr('href') );
  });
  if( url_arr.length > 0 ) $self.find('.cff-photo').attr('href', url_arr[0]);
});

This essentially creates a “shoppable” feed that allows you to easily link to custom URLs without any ongoing maintenance.

If you’ve selected not to show the post text and are just showing photos, then you can use the following snippet instead:

$('.cff-item').each(function(){
 var $self = $(this),
   word_arr = $self.find('.cff-photo img').attr('alt').split(/\n| /),
   matching_url = '';
 word_arr.map( function(item) {
   if( item.startsWith("http") && (item.indexOf("facebook.com") == -1) ) matching_url = item;
 });
 if( matching_url !== '' ) $self.find('.cff-photo').attr('href', matching_url);
});