WordPress: Display all images attached to a post/page

NOTE: Nov 20, 2013 – This post has been updated to include more examples from the comment thread. View the updated post here »

You’ve probably struggled with the default output of the WordPress gallery shortcode. It’s OK. We all have. By default, WordPress wraps the entire gallery in a div, and then further wraps the images in dl & dt tags.

There are a few, excellent WordPress image gallery plugins that address gallery shortcode styling (File Gallery Plugin), as well as the invalid XHTML code (Cleaner Gallery Plugin). These plugins work great for many things, but they also add a lot more functionality.

If all you want to display is a simple list of all the image attachments that are attached to a particular page/post, and you just want the img tags, there’s a much easier way to do it.

Read More

.PNG vs .GIF w/ matte color

Working with Transparent Images – .PNG vs .GIF

This post discusses the use of transparent images on the web. The 3 most common image file types — .png, .gif, .jpg — have their pros and cons. But some are definitely more effective for achieving transparency with cross-browser support.

Thanks to Jeffrey Zeldman for teaching me some of the following techniques in his book, Designing with Web Standards. You should buy it. It’s fantastic.

Read More

Get Marketing Ideas from Pinterest

As any creative agency will tell you, there are literally thousands of ways to arrive at a creative marketing idea. And there are millions of sources in which to find marketing ideas. But this process can be time-consuming. So how can you efficiently search for relevant ideas?

The answer: Pinterest.

The web’s largest collection of marketing ideas

Pinterest is not the web’s most popular social network (yet) (although it’s being visited more & more each day), it is the largest collection of nothing but ideas. It doesn’t have

  • all the advertising & irrelevant comments on Facebook
  • the ridiculous “trending topic” #hashtags of the Twitterverse

Without any real clutter, you can search for exactly what you want, and start sorting through ideas.

Find a particularly good pinner, and surf around her boards for a bit.

Pinterest Search

One of the nice things about Pinterest’s search results is how you can search Pins, Boards or People. For idea collection, I’m not sure the People search is very helpful, but switching between Pins & Boards is useful.

If you’re not finding what you’re looking for using Pinterest’s Search, try using Google instead. Search for “pinterest christmas card” on Google.

Holiday Card Example

We are currently helping one of our clients come up with a creative, interactive Holiday Card for the end of the year. It will be web-based, and probably promoted via several online channels (personal emails to client, social media, etc.).

Although most of the creative ideas on Pinterest are DIY, hand-crafted, non-digital ones… that doesn’t mean we can’t use them as ideas. In the early brainstorming stages, anything goes. Allow your mind to go free, and just start looking around.

I found this pin:


Although it’s a bunch of little kids with chalkboards, I still see an idea for our professional services client in the geospatial industry.

  • Replace the little kids with big kids (aka: our client’s employees)
  • Swap out the chalkboard with something else to hold the word
  • Write a hobby, or something fun you enjoy doing outside of work – or, write a brief holiday message

This pin:


…gave me the idea to spell out each of the company’s 6 location, but using the employees bodies to do so. Have them each lie on the ground, and spell out “Seattle” or “Minneapolis”. Then take an aerial photo (which is one of their specialty services) of everything.

Or this pin:


This one just gets your mind thinking about silhouettes & shadows. It encourages you to think from a different perspective.


There are many ways of coming up with creative marketing ideas, but Pinterest is a quick, efficient, simple way to start the brainstorming process. Give it a shot, and let me know what you think.

How are you using Pinterest to generate marketing ideas for your company? I’d love to hear about it in the comments.

How to refresh browser, web page

When we make changes to a clients’ website, they often don’t see the changes right away. This is because their browser (Internet Explorer, Firefox, Chrome, etc.) has cached web pages. When a browser caches a web page, it stores a local copy on the visitor’s computer. This speeds up the page load time so the visitor can view the information faster when they visit the page again.

In order to see changes made on a website that you have already viewed, you’ll need to refresh the web page. The process is different depending on which browser you are using. Find your browser below, and follow the instructions to refresh the web page.

Refresh Browser – Chrome (Mac)

At the top of your screen, go to “View” > “Reload This Page”.

Shortcut: command + R

Refresh Browser - Chrome (Mac)
Screenshot of how to refresh web page in Chrome on a Mac

Refresh Browser – Firefox (Mac)

At the top of your screen, go to “View” > “Reload”.

Shortcut: command + R

Refresh Browser - Firefox (Mac)
Screenshot of how to refresh web page in Firefox on a Mac

Refresh Browser – Safari (Mac)

At the top of your screen, go to “View” > “Reload Page”.

Shortcut: command + R

Refresh Browser - Safari (Mac)
How to refresh web page with Safari on a Mac

Refresh Browser – Opera (Mac)

Opera for Mac does not have a menu option for refreshing a web page. Use the keyboard shortcut (below).

Shortcut: command + R

Windows Browsers, including IE, coming soon…

PHP Files Downloading, Not Displaying, on MediaTemple (dv) Server

I recently ran into an issue with my PHP files being downloaded instead of displayed. I run multiple sites on a MediaTemple (dv) server. All the sites I setup previously were unaffected, but this new site was still having issues with all PHP files. This issue is actually with the Parallels Plesk Panel.

Upgrading Parallels Plesk 10.4

When you upgrade to Parallels Plesk Panel 10.4, the Plesk control panel changes quite a bit. It appears that some of the defaults change, too.

Login to Plesk as the specific webspace that you are having trouble with.

Click the “Websites & Domains” tab.

Scroll to the bottom and click on the name of your domain.

There are quite a few options on this page. They used to be enabled by default, but now you have to manually enable them after setting up a domain.

To enable PHP files to display (instead of download), you need to check the box that says “PHP Support”. It’s up to you how to run it, but the default used to be “as Apache module”, so unless you have reason to change it, I recommend sticking with that.

The image below shows what all the default options used to be. If you are running Ruby on Rails, or any other platforms, you’ll want to enable them as well.

SSL Support on MediaTemple (dv) Server

The SSL Support is only needed if you are using an SSL. Don’t worry that there are no SSLs listed. The actual SSL certificate is assigned & managed at the main server level. So as long as you’ve set that up properly on the server, checking this box is the last step you need to enable SSL for the domain.

Time Flies. But Do You Know What Doesn’t Fly?

{ might want to rethink the title }


How can something both fly & not fly? Hear me out. I think you’ll like where I’m going with this. At the very least, it’ll give you a different perspective on how you view your time.

“Where did October go?” “I can’t believe Christmas is right around the corner?” “Is it really the 30th already?”

We’ve all said it at some point. And we’re all insinuating that time moves extremely fast. What’s here one minute… is gone the next. Time flies.

Then you hop on Facebook on a Monday morning. Or Friday afternoon. Post after post after post about “can’t wait ’til the weekend,” or “case of the Mondays,” or “ugh, longest day everrrrrr.”

Time flies when we want it to last forever. And it moves at a sluggish pace when we want it to fly. Sounds to me like we’re trying to take advantage of it. Manipulate it to do what we want it to.

Time is one of the true constants in this world. I can’t think of anything more consistent. More predictable. Or more reliable. Seriously, has lunch time ever stood you up? Has night time ever failed to turn off the lights? Dinner time ever failed to produce awkward table conversation with your two teenage daughters? (OK, maybe that last one isn’t always true, but you still ate dinner, right?)

The reality is that time doesn’t fly. And it’s not a snail, either. To quote one of my favorite – and most useless – phrases of all time: It is what it is.

Now that we agree time is consistent, predictable & extremely reliable…

does it make sense for us to complain about it? If your best friend/wife/husband/mother/brother consistently drove you to all your soccer games… predictably bought you awesome Christmas gifts year after year… and you could always rely on them to be there… would you complain to them?

{ Needs a little more to finish it up }

WordPress: Search Custom Post Type(s)

I’ll admit, the default WordPress search engine is not the most robust. However, there are a few ways to customize it. One of the most common requests is, “How do you limit a WordPress search to a custom post type?” Below, I explain how to display results for one post type, as well as multiple custom post types.

Limit WordPress Search Results to 1 Custom Post Type

If all you want to do is limit your WordPress search to a single custom post type, add the following line of code inside the <form> on your searchform.php template.

<input type="hidden" name="post_type" value="your-posttype-here" />

Depending on how you have customized your searchform.php template, it should look something like this:

<form id="searchform" action="<?php echo esc_url( home_url( '/' ) ); ?>" method="get">
	<input type="hidden" name="post_type" value="your-posttype-here" />
	<label class="assistive-text" for="s">Search</label>
	<input id="s" class="field" type="text" name="s" />
	<input id="searchsubmit" class="submit" type="submit" name="submit" value="Search" />

Limit WordPress Search Results to Multiple Custom Post Types

If you want to limit your search to more than one custom post type, you have to go about it a slightly different way.

Add the following lines of code in the same place in your searchform.php file:

<input type="hidden" name="post_type[]" value="post_type_one" />
<input type="hidden" name="post_type[]" value="post_type_two" />

Replace post_type_one and post_type_two with the name of your custom post type.

This works mainly because WordPress’ WP_Query object can handle the post_type parameter as an array.

Thanks to John Sparrow for this code snippet.

Salesforce Web-to-Lead Wufoo Integration

We love Wufoo, and use it on several sites. For those who use Salesforce, you’ll be glad to know that Wufoo has integration for Salesforce built-in.

How The Wufoo/Salesforce Integration Works

Once you enter your Org ID & password, connect all your fields, and finish the integration, Wufoo form submissions will automatically create a Lead in Salesforce and attach a note with all the data from the form.

The problem for some is… not everyone wants a note created. You might want data sent directly to the phone, email, website, etc. fields already in Salesforce. The alternative…

Use Salesforce Web-to-Lead with Wufoo Forms

There’s a different way to setup your integration. This will allow you to send form data directly into Salesforce’s native fields, without creating a separate note.

* This requires a paid version of Wufoo. At the time of writing, an Ad Hoc plan for $14.95/mo. is all you need. This is required in order to redirect the user to a webpage after form submission.

The rest of the article will be published soon…