WordPress

How To Add Facebook Events List To WordPress

Recently we decided to add a list of Facebook events from our Facebook page to our WordPress driven website. The requirement was to add the full list to separate page and predefined number of upcoming events to the home page. To my surprise there was no existing WordPress plugin which will do this. So I accomplished this task by myself and want to share the solution in this article.

First of all we need the Facebook PHP SDK to access Facebook API. In fact you need only `base_facebook.php` and `facebook.php` files from `src` directory of this package. Include `facebook.php` into your script and `base_facebook.php` will join automatically.

require 'facebook.php';

Now all we need to do is to create a new WordPress shortcode and write a function for it:

function fb_event_list($atts){

}

add_shortcode('fb_event_list', 'fb_event_list');

Our function will get an undefined number of parameters inside of the `$atts` variable. So the first thing to do is to extract them and then test against our defaults. If you want to change default time zone or set the default number of posts you can modify it here. In my case I want to list the complete wire of events if opposite is not defined:

extract(shortcode_atts(array(
            'appid'     => '',
            'pageid'    => '',
            'appsecret' => '',
            'fbLocale'  => 'Europe/London',
            'limit'     => ''
        ), $atts));

Next goes the main part of our script. We are creating a connection to Facebook based on the application ID and secret passed to the function, creating FQL query, sending it to Facebook and retrieving the results. We will also add the result to WordPress cache because we don’t want to query Facebook each time a visitor opens a page of the website. I told WordPress to keep this cache for 300 seconds but depending on how fast events are flying by your Facebook page you can change this number:

        $fqlResult = wp_cache_get( 'fb_event_list_result', 'fb_event_list' );
        if ( false == $fqlResult ) {

            $facebook = new Facebook(array(
                'appId' => $appid,
                'secret' => $appsecret,
                'cookie' => true, // enable optional cookie support
            ));

            $fql    =   "SELECT name, pic, start_time, end_time, location, description, eid
                           FROM event 
                          WHERE eid IN ( SELECT eid FROM event_member WHERE uid = " . $pageid . " )
                            AND start_time > now() 
                       ORDER BY start_time asc";

            if (isset($limit) && (int)$limit) {
                $fql .= ' LIMIT 0, ' . (int)$limit;
            }

            $param  =   array(
                'method'    => 'fql.query',
                'query'     => $fql,
                'callback'  => ''
            );

            $fqlResult   =   $facebook->api($param);

            wp_cache_set( 'fb_event_list_result', $fqlResult, 'fb_event_list', 300 );
        }

Then script loops through the results and outputs them. If you need any specific markup add it here:

foreach ( $fqlResult as $keys => $values ) {
            $start_dt = strtotime($values['start_time']);
            $end_dt = strtotime($values['end_time']);

            ?>
<?php echo date('l, F d, Y g:i a', $start_dt) ?>
<a href="http://www.facebook.com/event.php?eid=<?php echo $values['eid'] ?>"><?php echo $values['name'] ?></a>
Location: <?php echo $values['location'] ?>
More Info: <?php echo $values['description'] ?>

That’s all. To add some icing on a cake let’s wrap out code into try/catch and ob_start/ob_get_clean. The complete listing of the function will look like this:

<?php
require 'facebook.php';
function fb_event_list($atts){
    ob_start();
    try {
        extract(shortcode_atts(array(
            'appid'     => '',
            'pageid'    => '',
            'appsecret' => '',
            'fbLocale'  => 'Europe/London',
            'limit'     => ''
        ), $atts));

        $fqlResult = wp_cache_get( 'fb_event_list_result', 'fb_event_list' );
        if ( false == $fqlResult ) {

            $facebook = new Facebook(array(
                'appId' => $appid,
                'secret' => $appsecret,
                'cookie' => true, // enable optional cookie support
            ));

            $fql    =   "SELECT name, pic, start_time, end_time, location, description, eid
                           FROM event 
                          WHERE eid IN ( SELECT eid FROM event_member WHERE uid = " . $pageid . " )
                            AND start_time > now() 
                       ORDER BY start_time asc";

            if (isset($limit) && (int)$limit) {
                $fql .= ' LIMIT 0, ' . (int)$limit;
            }

            $param  =   array(
                'method'    => 'fql.query',
                'query'     => $fql,
                'callback'  => ''
            );

            $fqlResult   =   $facebook->api($param);

            wp_cache_set( 'fb_event_list_result', $fqlResult, 'fb_event_list', 300 );
        }

        foreach ( $fqlResult as $keys => $values ) {
            $start_dt = strtotime($values['start_time']);
            $end_dt = strtotime($values['end_time']);

            ?>
<?php echo date('l, F d, Y g:i a', $start_dt) ?>
<a href="http://www.facebook.com/event.php?eid=<?php echo $values['eid'] ?>"><?php echo $values['name'] ?></a>
Location: <?php echo $values['location'] ?>
More Info: <?php echo $values['description'] ?>
<pre class="lang:php decode:true">
<?php
        }
    } catch (Exception $e) {
        echo 'Caught exception: ',  $e->getMessage(), "\n";
    }

    $htmlOutput = ob_get_clean();
    return $htmlOutput;
}

add_shortcode('fb_event_list', 'fb_event_list');

Now the list of Facebook events can be put into any place of your website using the following shortcode:

[fb_event_list appid="your_app_id" appsecret="your_app_secret" pageid="your_page_id" limit="2"]

4 Kommentare zu «How To Add Facebook Events List To WordPress»

  1. Pingback: Top 15: Unsere meistgelesenen Blog Artikel im 2013 | Openstream Internet Solutions

  2. Sounds good, but how do I implement this feature in WP? Everything I tried was without any success – only a blank page, no events showing up. Can you help me please?

Kommentar verfassen

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert