Customizing posts with the new Facebook API update

In an attempt to fight misleading news on their platform, Facebook has recently changed the way you can use their API to edit previews of posts. While before you could specify the header, preview text, and the image, this is no longer possible. Instead, Facebook picks the relevant information from the website that the post links to.

This article presents a solution to continue to post customizable post previews for certain contexts.

Facebook takes action to fight fake news

To fight misleading posts with false preview texts and misleading images,  Facebook has started to disable the ability for Pages to edit the previews of the links they post – both for the Page composer and the API.

Says Facebook (July 18, 2017):

By removing the ability to alter link metadata (i.e. headline, description, image) from all link sharing entry points on Facebook, we are eliminating a channel that has been abused to post false news. (…) Specifically all API versions will no longer support this capability, and Page admins will no longer be able to make these edits in Page composer. (source)

Now I’ve been doing exactly that with Jazzity: Everyday a cron job would run a script that took a few snippets from a data base and post them to Facebook using the API:

postPicture($post_message, $post_link, $post_picture, $post_name, $post_caption, $post_description);

The function postPicture (we’ll go into more details later) would take six parameters, which will make up the post as follows:

Starting July 18, 2017, however, the variables $post_picture, $post_name, and $post_description can no longer be submitted over the API. The postPicture function is now shortended to this:

postPicture($post_message, $post_link, $post_caption);

The other bits – essentially the main part of the post, will be taken from the meta data of the website you are linking to ($post_link).

 

Now this can be a major inconvenience for web master that rely on specifying thost bits of data.

For Jazzity, for instance, I would take those pieces of information from a MySQL database using PHP and link to the generic programme page of Jazzity. When the Facebook update went live on July 18, my posts would look like this:

Instead of using all of the parameters provided, Facebook would only use $post_message, $post_link and $post_caption, and ignore $post_picture, $post_name and $post_description. Facebook would then scrape the linked website and gather the relevant information from there – the picture, header and description Facebook would pick up, would be more or less random.

A workaround that works

I have developed a workaround for Jazzity that’s actually pretty simple, so I’m posting it here for you.

When Facebook picks up the data from a page that you post, it looks for meta data tags. If it finds them, it will use the data within those tags for the title, description and picture. 

So what I do is essentially is this:

1. I use PHP to create a web page
2. I add all the relevant data into meta data tags
3. I save that PHP file on my server
4. I use the Facebook API to post that newly created file

Let’s look into all these steps in detail:

1. Using PHP to create a web page

Here’s the way I use PHP to create a website. First I create a variable that holds all the HTML. For better readability, I do that like this:

and so on.

2. Add the relevant data into meta data tags

(description coming soon…)

3. Save that PHP file on the server

(description coming soon…)

4. Use the Facebook API to post the newly created file

(description coming soon…)

And that’s it! 

In summary, this tutorial describes how to circumvent the newly imposed limitations of the Facebook API to post content while customizing the preview. Showing examples from Jazzity, this guide gives practical tips on how to use PHP to create a .php file that contains all the relevant data so that Facebook represents the link preview exactly as you wish.

I hope this helps.

Introducing NaviChat
Introducing Jazzity - Your pocket guide to jazz in Berlin