That is until I came across this plugin in the Plugin repository: What Template File Am I Viewing?. The plugin is simple and works as advertised – it simply outputs the path to the current file on the front end of the site.

Rather than install the plugin, you can simply paste the following code into your functions.php file. It will output the file information until you delete or comment out the code.

add_action('wp_head', 'show_template');
function show_template() {
	global $template;
	echo '<span style="color: #000;">' . $template . '</span>';
}

There are two reasons I prefer this method over installing the plugin:

1. I changed the plugin to enable adding a span wrapper – allowing a quick color style.
2. I find this easier than installing and activating a plugin.

Spigot Design

You know you should be using strong passwords for every account, but how are you supposed to remember them? And even if you did remember a strong password, would it be secure if you used it for every account?

It’s time to stop thinking that managing strong, secure passwords is something you’ll get around to. Do it now before you get hacked. It’s so dang easy, and you’ll get a few added benefits too.

If you’re a client of ours, you’ve probably been faced with one of the two scenarios:

1. I’ve set up an account password for you that looks something like this:  DPMwT4i]dFs:H8}cm
2. I’ve mentioned many times about an application called 1Password

In the first scenario is what’s called a strong password. Note that it doesn’t contain your dog or child’s name (with a 1 replacing an l). It’s ugly and it’s impossible to remember. But that’s ok. It’s great actually (and it’s not ugly – it’s beautiful). You don’t have to remember, if you’re using 1Password.

Why you need to use 1Password

• Generate strong passwords for every site/log in you have
• Easy log in to every account
• iPhone, iPad, and Android apps – take your passwords with you everywhere

Those are just the three biggest reasons to use it. There are many other features that I use every day (Secure Notes, Software Licenses, Accounts), but these three should be enough to send you sprinting to the App Store for 1Password. Or to Agilebits.com for the Windows version.

Because if you’re using the same easy, weak password everywhere – you’re putting yourself at risk. 1Password is an application that will change your life. You’ll become better looking and more confident. Go get it.

Get 1Password now:

Spigot Design

A colleague of mine and I used say, there’s no F11 key for awesome design. This means good design takes work, and while your keyboard has a key for volume up, brightness, etc. – there’s no key for awesome design. And there’s no F11 key for awesome website either.

Building, managing, and maintaining your own website takes a bit of work, and like anything worth doing, putting in the extra time and effort to get the little things right – good copywriting, good images – makes a ton of difference. Your website will be better for it.

I’ll be writing a few tutorials on how to do some of the little things to make your site better. It’ll mostly be based around managing a WordPress based website, but most will apply to any type of CMS. Images, HTML, Links. I’m happy to help. If you want to see a specific tutorial, leave a comment and I’ll see if it’s up my alley.

Oh, and why did we choose F11? Because these go to 11, of course:

Spigot Design

Posterous, the free hosted blogging platform was recently acquired by Twitter (see the Posterous announcement here), and while they say the service will continue without disruption, WordPress.com has seen a 250% spike in Posterous imports – suggesting that users aren’t thinking the service will be around for the long haul. My guess is that it will continue for a year or so, and then quietly be ‘sunsetted’ as users slowly leave.

While I’m happy for Twitter and their newly acquired talent, it got me to thinking again about content – specifically about whose who’s controlling and owning and caring for your content.

Own it – make it yours

Posterous, as well as Tumblr and other hosted platforms, host your content on their servers. While the service is usually free, most users end up with a domain such as this: http://awesomesite.tumblr.com. This is fine for casual bloggers or for dipping your toes into owning a website, but for businesses and people who have something truly great to say, there are many reasons to take ownership of your own domain, your own brand, your own content.

Own your domain

Part of branding yourself or your business is having a great domain name. You probably already know this. It’s true that many hosted blogging platforms offer the ability to pay extra to register and use your domain. This is a great step and if you choose this route then you’re at least half way there. You’ve begun to build a brand around your domain, but the content is still hosted somewhere out of your control. This may not seem like a big deal, but if Posterous goes offline, what then? Can you get your content? Most likely yes, but what about the look and feel – the brand you’ve established, the comments and other assets?

Own your content

I’m a big proponent of owning your own content (see this post on using social media the smart way). That starts with owning your own domain, and hosting it on a server that you have control of (self hosted). Going this route ensures that you’ve stuck a claim on your corner of the web – and it’s yours. The site, the content – it’s directly accessible and if you decide to pick the entire thing up and move to a different host, you can. Minimal disruption to your visitors, and minimal work getting your content back in order.

There are many hundreds of hosts to choose from (We use Media Temple) and most offer one-click installs of popular website platforms such as WordPress or Joomla. Is this the easy way to go? No, defiantly not. There will be a learning curve.

Conclusion

The right way to market and brand your business online is to own your own domain, and host it yourself. Then blog blog blog.

No related posts.

Spigot Design

This is a quick tip for viewing the hidden (by default) User Library folder in OS X Lion. This information can be found in tons of places on the web – I’m putting it here for easy reference for myself. Any you. Favorite it.

To permanently* show the user ~/Library folder in OS X Lion, fire up Terminal and enter this:

chflags nohidden ~/Library/

To hide it again, enter this:

chflags hidden ~/Library

* I have to run this command from time to time. Seems Lion reverts itself once in a while. So take permanently with a grain of barley.

Spigot Design

A paper route was my very first job as a kid, starting in 6th grade. The thing I got up so early in the morning for? A 1/10 scale RC car called The Frog, by Tamiya. A couple of friends and I saved up for months to buy these cars (Eric had The Hornet, and Steve had The Ultima) and we tinkered and raced and loved them. Putting them together was part of the process – The Frog came as a big box of parts and a book on how to assemble.

I have no idea what became of my old beloved Frog. I suppose I grew out of it and left it behind when I went off to college. Nostalgia.

How excited was I when I heard that Tamiya had reissued The Frog (and a few other models like The Hornet)? Well I was even more excited when Eric sent me an entire Frog kit – with the radio, battery, and charger too!

My son and I are going to have a blast putting it together. Maybe I should make him deliver papers for a few months first…

Spigot Design

I’ve never been much of a Post-It note type, but I have gone through many Moleskine notebooks to jot down notes and ideas. And while I still enjoy pencil and paper for quick brainstorming or design concepting, they aren’t great for staying organized. Paging through a notebook to find some bit of information is a real pain.

Dedicated note taking applications are the answer to this. There are quite a few out there (Check this Lifehacker article on the Five Best Note Taking Applications). I’ve used Evernote for over a year now, and I find it indispensable. Here’s the criteria I used for choosing it:

• Ability to organize notes in categories (Evernote calls them Notebooks)
• Ability to tag notes
• Ability to sync across all devices and computers
• Ability to Share notes

Notebooks and Tagging

These are the obvious reasons to use a note taking application. Organizing things into separate notebooks, and the ability to tag notes makes things easy to locate and keep tidy.

Syncing

One of the great things about Evernote is that it’s web-based (cloud-based if your cool). This means I can take a note on my iMac, and it will show up everywhere – my laptop, iPad, and phone – and vice versa. There’s also browser extensions for saving web pages, although there’s better ‘read it later’ apps for that – like Instapaper.

Sharing

Evernote’s sharing ability is perhaps the crown jewel – You can share a notebook with a single person, or publish it to the world (here’s a link to a new WordPress Training Notebook: https://www.evernote.com/pub/spigotdesign/wordpress). You can easily stop sharing any time too.

Other Cool Stuff

Here’s a few other features that I really like:

• Take audio and video notes
• Share documents and images
• Auto save
• It’s free!

Do you use a note taking app? If so let us know below in the comments. And feel free to share any note taking tips you may have!

Spigot Design

As a designer, Pantone’s annual announcement of their Color of the Year is usually just an interesting tidbit of information that, once digested, gets half heartedly tucked away in my brain. I’ve never used it as a basis for a design, and I can’t say I’ve ever seen it influence design trends in general. Until now.

← This is the fancy new ski shell from Flylow I’ve sported this year that, unbeknownst, has shot me into the Pantone trendosphere. While it may not be a perfect match to this year’s color (Pantone 17-1463 Tangerine Tango) it’s close enough that I see folks point and nod, marveling how a simple ski shell can be such a harbinger of the times. Oh Pantone, you know us so well.

Regardless of the color, this shell is far and away the best I’ve worn. It’s comfortable, durable, and dry. Flylow is sneaky good. Solid gear, and ON IT with color trends. Get sum: http://flylowgear.com/

PS: And no, I’m not pushing Flylow because I work with them. Yet.

No related posts.

Spigot Design

It was a short run, but Off the Grid is now kaputz. It was meant to be a place to write about life and adventure – kept separate from the design and web related posts I normally write about here on the Spigot blog. But it’s simply too much to keep up with both, plus our kids blog.

But while we’re bringing down the curtains on OTG, it’s not necessarily good night. I thought for a while of starting a Tumblr site for these posts because I’d like to get to know the software. But all I’d be doing is extending the same issues to a new learning curve. So instead I’ll be be posting them here, on the Spigot blog. Where they were really meant to be in the first place.

To keep up with these posts, let Life (category) be your guide. Or if your RSS savvy, get the Life feed.

Good night, OTG, and good luck.

Spigot Design

Like many designers, I prefer my computer desktop to stay clean, organized, and clutter free. It’s not a place to hold files or applications, and it’s definitely not a place for a splashy, obnoxious image. Still, the desktop is a nice place to express creativity, so lets not be boring here.

Even though there are many places to get quality, free, minimalist desktop images (try Simple Desktops), I usually roll my own. If you’d like to roll the same way, feel free to download, use and abuse our Free Minimalst Desktops*.

Here’s an initial set to get started with. I’ll add more to spigotdesign.com/desktops/ as I feel moved.

Holiday 2011

The Spigot

Simple Blue Gradient

*Warning: Some of these may contain the Spigot Logo and/or attribution.

Spigot Design

While most of the world is going wireless, I’ve recently switched back to my wired-up, fully extended keyboard. Here’s a rundown of the pros, cons, and why I did it.

Apple Wireless Keyboard

The wireless version is the default choice when purchasing a new desktop Mac. While I could have opted for the wired version, I kept the wireless expecting to reap all the benefits of joining the wireless world. What are those benefits?

Pros

• No wires
• Sleek, Shexshy, and responsive

Cons

• Missing a ton of features the full keyboard has

The supposed benefits are increased flexibility/mobility, and reducing clutter. Since I don’t move the iMac at all, and a sleek white wire hardly adds to my desktop clutter, neither can be considered a true benefit.

Apple Keyboard with Numeric Keypad

When I upgraded to the low profile, aluminium Apple keyboard (from the earlier Apple Pro Keyboard) I thought I’d found keyboard heaven. I did. Here’s why:

Pros

• Sleek, Shexshy, and responsive
• Dedicated numeric keypad with basic math operators
• Dedicated forward delete
• No need for a fn key
• f13 – f19 keys
• Control/Option/Command/Spacebar symmetry
• Two extra USB connections (unpowered)

Cons

• Unsightly wire
• Can’t type 25ft away from my desk

Conclusions

I honestly can’t see a scenario where a wireless keyboard is better when using a desktop computer. The limited functionality just can’t be compensated for. So I’m back to being a fully wired, happy typing camper.

Now, if I can just figure out how to get this wireless version to connect to this iPad…

Spigot Design

There are a ton of email etiquette rules out there that are good to know and follow. One that’s rarely addressed is this See Below scenario:

You’ve been replying back and forth with a friend and decide you need to bring in another friend for their opinion. So on the 8th reply you CC this second friend and simply say “see below.”

Awesome, now I get to read through all your earlier emails and signatures and attached signature images to try to parse out what you’re asking of me.

Rather, do this

1. Quickly summarize what you and friend 1 have been discussing
2. Ask a direct question
3. Bask in email etiquette happiness

For more fun email don’ts, check out how to make The Oatmeal hate you.

Spigot Design

Our son Tory got to bring his preschool class’ pet Bearded Dragon, Shiny, home for the Christmas break. Surprisingly cute. Eats mealworms and crickets. Our cat Ollie was briefly interested in a protracted staring contest through the aquarium glass, but thankfully he’s moved on. Also thankful he lacks the dexterity to open the lid.

Spigot Design

I woke up early this morning to find the moon looking a little funny. A quick search on the Google told me it was a lunar eclipse!

Spigot Design

Overall, I really like Apple’s iCloud service. Moving back to Apple after dropping MobileMe back in late 2009 has been relatively painless; The setup was simple, the service is automatic, and it’s free.

The two items I dig the most are iCal and Address Book syncing, both of which have worked flawlessly. Safari Bookmark syncing comes in a pretty close third, but getting them to sync cleanly has been somewhat of a bumpy road. In the last week, bookmarks have come and gone, been duplicated, deleted, returned, and finally gone away all together.

I’m sure Apple will create an easy way to manually flush bookmarks, but until then here’s how I got everything back in order by forcing a reset of iCloud:

1. Turn off Xmarks

I’ve used Xmarks since dropping MobileMe, and while I don’t know for sure, it’s possible that Xmarks could be the root cause. While it would be nice to keep syncing between Safari, Firefox, and Chrome, it’s more important for me to sync to an iPad and iPhone, so bye bye Xmarks. If you don’t use Xmarks then you can skip this step, of course.

2. Turn off iCloud bookmark sync on all devices

On every Mac, iPhone, iPad, iWhatever – I opened up iCloud preferences and turned off Bookmark Syncing. On the iPad and iPhone, the device asked to keep or delete bookmarks; I clicked delete.

3. Find the best bookmark backup you have

Safari bookmarks are all stored in a file called Bookmarks.plist, which is located at User/Library/Safari/. If you don’t see the Library folder check out the article Permanently Show Library Folder in OS X Lion for an easy way to show it.

Using Time Machine I went back a few weeks to when my bookmarks were in somewhat decent shape and replaced the current Bookmarks.plist file with the older (better) one. If you don’t use Time Machine or other backup system then you’re SOL and will have to fix you bookmarks without this head start.

4. Correct bookmarks on your Mac and make a backup

If you’re lucky, your backup version of Bookmarks.plist will have gotten you most of the way to bookmark bliss. Make what ever changes you’d like in Safari, then make a backup. I did this by dragging the Bookmarks.plist file to the desktop. This will force Safari to create a new Bookmarks.plist file upon restart.

5. Delete bookmarks on all devices

Delete all bookmarks on every computer. iPhone and iPad bookmarks should have been deleted in step 2. If this seems counterintuitive, just remember, you’ve got a backup. Right?

6. Turn on iCloud Bookmark Syncing on your Mac

Once you enable Bookmark Syncing on your Mac, you’ll be prompted to ‘merge’ bookmarks with iCloud. This should flush the iCloud system. Or that’s the hope.

7. Restore bookmark backup file

Shut down Safari, and drag the good Bookmarks.plist backup file from the desktop back into User/Library/Safari/ and restart Safari. In a minute or two iCloud should be updated with the latest bookmarks.

8. Turn on bookmark syncing on all devices

Restore syncing to each device, and wait for iCloud to update.

Issues you may run into

Going through these steps I ran into a few issues, and you may experience the same:

Deleting bookmarks would sometimes crash Safari

I had a ton of old bookmarks imported from systems past that seemed to hang Safari when I tried to delete them. I had to force quit and restart numerous times. All the old bookmark cruft is gone though!

Restoring bookmarks to all devices took some time and a little prodding

Once I turned syncing back on each device remained blank for quite some time. I’m not sure why but I was able to prod the system along by adding a fake bookmark on another device. This seemed to kick everything into gear and I was able to delete that fake bookmark on different device – which eventually deleted it across all devices.

References

I didn’t stumble across this info on my own, here’s a couple of articles that I used to pull my method together:

• http://apple.stackexchange.com/questions/29090/how-can-i-reset-the-safari-bookmarks-in-icloud
• https://discussions.apple.com/thread/3375297

Spigot Design

Kari and I have been canyoneering for many years now, and it’s one of the main reasons we decided to move back to Utah. We were lucky to get a few days away recently and headed down to North Wash to help Tom Jones celebrate his birthday.

Allison and Bryan Godlewski (Park City friends) joined us on Friday for a hike down Boss Hog canyon. This was their first time technical canyoneering and proved to be skilled naturals. Boss Hog is a beautiful, tight slot that requires a bit of stemming high up off the ground – typical of what you’d find in the area. The high stemming isn’t hard, per se, but if you make a mistake a fall would be a big bummer to say the least. It was a slightly chilly day (in November, imagine that…) but we warmed up quick with all the scrambling and stemming.

We got in a couple more canyons over the weekend, but we’re still missing a point and shoot camera to take on trips like this. Thanks to Allison for bringing one on this day, it’s been a rare treat for us to get decent canyoneering pics.

Spigot Design

It turns out my interior design sense is as clean and simple as my graphic design style. I prefer design that is modern and uncluttered; breathable yet punctuated with contrast.

I’m also a fan of the Macintosh. While I haven’t been using one since 1984, it’s been a big part of my life and career for over a decade.

So when I came across @kottke‘s article on Susan Kare’s sketchbook, and it led me to Susan’s Limited Edition Print site I immediately began making note of all the places in the office these prints would fit.

Here’s a few of my favorite:

Can’t wait to see some of these on the wall.

No related posts.

Spigot Design

After adding a text-based Facebook link to the site, it’s seemed a sensible idea to add a similar text-only link for StumbleUpon.

For WordPress, add the following code in your templates:

<a href="http://www.stumbleupon.com/submit?url=<?php the_permalink(); ?>&title=<?php the_title(); ?>"> Stumble</a>

For other CMS platforms replace the URL and title with the proper code variables. If you’re still rocking straight HTML, change these to the real URL and titles:

<a href="http://www.stumbleupon.com/submit?url=http://example.com/your-awesome-article&title=Your Awesome Article Title">Stumble</a>

Spigot Design

I missed Mike Payne’s WordPress SEO, A Comprehensive Pre-Launch Checklist presentation at this years WordCamp Salt Lake City, but thankfully WordPressTV has posted this and a few other videos from the day for your posterity and mine.

The video may be titled WordPress SEO, but a lot of what Mike talks about is relevant to any site or CMS. Most of it actually.

Some of the topics covered:

• SERP
• SEO vs PPC
• Keyword Research
• Keyword Placement Factors
• On Page Optimization Factors
• SEO WordPress Plugins
• Social Media, Blogging, and Making a Plan

Spigot Design

Here’s a quick tip on how to crop any sized image through CSS and an extra div. This technique comes in very handy when building websites for clients who don’t have Photoshop, or understand what 360px x 240px means. In an ideal world every image is edited and cropped before it’s uploaded to the site, so that it fits perfectly where it’s supposed to. Unfortunately that’s not how it works and many sites end up with squished, stretched, or highly pixellated images.

The key to this technique is to wrap the image you want to display in a container div, which we’ll give a specific height and width. We’ll then give the image a width of 100% just in case the user uses an image that’s too small. Here’s the code:

The html:

<div class=”container”>
<img src=”http://your-source.com” alt=”alt” />
</div>

And the CSS:

.container { width: 418px; height: 240px; overflow: hidden; }
.container img { width: 100%; }

The real key there is the overflow: hidden; part. It prevents any image that is larger than the crop area from being displayed. Adding width: 100%; is only helpful when the user uploads an image smaller than the are you want cropped. The image will be enlarged to fit the area – which may result in some pixellation – so if crisp images outweigh the need for them to fit correctly, just skip that part.

Happy cropping! And leave a comment.

Spigot Design