Get our posts emailed to you with our monthly newsletter, subscribe here.

Often it is a pretty common occurrence to see websites display their social statistics such as Twitter followers and RSS subscribers on their site. In this tutorial, I will show you how to get your social following statistics for your Twitter, Facebook and Feedburner account. In this demo I have coded up Orman’s Subscriber Count Icons and used PHP to get each count.

Demo & Download

Check out the demo, or download/fork it on GitHub.

Default Page Structure

Nothing out of the ordinary here, just a super basic HTML5 page structure where I load the CSS and create the list items for the social icons and counters.

<!DOCTYPE HTML>  <html>  <head>  	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />  	<title>Getting Your Social Stats</title>  	<link rel="stylesheet" href="css/style.css" />   </head>  <body>  	<!-- BEGIN .wrap -->  	<div class="wrap">  		<header>  			<h1>Demo: Get Your Social Follower Count Using PHP</h1>  			<p>Read the <a href="">full article</a> on how to get your Twitter, RSS and Facebook follower count.</p>  		</header>  		<section>  			<article>  				<div class="social-love">  					<ul>  						<li class="rss"><a href="http://feeds.feedburner.com/designwoop"></a></li>  						<li class="twitter"><a href="http://twitter.com/#!/designwoop"></a></li>  						<li class="facebook"><a href="http://www.facebook.com/pages/Designwoop/158483190866574"></a></li>  					</ul>  				</div>  			</article>  		</section>  		<footer>  			<p>A basic social statistic tutorial by <a href="http://designwoop.com/" title="DesignWoop">DesignWoop</a>, feel free to develop it further.</p>  		</footer>  	<!-- END .wrap -->	  	</div>  </body>  </html>

Default CSS Structure

Again the CSS is about as basic as it gets, I use the handy Eric Meyer CSS reset then begin styling the social list items. You will notice that I use an image sprite for the social icons, this means I combine the three icons into one image then use the background-position property to display different areas of the image sprite. This allows me to load just one image, yet display three different icons. Again, pretty standard stuff but a worthy mention.

.social-love {  	width: 300px;  	margin: 60px auto 0 auto;  	clear: both;  }    .social-love ul {  	margin: 0;  	padding: 0;  	clear: both;  	display: block;  }    .social-love ul li {  	margin: 0 32px 0 50px;  	padding: 0;  	float: left;  	width: 32px;  	height: 32px;  }    .social-love ul li:first-child {  	margin-left: 0;  }    .social-love ul li a {  	margin: 2px 50px 0 40px;  	float: left;  	font-size: 22px;  	font-weight: bold;  }    .rss {  	background: url(../img/icons-sprite.png) 0 0 repeat transparent;  }    .twitter {  	background: url(../img/icons-sprite.png) 64px 0 repeat transparent;  }    .facebook {  	background: url(../img/icons-sprite.png) 32px 0 repeat transparent;  }

Get Your RSS Feedburner Subscriber Count Using PHP

The first thing to mention when trying to get your Feedburner RSS counter is that you will need activate your Feedburner Awareness API. This allows us to query the feeds data. Your will need your full RSS URL and you will need to be sure its parsed in XML format, it should look like so: http://feeds.feedburner.com/designwoop?format=xml

Once we have our Feedburner URL we can use PHP to convert the feed XML to a string that we can then easily query. I do this by using file_get_contents, this allows us to take the entire XML file and convert it to a string. Once we have the XML converted and stored in a variable we can then use the PHP SimpleXmlElement function to convert XML to an object that can processed. We lastly pull out the RSS subscriber count from the array using $xml->feed->entry->attributes()->circulation;.

I finally store the ‘Subscriber’ count from the returned data using $rss_count = $xml->feed->entry->attributes()->circulation;, here I simply store the ‘Subscriber’ count from the array so I can use it later.

The completed code would look like so:

/********************************************************************************   FeedBurner Subscriber Count  ********************************************************************************/    /* Send an XML feed of a FeedBurner URL to a PHP variable */  $rss = file_get_contents('http://feedburner.google.com/api/awareness/1.0/GetFeedData?uri=http://feeds.feedburner.com/designwoop?format=xml');    /* Convert XML feed to an object */  $xml = new SimpleXmlElement($rss);    /* Store the FeedBurner count  */  $rss_count = $xml->feed->entry->attributes()->circulation;

Get Your Facebook Page Like Count Using PHP

To get a Facebook page like count using PHP is pretty simple, in this example you will see I first need to get the page id or name. For example the id: 158483190866574 or the name: drDre. This is then used in conduction with the Facebook Graph API, so putting the two together would look like: http://graph.facebook.com/[PAGEID OR NAME]

In the code below you will see I use the PHP json_decode function, this allows us to decode a JSON string, in this case the one which is returned from the Facebook Graph API URL. Once I have done this I use file_get_contents to allow us to be able to use and store certain data later. I finally grab the ‘Like’ count from the returned data using $facebook_count = $facebook[‘likes’];, here I simply store the ‘Like’ count from the array so I can use it later.

The completed code would look like so:

/********************************************************************************  Facebook Like Count  ********************************************************************************/    /* Send the FaceBook Graph to a PHP variable */  $facebook = json_decode(file_get_contents('http://graph.facebook.com/158483190866574'), true);    /* Store the  Facebook count  */  $facebook_count = $facebook['likes'];

Get Your Twitter Follower Count Using PHP

To get your Twitter follow count, I use much the same principles as I did when obtaining the Facebook ‘Like’ count, I use the PHP json_decode function and the file_get_contents function to convert the contents of JSON file into a PHP variable that we can get data from.

When obtaining data from Twitter, I use the the Twitter API, in this instance I am trying to get user data, so I use the ‘User Stream’ from the ‘Streaming API’. This provides and data and events about an authenticated Twitter user.

The Twitter API URL I use, looks like so: https://api.twitter.com/1/users/lookup.json?screen_name=YOURTWITTERNAME, to customise this for your purpose simply add your Twitter name minus the ‘@’ in lowercase.

The completed code would look like so:

/********************************************************************************   Twitter Follower Count  ********************************************************************************/    /* Send the Twitter api to a PHP variable */  $twitter = json_decode(file_get_contents('https://api.twitter.com/1/users/lookup.json?screen_name=designwoop'), true);    /* Store the Twitter follower count */  $twiter_count = $twitter[0]['followers_count'];

Display The Data

Once we have collected the data, its time to show it to the front-end user. For the purpose of this demo, I simply check the variables are not blank then echo the variable into the HTML list.

<div class="social-love">    	<ul>  		<li class="rss"><a href="http://feeds.feedburner.com/designwoop"></a></li>  		<li class="twitter"><a href="http://twitter.com/#!/designwoop"></a></li>  		<li class="facebook"><a href="http://www.facebook.com/pages/Designwoop/158483190866574"></a></li>  	</ul>    </div>

Closing Thoughts

This demo is simply a starting point for you to start creating your own version, this demo does not include caching and more advance PHP data checks to ensure the user always gets data, even if some APIs are unavailable. This would be the next development to add to the above code, if you do so wish. Enjoy :)

Demo & Download

Check out the demo, or download/fork it on GitHub.

References

http://php.net/manual/en/function.file-get-contents.php

http://php.net/manual/en/class.simplexmlelement.php

http://php.net/manual/en/function.json-decode.php

https://dev.twitter.com/docs

https://dev.twitter.com/docs/streaming-apis/streams/user

Image Credits:

http://www.premiumpixels.com/freebies/subscriber-count-icons-psd-png/

Posted by David Martin

David Martin is a WordPress developer & entrepreneur from the UK. He owns DesignWoop, CardDsgn and WhoDesignToday. Catch up with David on Twitter.

3 Comments

  1. I would love to figure out how to cache the Twitter info with this script. Any ideas? Since Twitter’s API has such a low request limit, I keep getting an error every few minutes with this. Help would be greatly appreciated!

  2. Hi Alex,

    Good point for integrating with WordPress.

  3. It will be better to use wp_remote_get instead of file_get_contents

    http://yoast.com/wp-best-practice/wordpress-http-api/

Comments are closed.