As I acknowledged in my opening post, there a lot of football sites out there. But here’s the thing, most of them are (and trust me, I’ve read more than most) are… How to put this… far from great. Not to say there aren’t already some amazing football sites, there are, but they are few and far between.

There must be 1000s of sites, all churning out and endlessly regurgitating the same stories with little value added.
I wanted to do something different.
That’s why I’ve put together a team of talented writers and have given them the remit to create long-form articles about football, tactics, and it’s social impacts.

A little over one week on and we’ve already posted nearly 20 articles, all of which are, in my entirely un-biased opinion, absolutely fantastic.

On the technical side of things, I’ve gone with good ‘ole WordPress for the CMS, for it’s ease of manageablity and speed of setup. Like the rest of my new servers that I’m deploying lately, I’ve ditched Apache for Nginx, MySQL for MariaDB / Percona (in this case MariaDB) and have sat Varnish in front for caching. I can’t say enough good things about Varnish. It has saved me enormous amounts in server costs already, it’s a breeze to setup if you know the hierarchy of your site and where you will serve cookies, and it makes scaling to mid-size very very simple.

I realise that the number of people interested in in-depth of analysis of football is far smaller than those interested in transfer rumours and football memes. I realise that getting Proven Quality in front of these people is going to be a challenge. But I like a challenge, and I’m going to give it a shot.

Until next time, back of the net e.t.c.

Previously with my Hotaru sites I have been using the mobile plugin to allow the sites to be viewed on (you guessed it) mobile devices, however there are a few problems with this.

Firstly, the plugin doesn’t really follow the Hotaru way of doing things – not all of the front-end is customisable through your theme and some things are hard-coded in the plugin folder. This is ok for one site but for a network of sites it starts to be a bit of a pain to find where to change things every time.

There are a few other niggles I have with how it works that I won’t go in to but the most important problem is that this plugin creates 2 versions of your site.
For example this post is also available via the mobile version with a different URL. The fact that the URL is different is what annoys me most, and the problems with search engines that can bring. I’ve tried blocking the google web spider from the mobile version of the site and the google mobile spider from the web version of the site but I’m not convinced of this as a solution. Ideally I’d like if someone searches for Arsenal News on the web version of google for them to be taken to the main version and if they search on the mobile version, or search for Arsenal News Mobile, for them to be taken to the mobile version.

In short, I haven’t been able to achieve this, and duplicate pages and canonical content issues aren’t exactly fun.

For the existing sites I kind of feel that I am stuck in this situation with the 2 versions of some of the sites some what established, I could possibly re-direct but I’m not ready to just yet.

However for future sites I would like to avoid this problem and this (eventually!) is what I want to talk about in this post.

If you’re not familiar with responsive design, there are plenty of people who have already outlined the approach much better than I ever could so I shall refer you there. However, the main idea of it is to design a single site that is capable of adapting to the user’s browser, whether it is a smartphone, a tablet, a laptop or desktop. A single design, a single code base.
There are of course a different set of problems associated with it, but at this time, for my needs (and the needs of most) I think it is the way to go.

All that to say, when I’m making sites now I tend to be making them using this approach, and to get me started I thought I would make a responsive version of the default Hotaru theme, both as a responsive starting point for my Hotaru projects and to release to the community. So fill your boots, the first responsive hotaru theme is available here and there is also a demo.

I’ve been working on tweepler for a few months now and it is always nice to have a change of context – a change is as good as holiday as they say. (I promise that’s the last tired cliché for this post).

Google+ Devs aims to be a resource for developers once a Google+ api is released, an until then I will be chronically all the little hacks that surface for the platform.

It has taken a few weeks of hard work, planning, testing and late nights to get this point but I am really pleased with how it has all turned out in the end.

The Hotaru Themes site is launched with a selection of 3 premium themes available, those themes are Bandini, Leon and Oscar. Each of the themes have a demo site which you can find a link to on the theme pages.

On the technical side of things, the site itself is built on WordPress with the phpurchase e-commerce plug-in handling the cart and payment end of things. I was pretty pleased with the ease of implementation phpurchase offered, I was able to set up the WordPress install in a way I was familiar with and use shortcodes from the plugin to drop in the e-commerce functionality.

I hope that in the future I will be able to add lots more free and premium themes to the Hotaru themes site and I will continue to support my current free themes and plugins as usual. The only change is that I may look to mirror some of the free themes offered here over to the Hotaru Themes site.

That’s it for now, Merry Christmas!

This version enables the plugin to work with Tie’s existing Post Images Hotaru CMS plugin.

If you have the Post Images plugin installed, the Facebook Open Graph plugin now gives you the option to use images from the Post Images plugin as Open Graph meta images, so when someone likes or posts a link to a story page from your site, if it has an image from Post Images, then that image will be displayed in the users Facebook stream alongside the story, instead of the default image you could previously set.

I’ve updated the Facebook Open Graph plugin page with the latest version, which you can also download here : Facebook Open Graph v0.5.

In other Hotaru CMS development news, I’m currently coding my first Hotaru CMS Premium Theme which I hope to be able to release soon.

This is a fairly simple update as the theme would not work properly with versions of Hotaru after 1.3.

This rectifies that, so if you are using a newer version of Hotaru CMS than 1.2.0, you will want to upgrade this theme.

You can download Isis theme and read more about it on the Isis Hotaru Theme page.

There is also a demo of the theme here.

The app is certainly of niche interest but it was fun to build anyway. The site, called #lfcfollowback, builds on a hashtag that fans of the Liverpool football team use to identify themselves on twitter. The idea being that users append the hashtag to their tweets and will be followed by other Liverpool fans (and implicitly agree to follow those users back).

I have a twitter account (@NewsLiverpool) for my Liverpool FC News site and hadn’t really joined in with the #lfcfollowback concept because I felt that using the existing twitter search it would take too much time to reciprocate in following all the users back.

So that’s why I made the lfcfollowback site. On to the technical details…

It’s a very simple app built from a single twitter search on the back-end. It’s all coded in PHP with heavy use of JavaScript for the front-end. There’s a script that is called regularly by cron that searches twitter for #lfcfollowback (using the twitter search API) and adds any users it finds that has tweeted ‘#lfcfollowback’ to the database.

There’s some more simple functions for the frontend that read users from the database and handle outputting the list of users to the site and pagination e.t.c.

The real magic is all done with the new(ish) twitter @Anywhere API. Similar in function to Facebook Open Graph, the @Anywhere API creates a platform for external sites to add twitter connectivity and functionality to their sites. In the case of the lfcfollowback app, I used the Anywhere API to allow the site to connect to their twitter account, to display hovercards for users, and facilitate following of other #lfcfollowback users.

All fairly basic stuff to implement, but the initial response from users has been very positive.

I had been using a php script to take stories from my RSS feed, shorten then with the bit.ly URL shortener and post them to twitter. The script stored the twitter account username and password and was logging in and posting the tweets.

As per twitter’s OAuth announcement, at some point on September 1st 2010 the script stopped posting tweets from my RSS feed.

This tutorial will show you the script I use to post tweets from RSS and how I got the script working again with OAuth.

The original script I was using was created by Paul Stamatiou and I had made a few modifications. The new version uses some OAuth stuff from Tayeb and the twitteroauth library from abraham on github.

The first thing we need to do is login in to twitter and create a new application at https://twitter.com/apps/new

Give the application a logical name and fill in the other fields. Application Type should be Browser, Default Access Type should give Read & Write permissions and you should check the Use Twitter For Login box.

Once you submit the form you will be taking a page that shows your Consumer and Secret Keys and some twitter authentication URLs.

You will be needing the Consumer and Secret Keys so keep the tab open for later.

Next you will need to grab the twitteroauth library from http://github.com/abraham/twitteroauth

You can grab it easily from git on Linux by doing :

git clone http://github.com/abraham/twitteroauth.git

from the command line.

We’re going to be using the twitteroauth library to create oauth tokens for our app.

So, create a new folder and upload the files to your server. Let’s say we upload all of the files under mysite.com/twitteroauth

We need to edit the file config.php to include our keys from twitter and our callback URL.

So open up config.php and go back to that twitter.com application details page and use the keys to fill in config.php like below. You will also need to specify the callback URL as callback.php in the folder where you uploaded the twitteroauth files.

define('CONSUMER_KEY', 'YOUR_CONSUMER_KEY');
define('CONSUMER_SECRET', 'YOUR_CONSUMER_SECRET_KEY');
define('OAUTH_CALLBACK', 'http://www.mysite.com/twitteroauth/callback.php');

Next you will need to goto mysite.com/twitteroauth/connect.php
Load that page in your browser, click the Sign in with Twitter button and follow the instructions to give your application access to the account you want to post your RSS items to.

Once that’s done goto http://dev.twitter.com/apps, click the name of your app and then click ‘My Access Token’ from the bar on the right.
This page gives us the remaining 2 oauth tokens we will need to authenticate the script.

At this point we only need a couple of files from the twitteroauth library and don’t need the whole twitteroauth folder to be on our server any more as we were just using it to authenticate ourselves.
Create another new folder on your server, lets call this one tweets, so it should be something like mysite.com/tweets/
This folder will be permanent and contain the scripts to automatically post our RSS items to twitter.
In the twitteroauth folder that we got from git there is another folder inside called twitteroauth (so the full path is twitteroauth/twitteroauth). This folder should contain 2 files, OAuth.php and twitteroauth.php.
Upload this folder with the 2 files to mysite.com/tweets/twitteroauth/

In this new folder at mysite.com/tweets/twitteroauth/ create a new file called secrets.php and put the following inside secrets.php :

$consumer_key = "YOUR_CONSUMER_KEY";
$consumer_secret = "YOUR_CONSUMER_SECRET_KEY";
$access_key = "YOUR_OAUTH_TOKEN";
$access_secret = "YOUR_OAUTH_TOKEN_SECRET";

(make sure to wrap the above in php open and close tags, I had to remove them because they were confusing wordpress)

The next thing we need to do is add 2 files in the mysite.com/tweets/ folder; parse.php and index.php
index.php is the file we will call to send our tweets, and it calls parse.php to get the items from our RSS feed.
You can get parse.php from the original .zip file from Paul Stamatiou and then you can either use the index.php from Tayeb or use my modified version below.

My version makes a couple of modifications; it uses the bit.ly URL shortener instead of tinyurl; it replaces ampersand characters in titles (&) with the html entity, and it automatically shortens the title/tweet and appends an elipsis if the tweet and bit.ly URL are going to be too long for a tweet.
If you want to use my version, you will need an account at bit.ly and your bit.ly API key from http://bit.ly/a/account

Here’s my modified index.php file.

You will need to replace ‘YOURBITLYLOGIN’ with your bit.ly username and ‘YOURBITLYAPIKEY’ with your bit.ly API key. Also replace ‘YOUR RSS URL’ with, well…the URL of your RSS feed.

If you have done everything right up to this point, when you go to mysite.com/tweets/index.php it should pull the last few items from your RSS feed and post them to twitter.
If you want this to be automatic (which you probably do!) then just set up a cron job to call the mysite.com/tweets/index.php script periodically.

Edit 3rd September 2010 :
Rob Q in the comments asked if it was possible to have a version of index.php which posted only titles from RSS to twitter, while ignoring the links. If you want to do this too, this version of index.php should do the trick.

Yonda is a theme for Hotaru which emulates the look of popular bookmarking site reddit.com

This version fixes a bug that some users have reported that caused problems when replying to comments or editing comments.
Also I have reduced the size of some headings and added some padding to the left column.

You can download the latest version of Yonda theme here and read all about the theme on the Yonda page.

As usual you can get all the details on the plugin on the plugin page and here’s the latest version of the plugin : http://www.mabujo.com/assets/hotaru/plugins/facebook_open_graph-v-0-4.zip