badlyDrawnToy

I’ve recently been asked to look at integrating some complex forms into a WordPress powered site. None of the current plugins satisfied our (multi-lingual) needs, so the next simplest approach appeared to be integrating PHP code with WordPress. (I had considered integrating Kohana, my favoured PHP framework, as there is a module that allows easy integration, but this seemed overkill for a few forms).

Running PHP code from within WordPress is nothing new. There are numerous plugins. I opted for Exec-PHP, partly because it gets high user ratings and the developer has provided feedback on his site, and partly because it worked for me first time.

Having installed the plugin, it was simple to create a Page, add some PHP code using the traditional PHP tags . However, once I started writing code in anger, I began to understand that to run the code efficiently, and to give the end-user a good experience, simply placing code in the page (blog entry) is too simplistic.

The key issues, is that the PHP code is evaluated at run-time, using the PHP eval() function. This function is highly inefficient. So, the first improvement was to move the bulk of the code to a separate PHP file and include it. This way, the only code evaluated is the include statement.

I chose to put my included code in a folder called custom-php within the WordPress wp-content folder. The best way to reference the file is using the ABSPATH constant provided by WordPress, as follows:

<? require_once(ABSPATH. '/wp-content/custom-php/contact-form.php'); ?>

Now I can simply place my PHP code in the external file for inclusion. So far, so good. But it wasn’t long until I hit my next hurdle. I need to send an email when the form is submitted. Nothing too taxing there. In fact, this is super simple thanks to the @wp_mail WordPress tag.

Now, normally when writing a PHP form script, the form is POSTed to the server, the server sends the email using some SMTP library, and then the script renders an HTML page ( or View if using an MVC framework). And if you’re a good developer, you’ll actually perform an HTTP redirect instead, to prevent double form submission (see this article on Wikipedia).

However when PHP code is executed within a WordPress page, some of the response has already been sent. This has two side effects:

1. Firstly, the page renders in the browser until it reaches the script; waits until the email has been sent, and then continues rendering the rest of the page/
2. Secondly, as part of the response has already been sent, it is not possible to modify the HTTP headers, and hence a redirect cannot be sent.

So, we need a way to run the script before the response is sent. Here’s my solution:

Firstly, the PHP page included in the WordPress page, contains an HTML form. I add to the form a hidden field so that it can easily identified when POSTed e.g.:

<form method="POST" action="<?php echo $_SERVER['REQUEST_URI']; ?>">
<input type="hidden" name="form-name" value="contact" />
<div style="text-align:left; border: 1px solid #bbb; padding:10px;">
	<div>
		<label for="name">name</label>
		<input type="text" name="name" id="name" />
	</div>
	<div>
		<label for="email">email</label>
		<input type="text" name="email" id="email" />
	</div>
	<div>
		<label for="message">message</label>
		<textarea name="message" id="message" style="width:250px; height:100px"></textarea>
	</div>
	<input type="submit" value="go" />
</div>
</form>

Now, when the form is submitted, I am able to detect it, and therefore process the form submission prior to rendering the page. I do this by adding some code to the WordPress page template. I opted to add some more include code to the first line of the header.php file within my theme, like so:

<?php require_once(ABSPATH. '/wp-content/custom-php/contact-form-test.php'); ?>

There may be a better place to put this code (wp-config, wp-settings ?). I’m no WordPress guru, and I’m happy to be educated.

The contact-form-test.php code is as follows:

<? 
    session_start();
    if($_POST['form-name'] AND "contact" === $_POST['form-name']) {
         require_once(ABSPATH. '/wp-content/custom-php/contact-form-functions.php');
	 send_message();
     }
?>

This is fairly simple code. We test to see if our form was posted, and if so include the code to send the email. No point including it unless we need to. The key is, the code is now included before any other WordPress code executes.

For completeness, the contact-form-functions.php is as follows:

<?
function send_message()
{
	$subject = "Test email form WordPress";
	$body = $_POST['message'];
	$recipient = "rocky-racoon@abbeyroad.co.uk";

	$success = @wp_mail($recipient, $subject, $body);

	if($success) {
		session_start();
 		$_SESSION["mail_message"] = "Thank you. your message has been sent.";
		header( 'Location:  '.$_SERVER['HTTP_REFERER'] ) ;
	}
	else {
		$GLOBALS["mail_message"] = "Euston, we have a problem.";
	}
}
?>

We use WordPress’ mail functionality to send the email. If it sends OK, we perform an HTTP redirect. First we also set a flashvar using the PHP $_SESSION as, due to the redirect, we cannot use a $GLOBAL as it obviously goes out of scope.

One final change is required to contact-form.php to retrieve the success (or error) message. The following code is placed before the HTML form:

<?php
	if(isset($GLOBALS["mail_message"])) {
 		echo "<p>".$GLOBALS["mail_message"]."</p>";
	}

	if(isset($_SESSION["mail_message"])) {
 		echo "<p>".$_SESSION["mail_message"]."</p>";
		unset($_SESSION["mail_message"]);
	}
?>

This solution is useful for an custom PHP code that is server-intensive, be it database queries, web service calls or sending email.

Hope you found this useful

Tags: PHP, wordress

I recently moved house, and in the process lost my broadband connection for longer than anticipated. Having looked into the various USB Dongle solutions, I decided to opt for a tethered connection form my iPhone. I learned a lot from my week or so working this way – about my productivity, and about how affective tethering is.

Productivity

The thing I noticed the most was how much more productive I was. We all know how easy it is to get distracted by email, RSS, Twitter, Facebook, YouTube, and web surfing. And many of us know we should practice better time management. Well, next time you laugh at friend who tells you that where they work they don’t have internet access, I’ll have to admit, I completely understand why management make such decisions (unless your a web developer of course!).

Here’s my 2 tips to remaining productive:

• I really recommend only checking you mail periodically – it’s so easy to get into a conversation over email these days. I’d rather just fire-and-forget.
• Treat Twitter, Blogs etc. as a break from work, or something to read over breakfast/lunch/midnight feast depending on your working habits. I now read twitter feeds like RSS feeds – scanning for something interesting to pick up on.

Tethering

My experience was pretty good. I must admit, I’ve not used USB Dongles in anger, and form what I’ve seen, results vary widely. I’ve moved to Didsbury which has a strong 3G signal, and tethered over USB. My iPhone is the 3G, not 3GS. Here’s my experiences:

Speed

Connection is really good. I even managed to watch an episode of Dragon’s Den on my Mac with very little buffering. Of course, I couldn’t have done this on the phone itself.

Large File Downloads

Whilst streaming was fine, downloading wasn’t too good. I did try to download the whole episode, but it would have taken hours.

Image Quality

The biggest surprise was the poor quality of graphics. The quality is drastically reduced/pixelated. Hovering over the images reveals a hint that:

Shift+R improves the quality of this image. Shift+A improves the quality of all images on this page.

This intrigued me, so I did some digging and found that in the source of every web page, o2 is adding a call to a Javascript file in the header. This file, bmi.js, appears to replace images with low res versions. Not sure how, but it does seem to try to use iframes. It seems fairly harmless, but I did, on one occasion, find it broke a web page I was developing.

A quick look on Google reveals that thsi same file is used by Vodafone.

Battery Life

Whilst tethering, the phone does stay rather warm. With regards to battery life, as I was connected via USB, the phone remained fully charged. Interestingly, if the laptop is on battery power it still charges the phone, so the laptop loses juice pretty quickly.

Receiving Calls

Making ands Receiving calls whilst connected is fine. However, I did accidentally turn off 3G once. Whilst I could still browse OK, if the phone rings, you are disconnected.

Bugs

There is (or was, as I just downloaded the latest upgrade) a small bug with the address book. Every other letter in the right-hand alpha list became a bullet point. Odd.

Conclusion

Whether you think the £20/month tethering fee is justifiable or not is a different matter. It’s certainly cheaper than buying a USB Dongle if you only plan to use it the odd month or two. Regardless, if you have a good 3G connection I can recommend it – unless you hate low res images!

Tags: Apple, bmi.js, iphone, linkedin, mac

What a surprise. BT has f*cked up again. They really are the worst utility company I’ve ever had to deal with. I have no wish to deal with them, but I am forced to. When people go to work at BT, they must be lobotomised to have the words ‘customer’ and ‘service’ permanently removed from their brains.

I’ve moved house. A stressful experience at the best of times. We’ve finally sold our house in Macclesfield, and are now renting whilst looking to buy a new property. Being a web developer, one of my biggest concerns was getting my phone line and broadband up and running as soon as possible.

The rental property I’ve moved to didn’t have an active line, so I needed to pay for one to be installed. BT wanted £123 for this task. I was prepared for this expense (even though it is a fair whack). What I wasn’t prepared for was how BT wanted to shaft me for a 12 month line rental contract. We’ve been customer’s for a decade, and we could transfer our account to the new property, but we still needed to take out a new 12 month contract. Worse still, the contract is not transferable to the next property, nor the next tenant!

Absolutely outrageous. If we move in the next 3 months, I’ll have forked out in excess of £265 to get my phone line activated (without call or broadband costs). I’d then potentially need to fork out another £265 at my next property for the privilege. Maybe that lobotomy adds the words ‘daylight’ and ‘robbery’ into their brains.

After some research, I found a better alternative – the Post Office. The connection fee was cheaper at £107, and there is no minimum contract. On top of this, there’s some great free calls given as part of the bundle (mobile, international etc.).

So, having sorted out the phone line, I now needed to deal with my broadband. My provider told me that so long as there was 5 days notice, if I got hold of the Linked Order Reference from BT/Post Office then they should be able to get the broadband running the same day. Well, I’d been told it was 10 days to get the phone line installed, so I went back to the Post Office, got the Order Reference, and told my broadband provider.

Over the next few days, I got several emails confirming all was in order. Last night, I phoned to check. Everything was in order.

Today was the day it was all to come together. The engineer was booked between 8am and 1pm. He arrived at 8:30am and by 10am the phone line was active. Broadband however, was not active. The engineer informed me it could happen any time. The guy in the exchange would be working through 20 or so jobs, until around 4:30pm. So, I waited patiently.

At 12pm an email arrived from my broadband provider:

We would like to inform you that the simultaneous provide order for Linked Order Reference XXX has been cancelled by BT. The reason for this is that our order with the quoted reference could not be matched with the telephone order. Please call BT for more information and update us when your line will be activated.

WTF? Several expensive phone calls later, my broadband provider has provided no more insight as to why this has happened beyond ‘BT’s system doesn’t work’. And so, I must now put in a new order and wait 7 days for activation. I could speed this up to 48 hours if I pay an extra £100.

No explanation from BT
No redress from BT
No customer service from BT

Absolutely pathetic. Almost as incompetent as Macclesfield Borough/East Cheshire Council

A couple of days ago I released a jQuery plugin that provides a grid overlay when working with the 960.gs css grid framework. The plugin seems to have been quite popular, and as a result I now have a host of new Twitter followers – Hello to everyone in Romania!

I’m glad that others have found the plugin useful. A couple of people have suggested I release the overlay as a bookmarklet, so I spent yesterday learning how to develop one. So here it is: grid960 – a grid overlay bookmarklet for 960.gs

To install the bookmarklet simply drag the link below to your bookmarks toolbar. In Internet Explorer, right click, select ‘Add to favourites’ and then select ‘Links’.

grid960

You can test it on this page.

The bookmarklet works slightly differently to the original jQuery plugin. Firstly, if jQuery is not installed, it will inject it for you. If jQuery is already installed it will use this library – it will dynamically upgrade the library if it is not the latest vesion (1.3.2).

Secondly, the bookmarklet provides a small configuration menu on the page. When the bookmarklet loads, it will defaults to the 12 column grid. Through the menu, you can switch to a 16 column grid, and also alter the opacity of the gridlines.

The bookmarklet does not work in IE6 (yeah, whatever).

Any problems or suggestions, let me know.

Tags: 960.gs, bookmarklet, css grid, JQuery, linkedin