Beast-Blog.com
Getting Clever with WordPress Smilies

The simplest markup is difficult for some people. It’s not that it’s hard (really, it’s not hard at all), but they are intimidated by the unknown. They suffer from FUD: Fear, Uncertainty, and Doubt. They may be worried about making a mistake and having their web site blow up and end up as some radioactive mushroom cloud, floating over the internet for all to witness. Of course we know these fears are unfounded, and we can even try to explain and simplify processes to the best of our ability, but often fear is deafening; a loud roar that blocks out reason. We are powerless to change this, but there are little things we can do if desperation and imagination are all that’s left.

The Facts

As I wrote, some markup is hard for some people to wrap their head around. Simple image markup is one example. The markup example below, for instance, is akin to understanding the speaking of tongues or the meaning of life for some people:

<img class="right" src="images/sold-icon.jpg" width="80" height="15" alt="" />
<!--The class, of course, is optional. Everything else should be there.-->

This was the case when this issue came my way begging for a solution. It came about like this:

The Problem

As I finish up a rather large site I’m making (can’t wait), I’ve been filling in some gaps with a smaller project. Specifically a little shop site. The person who owns the site sells one-of-a-kind jewelry pieces. Much of the jewelry that will be shown in her shop will already be sold, but she wants to leave it there so visitors can see it and perhaps have a similar piece created (think portfolio). A totally understandable request. She went on to request that she wanted to add an image/icon to show it was sold, to be sure nobody would miss the fact and order something that wasn’t actually available right away. Doing this by adding image markup to the item display wasn’t an option. I had to get creative.

I immediately thought of a PHP solution. I was about to get started on it when the little light bulb that hovers over my head began to glow. Since the shop items are to be displayed on a regular WordPress page, that opened up some possibilities. One of which was the use of smilies.

The Solution

Hmm. Smilies. The PHP solution I was after, I realized, was at hand already. I had nothing to do but make a small image, quickly add a single line to a core WordPress file (vars.php in this case), and take accessibility into consideration. Specifically I made a “Sold” icon then called it a smiley. Now, to show the item as sold, the site owner has to do nothing more than add [SOLD] — written just like that for the greatest level of accessibility — directly to the item description. She told me: “Wow, that’s easy.” Mission accomplished.

Do see the possibilities here? Any small image that will be used often on a WordPress powered site or blog can be done this way (say a small logo at the end of each post, etc.). It really doesn’t matter and it really doesn’t get much easier. I don’t recommend doing this with large images since the smiley markup line lacks the image width and height (which is what allows this to be a viable solution to begin with), but for the small stuff, this is good deal.

More Information

Want to know more? I’ve written about WordPress smilies before, specifically how to make your own. Read that post, then the how-to for this post will be known. And in the end you’ll offer one anti-FUD solution to the most intimidated of clients. I’ve discovered that with a little imagination, WordPress smilies can make life richer and easier — especially if you make sites for others.

Filed under Imagery & Graphics, WordPressing —

Bookmarking Links » del.icio.us | Digg | blogmarks | StumbleUpon | Technorati |

These posts may be related:

Adding your own WordPress Smilies »

Beast Blog Theme for WordPress »

The Best of the Beast in 2007 »