Display popular posts based on social media engagement with PostRank Top Posts API

Reading time: About 2 minutes

According to PostRank, “Over 80% of the engagement with your content doesn’t happen on your blog.” That’s a big deal on many levels. In the context of this post, it confirms that number of comments alone doesn’t constitute the popularity of your blog posts.

Lucky for us though, PostRank—a company that monitors and collects social engagement data in real-time across the web—provides powerful Data Services that give developers API access to that social engagement data.

Today I’ll show you how to use PHP5 to fetch and display your blog’s most popular posts using PostRank’s Top Posts API.

Requirements

  1. Your blog must publish an RSS feed
  2. Grab your PostRank feed hash (directions
  3. PHP5 is required.

Fetching the Top Posts API

This code caches the latest Top Posts API feed for an hour to maintain your website’s performance.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40

function popular_postrank()
{
	//BASIC REST API URL: http://api.postrank.com/v2/feed/{feed_hash}/topposts?appkey=postrank.com/example
 
	//replace this with YOUR feed hash as discussed in the requirements
	$postrank_feed_hash = '3e7883668d6a7406078846eed577d4f8';
 
	$numposts = 10;
	$apikey = $_SERVER['HTTP_HOST'];
 
	$url = 'http://api.postrank.com/v2/feed/' . $postrank_feed_hash . '/topposts?appkey=' . $apikey . '&format=json&num=' . $numposts;
	$cache = dirname(__FILE__) . '/caches/postrank';
 
	if(filemtime($cache) < (time() - 3600))
	{
		mkdir(dirname(__FILE__) . '/caches', 0777);
		$ch = curl_init();
		curl_setopt($ch, CURLOPT_URL, $url);
		curl_setopt($ch, CURLOPT_RETURNTRANSFER, 1);
		curl_setopt($ch, CURLOPT_REFERER, $_SERVER['REQUEST_URI']);
		$data = curl_exec($ch);
		curl_close($ch);
		$cachefile = fopen($cache, 'wb');
		fwrite($cachefile, $data);
		fclose($cachefile);
	}
	else
	{
		$data = file_get_contents($cache);
	}
	$json = json_decode($data);
 
	$html = '<ul>';
	foreach($json->items as $item)
	{
		$html .= '<li><a href="' . $item->original_link . '">' . $item->title . '</a></li>';
	}
	$html .= '</ul>';
	echo $html;
}

Displaying the popular posts

Put this anywhere you want to display your top posts.

1

<?php popular_postrank(); ?>

HTML output

Calling the above function outputs a simple HTML unordered list with the CSS class name “popular-posts”, like so:

1
2
3
4
5
6
7
8
9
10
11
12

<ul class="popular-posts">
	<li><a href="http://briancray.com/2009/12/29/understanding-user-behavior-google-analytics-event-tracking-jquery/">Diving deep into user behavior with Google Analytics, Event Tracking, and jQuery</a></li>
	<li><a href="http://briancray.com/2009/08/26/free-php-url-shortener-script/">Free PHP URL shortener script that kicks ass</a></li>
	<li><a href="http://briancray.com/2009/12/02/value-of-wireframing-website-design/">How wireframing makes your website designs better</a></li>
	<li><a href="http://briancray.com/2009/11/13/signup-process-online-community-best-practices/">Online community best practices: Effective signup process</a></li>
	<li><a href="http://briancray.com/2009/09/09/fire-the-web-designer/">Fire the “web designer”</a></li>
	<li><a href="http://briancray.com/2009/09/08/track-inbound-link-referrals-social-media-profiles-twitter-facebook/">How to track inbound links from your social media profiles (Twitter, Facebook, etc)</a></li>
	<li><a href="http://briancray.com/2009/08/26/free-php-url-shortener-script/">Free PHP URL shortener script that kicks ass</a></li>
	<li><a href="http://briancray.com/2009/11/30/omnigraffle-wireframing-960-grid-template/">Wireframing Freebie: 960 grid template for OmniGraffle</a></li>
	<li><a href="http://briancray.com/2009/09/18/web-form-validation-php/">Smart web form validation with PHP</a></li>
	<li><a href="http://briancray.com/2009/12/28/simple-image-randomizer-jquery/">Impossibly simple image randomizer with jQuery</a></li>
</ul>

Adding it to WordPress

  1. Add the popular_postrank() function to /wp-content/themes/{current_theme}/functions.php
  2. Add the call to the function anywhere you want to display to top posts (likely index.php, archives.php, or single.php)

8 comments skip to comment form

  1. Jim Murphy said— 16 minutes later

    Nicely Done, Brian! I’ll throw a link to this post from our Dev Wiki. http://apidocs.postrank.com.

    Cheers,

    Jim
    PostRank

    #1

  2. Brian Cray said— 29 minutes later

    Thanks Jim!

    #2

  3. Lee Hughes said— 1 hour later

    wicked.. I was looking for something like this.. I have added it to my wordpress site but now need to change the colour of the background since the themes don’t match my site.. Is there an easy way to change this do you know??

    Thanks again :)

    #3

  4. Brian Cray said— 1 hour later

    Lee: If you use the code included in this post to display to top posts, instead of the PostRank widget, the list will take on your website’s styling.

    #4

  5. Pliggs said— 2 hours later

    Anyone have this live on their site, would love to see it in action.

    #5

  6. Jim Murphy said— 2 hours later

    @Pliggs You can see the regular top post widget on http://www.fivethirtyeight.com/ as an example.

    If you’d like to grab yours feel free:
    http://www.postrank.com/publishers

    or the wordpress plugin:
    http://www.postrank.com/publishers/wordpress

    Brian’s custom solution is pretty h4wt for a customized style. If you want that I think its a great option.

    #6

  7. Brian Cray said— 2 hours later

    Pliggs: I have this code employed on my main blog page sidebar under “popular posts”

    #7

  8. Lee Hughes said— 2 days later

    Thannk Brain.. Have added it now to my site http://www.leehughes.co.uk

    Is there a way to get the actual post ranking by it like in the widget? I thought that was a pretty nice feature, shame non of the themes worked on my site :)

    Thanks again, am enjoying your site ALOT!

    :)

    #8

  9. Respond to this post—

Return to navigation
1616