WordPressとFacebookページを連携させるためのプラグイン、Smash Balloon Custom Facebook Feed（Smash Balloon Social Post Feed）の最新バージョンが「4.0」になりました。

今回は大幅なアップデートになりました。複数のFacebookページが設定できる、プレビュー画面を見ながら各種表示設定ができるなど、操作が分かりやすくなっています。

以前から紹介している、このプラグインでFacebookページのサムネイル写真を取得して表示させる改変方法も、以下のような変更が必要になります。custom-facebok-feed/inc/CFF-Shortcode.phpが編集対象です。

１．84行目を以下のように書き換えます。

$cff_posts_json_url = 'https://graph.facebook.com/v4.0/' . $this->page_id . '/' . $graph_query . '?fields=id,updated_time,from{picture,id,name,link},picture,message,message_tags,story'. $story_tags .',status_type,created_time,backdated_time,call_to_action,attachments{title'. $attachments_desc . ',media_type,unshimmed_url,target{id},media{source}}&access_token=' . $this->access_token . '&limit=' . $cff_post_limit . '&locale=' . $cff_locale . $cff_ssl;

「message」の前に「picture」を追加することで、Facebookに投稿したサムネイル画像のurlを取得することができます。フルサイズの画像を取得したいなら、「full_picture」とすればよいでしょう。

２．596行目に、以下の行を挿入します。

isset($news->picture) ? $picture = $news->picture : $picture = '';

Facebookから取得した画像のurlデータを$pictureという変数に代入します。

３．1000行目に、以下の行を挿入します。

$post_text = '<img style="float: left; margin: 0 10px 5px;" src=' . $picture . '>' . $post_text;

このように改変すると、このようにサムネイルを表示させることができます。

もう少しかっこよく表示させたいなあ…と思ったので、さらにカスタマイズすると、こんなことも可能です。