23rd February 2010 by Jason C. Filed under: Code-bits
A new design agency being formed by an existing client needed a site. They had a good design ready, I just had to build the thing. It’s built in Wordpress, but I also pull in their Twitter stream on the client side.
Twitter’s api is easy enough to use. I opted for the JSON-p format, but something I didn’t realise at the time was that the status updates are purely the plain text. So any URLs, usernames or hashtags are just plain text: no wrapping in <a></a> tags. It’s an easy problem to solve, though, and here it is for anyone else who needs it.
function twitify( text )
{
// replace urls with linked ones
var t2 = text.replace(/(http|https)(:\/\/)([^ ]+)/ig, '<a href="$1$2$3">$1$2$3</a>' );
// replace @username with clickable twitter link
t2 = t2.replace(/@([^ ]+)/gi,'<a href="http://twitter.com/$1">@$1</a>');
// replace hashtags with Twitter searches
t2 = t2.replace(/#([^ ]+)/gi,'<a href="http://search.twitter.com/search?q=%23$1">#$1</a>');
return t2;
}
So, feed the tweet into that function, and back out it comes with links, @users and #hastags made clickable.
Did I mention I ♥ regular expressions?
27th January 2010 by Jason C. Filed under: Off-topic
I got an email today from my sister-in-law, forwarded on after she’d signed an online petition. The petition was to lobby the international community to cancel Haiti’s debt. From what I have read (which is very little), the debt seems to be both incredibly unfair and a huge burden for the country. The G7 is due to meet very soon and could take action on this with enough pressure, so sign up quickly.
UK residents can sign both the below petitions, anyone else can sign the second one only.
Go on, you know it makes sense!
21st January 2010 by Jason C. Filed under: SEO
There’s some good, solid advice here on trying to get Google sitelinks. The thing about sitelinks is that they give you more space on Google’s results page, and make your site look much more trustworthy and high-profile. This article dishes out some sensible advice, but unfortunately the exact method of getting these sitelinks remains securely locked in Google’s cupboard.
Of course, for the sitelinks to display, you have to get to number 1 on the search results page, which is a science in itself.
8th December 2009 by Jason C. Filed under: Code-bits
I’m not a .net developer. A few months ago, though, I was building a mini site for a property company, who’s hosting was on a .net server. I thought I’d have a go at using master pages instead of several different include files.
What a revelation! I really like the way that you specify a page that’s to be used as the template for the site, and simply add some place-holders that are to be populated with the content from your individual local pages. The whole thing then hangs together very nicely. You can even use relative links that are re-written by the server so no matter where you content page is, the link is always pointing at the same file. The code is clean, too, as the master and content pages are all marked up using XML, so all your code looks nice and is easy to follow in your editor of choice.
A different, but equally small site has now come up and it’s got me thinking about how to implement something like this in PHP. Now, there are several templating systems already out there for PHP, for example Smarty. I didn’t want to use one of those, because like I said the site’s very small, and adding all those extra files in there and using the Smarty syntax would just unnecessarily increase the development time for such a small site. So, I set about making something up myself.
I’m pretty pleased with what I came up with: it’s not quite as clean as the .net version, but it is simple and easy enough that it will help rather than hinder the development of such as small site. I’ve got my template (the ‘master’ page) on which I’ve defined a couple of areas where the content is to be dropped in.
template.php:
<?php Header("Content-Type: text/html; charset=UTF-8"); ?>
<html>
<head>
<title><?php echo $page->title; ?></title>
<link rel="stylesheet" type="text/css" href="/path/to/stylesheet.css">
<?php echo $page->head; ?>
</head>
<body>
<nav>
<ul>
<li><a href="/">Nav item 1</a></li>
...
<li><a href="/">Nav item n</a></li>
</ul>
</nav>
<div>
<?php echo $page->content; ?>
</div>
<footer>
footer message here
</footer>
</body>
<?php echo $page->foot; ?>
</html>
page.php:
<?php
$page->title = "Hello, world";
$page->template = "template.php";
?>
<?php ob_start(); /* head */ ?>
<meta name="description" content="description here">
<?php $page->head = ob_get_clean();
?>
<?php ob_start(); /* content*/ ?>
<h1>The Page Title</h1>
<p>The article goes here</p>
<?php $page->content = ob_get_clean();
?>
<?php ob_start(); /* foot */ ?>
<script type="text/javascript"> ... /* page specific script */ </script>
<?php $page->foot = ob_get_clean();
?>
<?php include_once $page->template ?>
23rd November 2009 by Jason C. Filed under: Web-development
Although this is a pretty old topic, and people have decided to come down on one side or the other already, I was reminded of the debate recently. I was looking at some code another dev had done, and was altering it to suit my style more. There was nothing wrong with it, but the tags were done in the XHTML style rather than HTML.
Now, way back when, I thought that XHTML was going to be the saviour of the web, and it was closely intertwined with the move away from table-layout to a more semantically correct layout. So I have coded a fair few sites using XHTML. In recent years, though, I have switched back to HTML. I have my reasons. And they are:
- IE does not support XHTML. It can render (modified) XHTML code served as HTML, but that’s not the point, is it? If you add the proper
<![CDATA[ sections, you then have to comment them back out. That seems to be a waste of time and of bandwidth to me. The XML prologue that should appear at the start of the file has to be removed, too or else IE6 chokes on it. Yes, I still have to support IE6.
- In the case of an error in the markup, properly-served XHTML completely fails. Now, this can be a benefit, as it will show the error up during testing and force you to output well-formed XHTML, but I’m not sure I trust all the JavaScript based editors that many users use to input content with to output flawless code every time.
- The JavaScript
document.write cannot be used. Adding elements using DOM methods is better, yes, but sometimes a quick hack is what’s needed, or code from an external source (like Google Analytics, for example) uses it.
I expect things to change on the code front as HTML 5 becomes more supported and as I start to integrate its code into my sites. It might mean that the move to XHTML starts to make more sense than it does to me right now. It’s something I will keep reassessing, and if I read a convincing enough argument to change then I will.
2nd November 2009 by Jason C. Filed under: Off-topic
Although this is nothing to do with web design, I keep feeling the smoothness of my skin after shaving and thinking ‘I’ll put this on my blog.’ So here it is.
I was in the market for more of those expensive razor cartridges – you know the kind, Gilette Mach 3, or Wilkinson Quattro Titanium, that sort of thing. So I was looking in Boots and despairing of the cost of de-hairing my face, when I saw the King of Shaves ‘Azor’ on the shelf there with the others. The price was in the same region as the others, a little cheaper perhaps. It had awards from Which? and some men’s magazine, so I thought I’d give it a go.
It’s great: it gets the skin smooth like any new razor, but is easier to use because it’s very light and quite flexible. Also, the blades seem to last for an age. So I’ll be getting more of those in future. Order one yourself:
King of Shaves Azor Hybrid Synergy System Razor – Warp
16th October 2009 by Jason C. Filed under: Blogging
The other day, the Guardian reported that it had been gagged from reporting on a parliamentary question, to be asked in the commons. It couldn’t say who had issued the “gagging order” (a.k.a. a “super injunction”), why it had been issued, and could only sneak out the fact that it existed because it was about parliamentary business.
This went out on a few high profile blogs, and spread from there. Eventually, after a few hours, the reason for the gag came out – I read about it first on Twitter. It was about a company that had dumped toxic waste off the Ivory Coast. Within hours, the name of the company and their solicitors (Trafigura and Carter-Ruck, respectively) were some of the most used words on Twitter. The culmination of all this attention was that Carter-Ruck withdrew their injunction, because of the huge publicity it was bringing to the story.
And that is the story of how Twitter broke a super-injunction. You can read a more full story here with a very nice visualisation of the story as it developed. Not bad considering most of the stuff on Twitter is about what some stranger’s cat’s had for dinner.
5th October 2009 by Jason C. Filed under: Blogging
It was terrible: the waiting. I created a theme for Wordpress, so that I could post to my blog and edit my site content easily, but the finishing touches needed doing. Then, a huge load of work kept me off the blog for months at a time, and gradually creating a new website for myself drifted further and further to the back of my mind.
Until now, that is. A short quiet spell has enabled me to get back on it, and although there are still finishing touches to be done, screenshots to be taken, projects to be added, at last I can make this new site live and consign the old – and very out of date – one to the great recycling bin in the sky.
The main thing I’m looking forward to with this new site is having my blog back online, but for the purposes of attracting new business I’m also looking forward to having recent work up on here and keeping it up to date. I’ve created a projects section to hold all that, and I’m hoping that at last potential new clients will not be put off by the very few examples of work I had on here before. Though, of course, right now there are even fewer.
16th November 2008 by Jason C. Filed under: Blogging
I’m moving my blog from Blogger to my own site, using Wordpress. During the move, both my Blogger blog and this one will look pretty average, because I’ll be using basic themes for both. When I’ve settled in to this new Wordpressiness, I’ll theme it up and I’m planning to use Wordpress to drive my whole site.
One problem I have had already was in importing my Blogger posts and comments to this site. Wordpress comes with an “import” function that supposedly imports from a lot of different blogging engines and CMSes, but I found that it didn’t work for me.
What I tried to do was import directly from my Blogger account, but Wordpress kept getting stuck showing one post and one comment imported, although those posts never actually made it to Wordpress. So, after reading a couple of posts on the Wordpress support forums, I signed up for a Wordpress.com account. Then, using the import tool on that account, I successfully imported everything from Blogger. With me so far?
Next, I used the “export” tool from that Wordpress account, exporting a Wordpress XML file with everything in it. It was this I tried to import to my this site. I say “tried”, because that didn’t work either. There was a problem with the permissions on my server forbidding Wordpress from creating the folder where the XML file would be stored.
A bit of Googling later, and I saw that this is a known WP bug. The temporary fix was to CHMOD the uploads folder to 777 – meaning that anyone has read, write and execute permissions in that folder. Right, so that done, at last I successfully imported all my posts and comments, not forgetting to reset the permissions on the upload folder.
And here we are.
13th November 2008 by Jason C. Filed under: Code-bits
Creating a warranty registration form for the proud owners of a new LCD panel should have been a very straightforward job. Well, actually it was, but that sort of interrupts the flow of this post a bit, so I’ll skim over that inconvenient fact.
For the ‘date of purchase’ field, I simply added the day and months items as <select> form controls. Then I got to the ‘year’ box, and realised that soon we’ll be leaving 2008 behind like a piece of temporal rubbish, and embracing the glistening newborn that will be 2009. I know the client wouldn’t really appreciate having to come back to me a month after his site goes live just so I can add a new year to the form, so I decided on the only sensible course of action a quality web designer like me could take, and made a super-simple php script to write the year into the form.
Here’s the php function:
function writePurchaseYear()
{
$currentDate = getDate();
$currentYear = $currentDate['year'];
$startYear = 2008;
$output = "<option value=\"2008\">2008</option>\n";
if($currentYear - $startYear > 0)
{
for($i = $currentYear; $i >= $startYear; $i--)
{
$output = $output . "<output value=\"$i\">$i</option>\n";
}
}
echo $output;
}
So, put that somewhere on the page that’s going to use it, and then, where you need the actual form control to be on the page, you need to put:
<select name="purchaseyear" id="purchaseyear">
<option selected>----</option>
<?php writePurchaseYear();?>
</select>
So there you have it. HTH, and all that.
