Go check it out, and let me know what you think of it!

© Rob Barrett Design.

That’s why it’s been quiet here as of late — I’ve been working away behind the scenes in my spare time to create a new look and feel for my site. One that’s a lot more… me. I’m polishing it off and covering over the scuff marks at the moment, so it’ll be put in place very shortly.

© Rob Barrett Design.

It’s a new project though, and there’s not a whole lot of documentation for it at the moment, so it’s handy when users find solutions to common problems and share them.

In that vein, I’ve been having a problem in that the default WYSIWYG editor for textfields in Pods outputs text with multiple line breaks between paragraphs, rather than just creating new paragraphs as I want.

By adding this Display Helper to a field, the helper searches the field content for any reference of ‘<br>’ or ‘<br />’ and replaces it with ‘\n’ (just a new line, as if someone had pressed Return). Then the wpautop function from WordPress looks for any block of text surrounded by double-new-lines and adds the correct block-level tag around it, such as ‘<p>’.

Here is the Display Helper code:

<?php
$value = str_replace(array('<br />', '<br>'), "\n", $value);
echo wpautop($value); ?>

© Rob Barrett Design.

After a mis-tweet by @thedoodlebar earlier today, here are the rules to my newly invented game of Doodle Pong.

Photo by Yogma

1. The umpire writes a selection of words or phrases on scraps of paper and places them in cups at one end of the ping pong table, like in Beer Pong.
2. Two teams of two players are selected to play. From the opposite end of the table to the cups, Player 1 from Team 1 bounces the ball on the table in an attempt to land it in a cup.
3. If the ball does not land in a cup, play passes to Player 1 in Team 2.
4. If it does land in a cup, Player 1 must read the phrase on the scrap of paper. He then has 1 minute to draw the word/phrase. If Player 2 (of the same team) guesses the phrase in that time, Team 1 scores a point. Play then passes to Team 2 after the umpire has replaced the phrase with a new one.
5. Each time a Team has an attempt at landing the ball in a cup, the throwing Player must alternate.
6. If a Team scores 5 points, and is clear of the opposing Team’s score by 2 or more points, then they win the match.
7. If a Team reaches 5 points but isn’t 2 points clear, then play continues until either Team’s score exceeds their opponent’s by 2.

© Rob Barrett Design.

Where I came a little unstuck was the Search feature in WordPress. No matter which page I searched from, I would be given the relevant results from all Posts, not just the Category in question. So here’s how I went about fixing that…

Firstly, I added the following Search form to my sidebar:

<form method="get" id="searchform" action="<?php bloginfo('home'); ?>/">
<input type="text" name="s" id="s" value="Search" size="18" maxlength="96" onblur="if(this.value=='') this.value='Search';" onfocus="if(this.value=='Search') this.value='';" />
<input type="hidden" name="site_section" value="blog" />
<input type="submit" value="Search" class="hidden" id="searchsubmit" />
</form>

Note the third line, with the hidden input (that’s the third line if you paste that into a code editor, not what shows up here). On the sidebar for the blog, I gave that input field a value of ‘blog’; for the sidebar on the articles page, I gave it a value of — yeah, you guessed it — ‘articles’.

Then, create a file named ’search.php’, and paste the following into it:

<?php
/* Template Name: Search Results */
$search_refer = $_GET["site_section"];
if ($search_refer == 'blog') { load_template(TEMPLATEPATH . '/blog-index.php'); }
elseif ($search_refer == 'articles') { load_template(TEMPLATEPATH . '/articles-index.php'); }; ?>

The important part here is, again, the third line. This looks up the value of the hidden input on the search form, and assigns it to the variable, ‘$search_refer’.

After that, the if statement decides, depending on the value of ‘$search_refer’, which template to load. The load_template function will ensure that the referenced page is shown, displaying the results from the search term.

One last thing you’ll need to do is edit the Post index. In this example, I’ll show you what was added to ‘blog-index.php’. This goes directly before The Loop.

<?php if( is_search() ) :
$paged = (get_query_var('paged')) ? get_query_var('paged') : 1;
query_posts("s=$s&paged=$paged&cat=4");
endif; ?>

For now, I’m going to admit ignorance about the second line (and if you can explain it, then please, go ahead!). I don’t fully understand what purpose it serves — I pieced this solution together from a few places — but the third line (what’s with that?!) has the important bit you need to pay attention to.

On this client’s site, the ‘Blog’ Category has an ID number of ‘4′; that’s why the ‘query_posts’ function has ‘cat=4′ at the end — this only includes Posts from that Category in the output.

On the ‘articles-index.php’ template page, ‘query_posts’ has ‘cat=3′, to only show ‘Articles’ Posts. Fairly straightforward, right?

In this particular example (and I thought it best to show it as closely to my working version as is clear), I’ve sent the different results to different template pages because those templates differ to a large degree. However, if your search results templates for the different sections are identical (or nearly), then you could skip out the ’search.php’ file, and this to your index file:

<?php $search_refer = $_GET["site_section"];
if( is_search() ) :
$paged = (get_query_var('paged')) ? get_query_var('paged') : 1;
if ($search_refer == 'blog') { query_posts("s=$s&paged=$paged&cat=4"); }
elseif ($search_refer == 'articles') { query_posts("s=$s&paged=$paged&cat=3"); };
endif; ?>

That should do the whole lot after the search form in one step! If you’ve come up with a more elegant solution to this, or know a more efficient way to implement this solution, then please leave a comment — we all benefit from sharing tips like these!

© Rob Barrett Design.

If you want to come along to check it out tomorrow (April 4th), it’s all happening at the Coronet Theatre in Elephant & Castle from 7:30pm to midnight. Tickets are around a tenner from Amiando (for 10% off, use this code: DWDK707N), or about £15 on the door. I could do with a cheering section, so come on down!

© Rob Barrett Design.

While browsing the beer aisle in the supermarché here in the French Alps on Monday, on my first skiing trip, I received a phone call from Lizzie at Germination, the company behind the London version of the event.

“Good news — you’re in!” A great way to start my holiday off, knowing that I’d be one of the eight starting competitors in the showdown on April 4th. Plus the prizes are something to look forward to… My poor Wacom pen is gaffa-taped together now, so the replacement tablet and pen’s going to be very welcome.

If you’re around in London that weekend, come on down to Elephant & Castle and support me and the other guys (but cheer louder for me!).

For those of you interested, here’s my process for getting ready for the tryout…

Initial Sketch (24/02/2009)

I received an email last Tuesday night letting me know that I’d been accepted for a trial to enter Cut&Paste, and that I was to come up with a 15-minute design on the theme “Bliss”, with an optional challenge that it should be a t-shirt design.

Out came the notepad straight away, and after a brief brainstorm, I came up with this, which is a kind of ‘blissful unawareness’. The guy’s strolling through some post-apocalyptic landscape while listening to music, which transports him away into his own mental paradise.

Practice #1: 15 mins (24/02/2009)

This dreadful first attempt is a clear indicator that I had no idea just how much can be achieved in 15 minutes if you don’t panic and rush…

Practice #2: ~30 mins (24/02/2009)

Whereas this one’s an example of what can happen when you get carried away and decide to ignore the timer. Actually, it was a case of taking the image as far as I would have liked it, and seeing how long that took.

Practice #3: 21 mins (25/02/2009)

Refining the previous image, trying to find ways to cut some minutes off my time. It’s getting there…

Practice #4: 15 mins (27/02/2009)

The next couple were strict 15 minute tests with my decent design, trying to get as much done as possible while still furthering the illustration.

Practice #5: 15 mins (27/02/2009)

Practice #6: 15 mins (28/02/2009)

My final practice, finished about 10 minutes before I had to leave my flat for the real trial… I realised that I could save myself an easy minute or two by drawing the smoke with my Wacom instead of a series of ellipses — believe me, over 15 minutes, a one minute time-saving is a massive advantage!

Trial Entry: 15 mins (28/02/2009)

And finally, the final submitted image. I’m mostly happy with how it turned out, but there’s a few things I would have liked to have done a little differently. Unfortunately, the trial took place on a Mac — currently as a PC user, the keyboard layout and the terrible default Mac mouse got me pretty stressed out, which means I didn’t get to intersect the man’s shirt, nor did I have time to clip the background to a t-shirt shape. In fact, with 20 seconds remaining, I went to crop the image and couldn’t find the icon in the CS4 toolbar, so my final submitted image was actually about 10,000 pixels square. Oops.

© Rob Barrett Design.

That’s the first step, and it’s got an easy solution — just install the Exec-PHP plugin, and all PHP within Posts and Pages will run as you’d expect it to.

The second requirement I have for my blog is that, such as in this WordPress Tip, I want to display PHP code as part of a tutorial, within a <code> tag. Entering the PHP code as is will simply run it, which is no good. Perhaps you could replace the questions marks with ‘&#63;’ (the HTML code for the question mark character)? Elsewhere, that would be fine, but a <code> tag will display its contents exactly as you enter them, so you’d get that HTML code showing up.

The workaround I came up with is to install the Custom Fields Shortcodes plugin, which lets you display the contents of a Custom Field within a Page or a Post (I’ve gone into more detail in this post). Then you create a new custom field called, say, ‘PHP Example‘, and enter the code into it, replacing the question marks with the above HTML character.

<&#63;php echo "This is some PHP code" &#63;>

You can call this into your post with the [cf] plugin tag. So, in this example, you’d type:

<code>[cf]PHP Example[/cf]</code>

That will draw in the contents of the specified custom field, and show the code exactly as someone would need to enter it into their own code editor.

© Rob Barrett Design.

I don’t claim to be a PHP coder, so while it does work, it could be that this can be shortened somewhat. Feel free to use it as a base for making it more efficient, if you’d like (and if you can, I’d love to see what you come up with!).

OK… Somewhere within the Loop, before the area you want to customise, enter the following:

<?php $postdate = the_date('Y-m-d','','',false) ?>

That tells WP to find out the publication date of a post and to assign it to the function, $postdate. You can then call that function later in the post. For example:

<p<?php if ($postdate < date("2008-12-29")) { echo ' class="old"'; } ?>>

That snippet of code will check to see if the post was published after 29th December, 2008. If not, it will be assigned the “old” class, and you can style that however you like through your stylesheet.

Of course, it’s not limited to CSS styling — you can place whatever you like within the if statement, so you could, say, choose to show full posts after a certain date, and excerpts of posts written earlier.

© Rob Barrett Design.

OK, it’s just a holding page for the time being, until I build the site (and that probably won’t happen for at least a month or so — March is already filled up with holidaying and moving house), but it’s good to finally have something more substantial than just an idea in my head.

To reflect that I’m trying to involve myself in less web development, and more work involving graphic design and illustration, NHC will be geared towards generating clients requiring need print design, and digital design that doesn’t involve much in the way of back-end coding. I’ll still be working on web development for a number of existing clients, but I’m not going to be actively pushing this service.

This site, Rob Barrett Design, will remain in order to showcase my personal projects and to host my blog (I’m still undecided as to whether I should blog under RBD or NHC, so I’ll keep it here for the time being), and it will likely shift towards a role that supports my search for a full-time design job in London.

I’ve got a nice UPrinting giveaway planned to mark the unveiling of the finished NHC site, so keep your eyes peeled for that!

© Rob Barrett Design.