// Get images for this post
$arrImages =& get_children('post_type=attachment&post_mime_type=image&post_parent=' . get_the_ID() );

// If images exist for this page
if($arrImages) {

// Get array keys representing attached image numbers
$arrKeys = array_keys($arrImages);

// Put all image objects into new array with standard numeric keys
foreach($arrImages as $oImage) {
	$arrNewImages[] = $oImage;
}

// Bubble sort image object array by menu_order
for($i = 0; $i < sizeof($arrNewImages) - 1; $i++) {
	for($j = 0; $j < sizeof($arrNewImages) - 1; $j++) {
		if((int)$arrNewImages[$j]->menu_order > (int)$arrNewImages[$j + 1]->menu_order) {
			$oTemp = $arrNewImages[$j];
			$arrNewImages[$j] = $arrNewImages[$j + 1];
			$arrNewImages[$j + 1] = $oTemp;
		}
	}
}

// Reset arrKeys array
$arrKeys = array();

// Replace arrKeys with newly sorted object ids
foreach($arrNewImages as $oNewImage) {
	$arrKeys[] = $oNewImage->ID;
	$captions[] = $oNewImage->post_excerpt;
}

After an ordered array of post attachments is created I wrote some code to create a new array with data about each attachment. I pull data for the image’s thumbnail url, full size url, caption, width, height and ID. Here is how the array is built…

// Build image array
for ($i=0; $i < sizeof($arrKeys); $i++){
	$iNum = $arrKeys[$i];

	// get various image sizes
	$image_thumb = wp_get_attachment_image_src($iNum, $size='thumbnail');
	// $image_large = wp_get_attachment_image_src($iNum, $size='large');
	$image_full = wp_get_attachment_image_src($iNum, $size='full');

	// store image thumbnail(0) and full url(1)
	$image_service[$i][0] = $image_thumb[0];
	$image_service[$i][1] = $image_full[0];

	// store image caption(2)
	$image_service[$i][2] = $captions[$i];

	// get the image dimensions
	// store image width(3) and height(4)
	$image_service[$i][3] = $image_full[1];
	$image_service[$i][4] = $image_full[2];	

	// get attachment id
	$image_service[$i][5] = $iNum;
}

Here is the full function to place in your functions.php file: WordPress Post Attachments Function

All of this only builds an array for you. None of it places an attachment into your template. To do that you just need to call the function inside of the loop and place the array data where you need it. To call the first image attachment, say for adding a thumbnail to the post excerpt on your homepage you just need to pull the thumb url from the array we built earlier.

<?php $image_service = gallery_images(); ?>

<figure><img alt="<?php echo $image_service[0][2]; ?>" src="<?php echo $image_service[0][0]; ?>" /></figure>

Notice the array has two dimensions. The first one in this case is [0], meaning we are pulling the first attachment from the array (remember that arrays start with zero). You can see in the alt tag the second dimension is [2] because this is the position we stored the attachment caption. The source of the img tag uses [0][0] which calls the first attachment's thumbnail url. Getting how this works?

So what about pulling more than one image? To do this we just need to make a loop and cycle through our array like this...

<?php for($i = 0; $i < sizeof($image_service); $i++) { ?>

<figure><img alt="<?php echo $image_service[$i][2]; ?>" src="<?php echo $image_service[$i][0]; ?>" /></figure>

<?php } ?>

Replacing the array's first dimension with [$i] from the loop allows you to pull all of the attachments for your post.

If you need different layouts for horizontal or vertical photos just pull the image width [3] or height [4], do your if statement math and template away. Using the loop allows you to easily create your own gallery too. Wrap an anchor tag around a thumbnail image and link to the full size url to create an easy, template generated thickbox. Since WordPress generates a thumbnail, medium and large size for everything you upload it's easy to grab different media types. You can see where I commented out the large image media type. Just add another array position to have access to it. Remember that if you are going to template different media sizes set your image dimensions in WordPress under Settings -> Media.

Hit me up if you have any questions and if you find a way to improve this code please share it.

Here are some reasons for the redesign. First of all I needed a fresh start. My old site was based off of the Viewport Theme. Even though it was heavily modified it was still someone elses design at the core. I’m writing my new site from scratch, in HTML5 and SASS. This will give me a strong, flexible foundation to build from in the future.

I have some goals for this site. First it needs great typography. It needs to be clean and minimalistic. Finally the code has to be totally semantic. That means no extra div tags for style. Some secondary goals would be to have a strong presentation for post assets and make use of CSS transforms and transitions. jQuery and I are still best friends but I want to play around with some advanced CSS.

The overall feeling of the site needs to leave the user with the impression that I’m a true web professional who probably wears sandals to work. I’ll be updating this site mainly with blog posts and work from my portfolio. I’m going to ditch all of the sidebar crap that I used to have like tweets and delicious links. I’m going with the loose the clutter philosophy.

So stay tuned and bare with me as I clean this place up. I hope to make this place a real design blog someday and not just a place for randomness. Okay maybe some randomness.

Check out this post on what properly round corners are.

So what was the difference in my project? I took screenshots of before and after and animated a GIF with them so that you can see the difference. Yes it’s very subtle, but the perfectionist in me is much happier with the proper method.

I was rounding both outer and inner elements with a 5px radius. After I learned my lesson I’m rounding the outer elements with a 5px radius and the inner element with a 4px radius. What do you think of the difference?

Here are what the boxes look like in Webkit…

Here are what the boxes look like on the iPad…

I don’t understand why Mobile Safari is treating the shorthand version of the style differently than Webkit. It sucks because I use the shorthand way to change individual corners on elements (some boxes in my project only need the top corners rounded). I would hate to write a style for each individual corner the longhand way like -webkit-border-top-left-radius: 5px;

[Update]

SASS to the rescue:

// Border Radius
@mixin border_radius($tl: 5px, $tr: 5px, $br: 5px, $bl: 5px) {
  -moz-border-radius: $tl $tr $br $bl;
  -webkit-border-top-left-radius: $tl;
  -webkit-border-top-right-radius: $tr;
  -webkit-border-bottom-right-radius: $br;
  -webkit-border-bottom-left-radius: $bl;
  border-radius: $tl $tr $br $bl;
}

By modifying my mixin to include the longhand styles for webkit border radius will now show up on mobile safari. This is another reason why Sass kicks ass because I only had to modify this single mixin and my entire project got updated. Just another reason why if you write CSS for a living you need to be using Sass.

Scores lower than an eagle are of course possible, but ill advised. Stops at each bar usually only last 30-45 minutes and pacing yourself is important unless binge drinking is your thing.

So what counts as a drink? A standard beer/pint, mixed drink or shot each count as one drink. If you want to order a mixed drink with a double shot then that can count as two.

Let me just say that bar golf is meant to be a very casual event. There is nothing to win and having bragging rights will do you no good if you have to be carried out of a place. I would encourage everyone to drink responsibly and just have fun. Everyone is responsible for keeping their own score so bring a little score card, tweet your progress or just have a good memory. Again, you shouldn’t be taking this too seriously.

So what’s the course?

• First tee – Mellow Mushroom: The mushroom makes for an awesome starting tee because it’s a great chance to start early with some food. Filling up on pie makes the entire crawl easier. This also provides some great scoring opportunities. Having two or three beers while you take down pizza is a great way to start off with a low score. We have also been known to kick the afternoon off with a shot too. Birdies and eagles here are very common.
• Hole two – MoJoe’s Burger Joint: The second hole on this course is a quick jump across the street from the mushroom. If it’s a nice day outside MoJoe’s provides an excellent birdie opportunity because it’s easy to hang out on their deck for more than one drink. There is no official time limit to any stop and it’s easy to spend a little longer at MoJoe’s and soak up the sun.
• Hole three – Armadillo Grill: Another great patio stop and Dos Equis is a must here. Everyone is feeling good and the pace has been relaxed to this point. Enjoy it now because things usually ramp up from here.
• Hole four – Hibernian Pub: It’s pretty much a tradition now that you have to do a car bomb here. This of course is not required and you can certainly make this your only drink here. In my experience, this hole is usually the turning point for me.
• Hole five – Tobacco Road: A new spot for this crawl. This would probably be an excellent time to grab a quick appetizer.
• Hole six – Napper Tandy’s: This is usually the point where the crawl starts to fragment into smaller groups that move at their own pace. Remember there is no time bonus for finishing first!
• Hole seven – Vintage Bar and Lounge: The Blue Martini was a staple during our previous crawls so it makes sense that we stop at Vintage. This place is brand new so I’m looking forward to checking it out.
• Hole eight – The Ugly Monkey: You can probably imagine what everyone is feeling like at this point. Fortunately the monkey is a quick stop. Spin the shot wheel, drink the concoction they put in front of you and head across the street for the finish line.
• Hole nine – The Flying Saucer: Congrats you made it. Please get some food to go along with your final beer. If you are still in good shape go for a birdie, eagle, double eagle… whatever. Hope you had fun along the way!

There is a back nine to this course that starts at The Pit and finishes in city market. I’ll post details about it sometime this summer. There has been talk of trying all 18 in one day but I need to remember I’m not in my 20's anymore.

For people that have smartphones (anything with GPS), I would encourage everyone to checkin with Gowalla during the crawl. The more people that complete the trip on Gowalla the better chance I’ll have at lobbing them to make it a featured trip for Raleigh.

• Email
• Contacts
• Calendar
• Sync
• iDisk
• Photos

Email is the real biggie here but also the easiest to transition off of. Actually it’s going to be really nice to get a fresh email account. I finally took les at lesjames dot com and ported it over to Google Apps (Gmail). Mac Mail and my iPhone both sync nicely with Gmail. I still have push and great web access. The nice thing about all this is that I still have a couple months left of MobileMe so I can slowly ween myself off of it.

Photos and iDisk were never great with MobileMe so I have no problems here. I’m going to use Flickr as my photo repository and Dropbox is just about the coolest thing since Nintendo (I’m going to start using Nintendo instead of sliced bread as my default measuring stick of coolest since). BTW if anyone wants to give Dropbox a whirl use that link because we will both get extra space.

Sync is going to be the biggest loss here. I love how MobileMe keeps my laptop, cloud and iPhone all in perfect sync. It’s the tight integration you would expect from Apple having control over both the hardware and software. I’m pretty sure I can get contacts to sync up but I’m scared of calendars. The other nice thing about MobileMe was it synced my computer preferences too. When my laptop went down for a week between MobileMe sync and Time Machine I didn’t miss a step on my loaner Mac. I’ve also never had to use MobileMe to find my lost iPhone (knocking on wood now), but when I turn the service off I just know that is when Find My iPhone is going to come in handy.

I’m going to start transitioning my contacts to Google so hopefully it goes smoothly. I’ll give it a couple weeks and then report back. I’m saving calendars for last because I just know that will end up being a pain. Any advice would be greatly appreciated.

[Update]
So I have switched off MobileMe contact syncing for my iPhone and laptop. Fortunatly Mac Address book has an option for syncing with Google Contacts. When I set up my gmail account on the iPhone it magically started syncing my contacts too. The process wasn’t entirely painless because I had a tough time with duplicate and sometimes triplicate contact entries showing up, but I think everything is in sync now. As a side note, my contacts in Google Apps and my Google Account are completely different lists and I can’t get the two to sync. So I wiped out my contacts from my account (not gmail in apps). The whole thing was quite confusing there for a little while. Google should do a better job of meshing my account with Apps.

I’m going to let the dust settle with contacts before I try and tackle calendars. I’ll update when I give it a go.

[Update]
When I switch off MobileMe I will lose the Find My iPhone feature which thankfully I have never needed. This app could be a nice alternative: Undercover

[Update]
Thanks to this great article on iPhone.AppStorm I have now transitioned off of MobileMe calendars and switched to Google. This was the last piece of the puzzle. Yay!

[Update]
I have turned off MobileMe on my computer. All mail, contacts and calendars are being handled by Google now. I feel like I’m a step closer to digital harmony.

Now I know what you are saying, Twitter and information overload often go hand and hand. I completely agree. It’s extremely difficult to keep up with. That is why I love Tweetie 2, specifically it’s integration with Instapaper. Now I never used Instapaper before but signing up is really easy. Now when I’m browsing through my Twitter feed and I see something that looks interesting I can post it to Instapaper to read later. This is very useful because I often don’t have time to read everything that looks interesting.

When I do find time to catch up on all my design news, I go to my Instapaper site and open each clipping into it’s own tab. I start reading everything and if something is especially good then I save it to my Delicious account. This allows me to go back through my “design library” in case I need that page again. It’s a wonderful system that I have going.

Before Instapaper I would favorite links through Twitter to read later but this isn’t exactly what the feature was made for. I’d have to clean out my favorite tweets after I caught up on things. There is no cleaning out Instapaper. When you click on a link to read Instapaper automatically takes the link out of the queue and archives it.

It’s now super easy to stay on top of everything I want to because of Twitter, Tweetie 2, Instapaper and Delicious. If your a designer or if you follow any kind of niche subject I would try this kind of system out.

Do you really think I’m that dumb. Do you really think that I’m going to just follow you back? You don’t care about me or what I have to say. You just want me to boost your stats. I bet you brag about how big you are on Twitter at parties. I bet you tell all your business buddies that you’re a social media guru. How many of those followers are real people anyway and not just bots or porn spammers? You probably don’t care do you. It’s all the same stat boost right?

Not only am I not going to follow you back but you are actually padding my stats now sucker! But that would be pretty hypacritical of me. I guess I’m going to have to go for the full out block. The shame is that you won’t even notice when I permanently sever the link between us. But maybe this could be he start of something great. Maybe this rant will inspire other people to block you from their followers list. Come on people. Let’s drop the “Internet Marketers” that only want you to help make them look important. Sure it will knock your stats down a few, but don’t be so vain. No one cares how many people follow you. Do it! Block those losers! Isolate those punks so that the only ones that actually listen to them are robots and skanks.

If you are feeling adventurous send them a reply that simply asks “why are you following me?” Let them know that we aren’t a mindless mass desparate to connect with anyone and everyone. We have something to say too so if you want my return follow, convince me that you are listening.

• Blog
• Portfolio
• Twitter
• Delicious
• Pandora
• Blippr
• Flickr

So in one place you could see things that I write, work on, tweet, read, listen to, use and take pictures of. I would like to keep everything grouped together instead of being a true blended lifestream. So how would I accomplish this? I just started playing around with FriendFeed today. I’m not a pro yet but I don’t like the blended feed that it creates but the ability to comment on each individual item is cool.

The other method I stumbled upon to create a lifesteam is from Yahoo called Yahoo Pipes. Its complex, powerful and cool all at the same time. You import data from anywhere you can grab it and send that data through pipes to different modules and filters. In the end I’m left with a very customizable lifestream. The only question is how do I get that stream on my website in a way that allows me total control over it’s presentation. It will be something to work on for sure, but this does mean that this site will probably go through another redesign. You knew it was going to happen, it was only a matter of time. Four months to be exact. Ugh!

Stay tuned, I’m sure I can knock this out by next week.

I thought to myself several times how awesome Pandora is. A commercial free radio station built just for me delivered right to my living room stereo. Pandora is the epitome of what the internet should be, all about me. Exactly what I want, when I want it and how I want it with no strings attached.

This is why I laughed so hard when I downloaded the XM Radio app. I already subscribe to XM through the unit in my car. I think I pay around $12 a month. That price is going up however because the music industry wants more royalties so it will probably be around $15 a month. Trust me when I say I’m real close to dropping the service because of this. So when I fired up the iPhone app for the first time and I got stopped because my subscription isn’t good enough. I need to pay an additional $3 a month for online access. I laughed my ass off and then got really pissed off. Three more bucks a month for a service I already pay for, just a different delivery method? They have lost their minds! Pandora is ten times better then XM and it’s totally free.

I guess some people just don’t get it and are destined to fail. Which brings me to the newspaper industry. (LOL, nice transition eh?) What if papers adopted the Pandora philosophy of what, how and when I want it with no strings attached? Let’s tackle the money issue first. I don’t mind banner ads as long as they don’t expand, speak or move around. Just stay in the sidebar like a good ad should and I’m cool with that. There should also only be one to two ads max. Newspaper websites look like a flea market right now. It’s disgusting! I say clear it all out and charge a premium for that single sidebar placement. A single quality ad that is targeted for me might actually get me to click on it. What a concept, advertising that works!

How about the actual content? The very best part of Pandora is that I can define my radio station. I give a thumbs up to a song and it plays more like it while a thumbs down will avoid similar songs. It is constantly learning what I want. Could papers do this? Could they create content that the user actually wants and then constantly refine it until the user essentially has their own custom newspaper? How great would that be! Have a thumbs up and down on every story so that I can tell the paper, feed me more stories like this and less stories like that. Don’t take those results and apply them to everyone, just to me. Everyone would get exactly what they want and how great is that! The technology to do it is there but the mindset of the newsroom isn’t. Don’t tell me what I should be reading, I’ll tell you what to feed me and if you don’t like it then goodbye.

With so many things all competing for our attention today, it’s silly to think that users are going to continue to put up with products and services that don’t deliver exactly what the user wants, when they want and in a medium that is convenient. Look at how DVR has taken this concept and changed TV. Podcasts and Pandora are doing this right now to radio. So when will newspapers change?