New home

I think it was a bit buried in a previous post but my ‘BTaLT’ blogging now happens here www.bigthingsandlittlethings.co.uk

I may be some time…

Next Wednesday I set off in a van on a 5,000 mile round trip to Istanbul to support the Istanbul to Leeds cycle challenge which aims to raise funds for the Jane Tomlinson Appeal. As a result I will be more-or-less out of action from 21st July through until 31st August – I will have some access to emails but will only be able to check and respond on an irregular basis.

Hopefully before then I will finish off sites for Will Soden (plumber), Pickles and Potter (Deli/Cafe) and the Northern Dales Farmers Markets (farmers markets) as well as getting on as much as possible with the new site for Run For All (mass-participation runs). Diverse to say the least!

Oh and as a slight aside I also found something else that results in WordPress’ wonderful white screen of death – messing around too much with the chmod settings of the wp-content folder.

Sharing is caring

CSS – speeding things up

A bit of house-keeping (for wont of a better word) first, I’ll be moving this blog in the next couple of weeks to integrate with my website www.bigthingsandlittlethings.co.uk. When I first set this blog up I wasn’t entirely sure what form it was going to take but I’ve managed to keep it quite web-relevant (thus far) so it seems silly to keep two separate identities running when really they are parts of the same thing….

Now, boring stuff over, on with the blog.

This isn’t a hugely technical blog this time but covers a few CSS-related things that I have found make a big difference to workflow and just generally making things a bit easier to organise and manage.

I came across the notion of CSS ‘global resets’ a few years ago, to me they make a great deal of sense, especially with regards to white space (http://leftjustified.net/journal/2004/10/19/global-ws-reset/) – I find it far easier to start from nothing and completely build up my styling in the knowledge that I’ve specified every element rather than let some odd default browser setting trip things up. The notion here is that all browsers have default margin/padding/font-face/etc settings for elements that will be applied if you don’t specify an alternative, the annoying thing being that all of these browser defaults are slightly different. With a global reset you, as the name suggests, reset all instances of the specified attribute (whether its padding, margin, font-face, whatever) to zero, or Arial, or black depending on the attribute in question. This then gives you a specific base point to work from – which I find very useful.

Some good examples of CSS resets can be found here http://perishablepress.com/press/2007/10/23/a-killer-collection-of-global-css-reset-styles/ and a good one here http://meyerweb.com/eric/thoughts/2007/05/01/reset-reloaded/ http://www.christianmontoya.com/2007/02/01/css-techniques-i-use-all-the-time/ http://warpspire.com/features/css-frameworks/

A further use of resets is detailed here, http://www.smashingmagazine.com/2007/09/21/css-frameworks-css-reset-design-from-scratch/ Smashing Magazine takes CSS resets as an element of their suite of recommendations for developing a CSS framework – on reading this article I realised that I already used my own framework to some extent (I just didn’t refer to it as such) as there were certain stylesheet practices and scripts that I use as a matter of course – the acknowledged disadvantages of frameworks – such as the time taken to familiarise yourself with them and the possibility of inheriting bad code if you use someone else’s – didn’t really come into play as all the code I use is hand-written by me, I’m not saying I’m perfect though!

I’d be interested to hear about people’s experiences using some of the external CSS frameworks out there – there is a handy list of some of them here http://www.webdesignbooth.com/10-promising-css-framework-that-worth-a-look/ – have they streamlined your workflow or do they cause more problems than they solve?

There are also a couple of great articles at Smashing Magazine (who I rate highly – as you can probably tell) regarding good CSS practice and tips for better coding here http://www.smashingmagazine.com/2009/07/20/50-new-css-techniques-for-your-next-web-design/ and here http://www.smashingmagazine.com/2007/05/10/70-expert-ideas-for-better-css-coding/

WordPress – styling by category

I’ve spent the best part of this morning working out how to add a post’s category to its h2 tag’s class – which then allows me to do category-specific styling. Essentially I wanted each headline to be a different colour based on its category – simple result, slightly convoluted solution.

Anyways, it took a while so I thought I’d share it here to save others the hassle!

You first need to add the following to your functions.php file

<?php
function the_category_unlinked($separator = ‘ ‘) {
$categories = (array) get_the_category();

$thelist = ”;
foreach($categories as $category) {    // concate
$thelist .= $separator . $category->category_nicename;
}

echo $thelist;
}
?>

Basically this takes the results of the usual the_category() query – i.e. an unordered list – and strips out all the list formatting and presents the results as a nice list of the categories, with each category separated by a space.

You can then add this to your h2 (or whatever tag you want to style) class=”ADD HERE” in your index.php file (or wherever you need)

<?php the_category_unlinked(‘ ‘); ?>

This pulls the category info as formatted by the function you just wrote in the functions.php file – i.e. without any list formatting.

You then just need to add the relevant class styling info (e.g. .categoryname{some styling}) to your styles.css file and you’re good to go.

Hopefully this was useful.

So, you think you want a website?

A while ago, on my personal blog, I mused about things you should consider when you have that epiphany…”we need a website”, worth a read I’d say (but then I wrote it, so I would say that wouldn’t I…) http://ashmannblogs.wordpress.com/2010/04/19/so-you-think-you-want-a-website-4-things-to-consider/

Istanbul To Leeds

Friday saw the launch of the Jane Tomlinson Appeal’s latest charity challenge, a 2,500 mile bike ride across Europe from Istanbul to Leeds – and we designed and built the website which can be seen here www.istanbultoleeds.co.uk.

I’ll post a full blog about it all later this week.

WordPress theme development and the white screen of death

I’m currently working on a new site for a client who requires a CMS. After a fair amount of research and based on my own experiences they decided that WordPress fitted the bill. So I needed to develop a bespoke theme for them.

Now I’ve messed around with tweaking wordpress themes before and it is pretty intuative. Unfortunately last night the whole thing came crashing down and I had to battle with the (apparently infamous) ‘white screen of death’ – which usually seems to be caused by a php bug. These bugs can be as simple and innocuous as an additional line break in your code (WordPress doesn’t like space it would seem). I’ve not yet tracked down the source of my ‘white screen’ issues (EDIT - I have since found the source of my bugs, it was caused by such an innocuous thing i still can’t quite get my head around it! basically i needed to remove and all space between each function in my functions.php file – i.e. so there was no space between each closing ?> tag and the following opening <?php for the next function. it’s ridiculous that such a small thing brought everything crashing down, but there you have it…) but if you’re suffering from something similar then there are numerous lists that should help troubleshoot the problem. Here are just a few that I’ve found helpful:

http://wordpress.org/support/topic/405711

http://wordpress.org/support/topic/363816

http://www.amandavandervort.com/blog/2009/12/how-i-solved-my-wordpress-white-screen-of-death/

I’d also add that if you’re considering WordPress theme development then it’s a good idea to have a good read of the documentation first (there are lots of dependancies that it’s useful to be aware of so the whole thing doesn’t come crashing down) http://codex.wordpress.org/

And there are also a number of very good tutorials around WordPress theme development. Again, here are a few I’ve found helpful:

http://www.wpdesigner.com/2007/02/19/so-you-want-to-create-wordpress-themes-huh/

http://themeshaper.com/wordpress-themes-templates-tutorial/

http://jonathanwold.com/tutorials/wordpress_theme/

http://codex.wordpress.org/Theme_Development

http://codex.wordpress.org/Blog_Design_and_Layout

http://net.tutsplus.com/articles/web-roundups/top-50-wordpress-tutorials/

http://net.tutsplus.com/site-builds/how-to-create-a-wordpress-theme-from-scratch/

Hope that helps!

Flickr API – what I’ve learnt

I’ve never really paid a huge amount of attention to Flickr, and even less to the Flickr API. I’ve had to rectify this recently as a site I’m working on needs to have an easily updatable slideshow as a fairly prominent element.

Flickr was the platform that we decided to go with to upload the photos to due to the fact it’s pretty nice and easy to use and there are a huge range of pre-existing apps etc that you can exploit to do pretty much anything you can imagine.

Flickr provides a standard way of embedding photos/photostreams, although it is via an i-frame, is fairly clunky and not very customisable – it also looks pretty crap if you want to make it sit with the rest of the site’s design. I explored various methods of calling the relevant photostream to the site via php and the Flickr API but really it was all becoming far more complicated than I suspected it needed to be. If you are a php-lover then the very clever Dan Coulter has written the phpFlickr class to act as a wrapper for the Flickr API and make interacting with it via PHP relatively easy – check it out here http://phpflickr.com/ there is also a very useful-looking tutorial over at Nettuts+ which details how to create a very nice photo gallery using phpFlickr – you can check that out here http://net.tutsplus.com/tutorials/php/how-to-create-a-photo-gallery-using-the-flickr-api/

As I’ve already mentioned all this was looking to be slightly too cumbersome for what I was needing – all I really needed was to be able to call the photostream (perhaps with the option to display photos within that stream with a specific tag) and for the embedded call to be style-able. If there were some nice, sexy transitions etc than that’d be a bonus.

I thought that there would probably be a jQuery-related solution out there, and unsurprisingly there was, loads of them. Once again I came up against solutions that did far more singing and dancing than I would ever need or want. I just wanted a lightweight, simple solution goddamnit – why does everything need to be so bloody complicated!?

Then I stumbled upon flickrshow, “a simple, lightweight javascript slideshow for Flickr”. Only slight problem was that it was still in public beta testing mode so there wasn’t any documentation available. However the demos that they’ve provided give you more than enough of an idea how to use the script and which variables do what. You can check it out here http://www.flickrshow.com/ – it’s absolutely perfect for what I need you can call photos from a particular user, using a particular tag or from a particular photo set and it’s all lightweight, easily customisable and ace. Excellent.

I must stress that there are numerous other Flickr solutions out there, flickrshow just suited my needs and spec – hence me highlighting it. There seems to be a vast range of possibilities using things such as phpFlickr – however I haven’t spent the time looking more closely at these yet as they weren’t required for this project.

But my interest has been piqued so I think that the Flickr API is something I’m going to properly re-visit soon.

Anyways, hope that this was in some way useful – feedback and comments would be very welcome – I’m still trying to work out what people would find interesting.

Ash

Back once again with the semi-useful behaviour

Righty, I realise that to date this blog has been a)infrequent and b)fairly boring and useless, I intend to remedy this.

The blogs I find most useful are those that offer advice, tutorials and point you in the direction of useful things. As I spend every day doing web design and development in some shape or form I feel that it is probably this that I can offer something in the way of useful content about.

We’ll see…

Anyway, my plan is to blog at least once a week with something useful.

Jane’s Appeal

I’m redeveloping the Jane Tomlinson Appeal site, giving it a bit of a freshen up re look & layout and am also developing a php/mysql-based cms to manage it.