Date post: | 15-Jan-2015 |
Category: |
Technology |
Upload: | john-eckman |
View: | 1,619 times |
Download: | 1 times |
You Got Your WordPress in My Facebook! Developing WPBook.
14th November 2009
WordCamp NYC
John Eckman
http://www.openparenthesis.org/
@jeckman
Check out http://2010.boston.wordcamp.org/
2 © 2009 John Eckman. Some rights reserved.
What WPBook Does
WPBook is a plugin which exposes a view of your self-hosted WordPress blog as a Facebook Application.
Overview
3 © 2009 John Eckman. Some rights reserved.
Same blog, inside and outside FacebookOverview
http://www.openparenthesis.org/ http://apps.facebook.com/openparenthesis/
4 © 2009 John Eckman. Some rights reserved.
Facebook FeaturesOverview
5 © 2009 John Eckman. Some rights reserved.
Facebook featuresOverview
6 © 2009 John Eckman. Some rights reserved.
Setting Up WPBook
Install WPBook Plugin• http://wordpress.org/extend/
plugins/wpbook/• Activate as usual
Create a Facebook Application• Requires Facebook Developer
application• Get ‘api key’ and ‘secret’• Set callback url• Set iFrame, resizeable
Configure WPBook Options• Allow comments• Require email address• Add to Profile button• Invite friends link• “Share” button• External site link• Give credit• Advanced Options
– Custom header/footer for each post
Overview
7 © 2009 John Eckman. Some rights reserved.
WPBook
How does it work?
8 © 2009 John Eckman. Some rights reserved.
Check for Facebook
function check_facebook() {if (!isset($_SERVER["HTTP_USER_AGENT"]))
return false;if (isset($_GET['fb_sig_in_iframe']) || isset($_GET['fb_force_mode']))
return true;return false;}
if (check_facebook()) {add_filter('template_directory', 'wpbook_template_directory');add_filter('theme_root', 'wpbook_theme_root'); add_filter('theme_root_uri', 'wpbook_theme_root_uri');
}
Core Functions / Hooks
9 © 2009 John Eckman. Some rights reserved.
Theme Filter
function wpbook_theme_root($path) {$theme_root = dirname(__FILE__);if (check_facebook()) return $theme_root . '/theme'; else return $path;
}
function wpbook_theme_root_uri($url) {if (check_facebook()) { $dir = get_bloginfo('wpurl') ."/wp-content/plugins/wpbook/theme"; return $dir;} else return $url;
}
Core Functions / Hooks
10 © 2009 John Eckman. Some rights reserved.
Filter Permalinks
function fb_filter_postlink($postlink) {if (check_facebook()) {
$my_offset = strlen(get_option('home'));$my_options = wpbook_getAdminOptions();$app_url = $my_options['fb_app_url'];$my_link = 'http://apps.facebook.com/’
. $app_url . substr($postlink,$my_offset); return $my_link;
} else {return $postlink;
}}
Core Functions / Hooks
11 © 2009 John Eckman. Some rights reserved.
Update Profile Boxes
function wp_update_profile_boxes() { if(!class_exists('FacebookRestClient')) {include_once(ABSPATH.'wp-content/plugins/wpbook/client/facebook.php'); }
. . .$api_key = $wpbookAdminOptions['fb_api_key'];$secret = $wpbookAdminOptions['fb_secret'];$facebook = new Facebook($api_key, $secret);$ProfileContent = '<h3>Recent posts</h3><div class='
. '"wpbook_recent_posts">' . '<ul>' . . wpbook_profile_recent_posts(5) . '</ul></div>'; // this call just updates the RefHandle, set for the user profile
$facebook->api_client->call_method('facebook.Fbml.setRefHandle', array('handle' => 'recent_posts', 'fbml' => $ProfileContent,) );
}
Core Functions / Hooks
12 © 2009 John Eckman. Some rights reserved.
WPBook
What about the Facebook stuff?
13 © 2009 John Eckman. Some rights reserved.
Share on Facebook button
if($enable_share == "true"){echo '<span class="wpbook_share_button”>';echo '<a onclick="window.open(\'http://www.facebook.com/sharer.php?s=100&p[title]='; echo urlencode(get_the_title()); echo '&p[summary]='; echo urlencode(get_the_excerpt()); echo '&p[url]='; echo urlencode(get_permalink()); echo "','sharer','toolbar=0,status=0,width=626,height=436'); return false;\""; echo ' class="share" title="Send this to friends or post it on your profile.">Share This Post</a>’;echo '</span>’;
}
14 © 2009 John Eckman. Some rights reserved.
Invite Friends
if($invite_friends == "true"){$invite_link = '<a href="http://apps.facebook.com/' . $app_url .'/index.php?is_invite=true&fb_force_mode=fbml" class="share"> Invite Friends</a>';echo '<div style="float:right; ">';echo '<span class="wpbook_invite_button">';echo("$invite_link");echo '</span></div>';
}
(This just redirects user back to index.php with: is_invite = trueforce_mode = fbml )
Facebook Key Features
15 © 2009 John Eckman. Some rights reserved.
Invite Friends, Cont’d
<fb:fbml><fb:title>Invite Friends</fb:title><fb:request-form
action="http://apps.facebook.com/<?php echo $app_url ?>" method="post" type="<? echo $app_name; ?>"
content="<? echo htmlentities($content); ?>"
image="<? echo $app_image; ?>"><fb:multi-friend-selector actiontext="Here
are your friends who don't have <? echo $app_name; ?> yet. Invite all you want - it's free!" exclude_ids="<? echo $friends; ?>" bypass="cancel" /></fb:request-form> </fb:fbml>
When index.php in /theme/ is loaded:• If “is_invite” is set, AND
$_POST[“ids”] is set, show thank you message
• If “is_invite” is set, but $_POST[“ids”] is empty, show the add friends form– First get set of friends
who already have the app, and exclude them in form
• If “is_invite” is not set, we’re just on the blog home page
(see wpbook/theme/index.php for detailed version)
Facebook Features
16 © 2009 John Eckman. Some rights reserved.
Add to Profile
In HTML page (theme):<div id="addProfileButton"></div>
Plus Javascript from Facebook:<script type="text/javascript">
FB_RequireFeatures(["XFBML"],function() {FB.Facebook.init('<?php echo $api_key; ?>',
'<?php echo $receiver_url; ?>',null);FB.Connect.showAddSectionButton('profile',
document.getElementById('addProfileButton'));});
</script><script type="text/javascript">
FB_RequireFeatures(["CanvasUtil"], function() {FB.FBDebug.isEnabled=true;FB.FBDebug.logLevel = 4;FB.XdComm.Server.init("<?php echo $receiver_url; ?>");
FB.CanvasClient.startTimerToSizeToContent(); }
);</script>
Facebook Features
Facebook javascript loads and replaces the div with id of addProfileButton with a styled "Add to Profile" button.
It also resizes the iFrame to avoid the scroll bar – if the iFrame is set to resizable in FB settings
17 © 2009 John Eckman. Some rights reserved.
Add to Profile, Cont'd
$ProfileContent = '<h3>Recent posts</h3>'. <div class="wpbook_recent_posts">'. '<ul>' . wpbook_profile_recent_posts(5) . '</ul></div>';
$facebook->api_client->call_method('facebook.Fbml.setRefHandle',array(
'handle' => 'recent_posts', 'fbml' => $ProfileContent,)
);$facebook->api_client->call_method(
'facebook.profile.setFBML',array( 'uid' => $user_id,
'profile' => '<fb:wide><fb:ref handle="recent_posts" /></fb:wide><fb:narrow><fb:ref handle="recent_posts" /></fb:narrow>',
'profile_main' => '<fb:ref handle="recent_posts" />' ));
Facebook Features
18 © 2009 John Eckman. Some rights reserved.
View on Blog
<span class="wpbook_external_post"><?php $permalink_peices = parse_url(get_permalink());$permalink_app_url = "/".$app_url;$external_post_permalink = str_replace_once($permalink_app_url,"",
$permalink_peices[path]);$external_site_url_peices = parse_url(get_bloginfo('wpurl'));$external_site_url = $external_site_url_peices[host];$exteral_post_url = get_bloginfo('wpurl').
$external_post_permalink;echo "<a href='$exteral_post_url' title='View this post on the
web at $external_site_url'>View post on $external_site_url</a>"; ?>
</span>
Facebook Features
19 © 2009 John Eckman. Some rights reserved.
Roadmap
Fix What’s Broken• Require PHP5, eliminate potential for uncaught exceptions• Eliminate hard-coded wp-content directory, assumption about plugin files location
– http://willnorris.com/2009/05/wordpress-plugin-pet-peeve-hardcoding-wp-content/– http://willnorris.com/2009/06/wordpress-plugin-pet-peeve-2-direct-calls-to-plugin-files
• Fix bug on invite friends outside home page
Better Respect WordPress configuration(s)• Better handle custom home pages, subdirectories• Better handle pages, not just posts• Threaded comments (if enabled in blog)
Theme customization (in Facebook)• Enable sidebars, widgets• List pages / navigation• Allow theme selection / avoid overwriting theme on updates
More Facebook features• Post to [author’s | user’s] wall / notifications on new blog post• Publish to comment author’s news feed on comment• Get email addresses from comment authors via Facebook permissions
20 © 2009 John Eckman. Some rights reserved.
Thanks
WPBook was originally created by Dave Lester as part of the ScholarPress project. (He's here speaking at WordCamp NYC)
Brooke Dukes has also contributed significantly to WPBook. Unfortunately, she's not here speaking (as far as I know).
Many WPBook users have helped with bug reports / patches, suggestions, and testing.
21 © 2009 John Eckman. Some rights reserved.
WPBook
Q & A
Plugin: http://wordpress.org/extend/plugins/wpbook/Blog: http://www.openparenthesis.org/In FB: http://apps.facebook.com/openparenthesis/Twitter: @jeckman
Check out http://2010.boston.wordcamp.org/