Getting Clever with WordPress Smilies

Posted September 19th, 2007 by Mike Cherim

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. :beast:

6 Responses to: “Getting Clever with WordPress Smilies”

  1. David Zemens responds:
    Posted: September 19th, 2007 at 5:29 pm

    As always, another great idea. I implemented it as a “The End” end-of-file graphic. Scroll to the end of this post and take a look at how it works.

  2. Joe Dolson responds:
    Posted: September 19th, 2007 at 6:01 pm

    Hey, that’s a great idea…very clever! ;)

    I might just have to steal the idea soon…


  3. Jermayn Parker responds:
    Posted: September 19th, 2007 at 11:04 pm

    That is a great idea and what is even better is that I can use it for a clients website at the moment, thanks mate (you dont mind do you??).

  4. Rob Mason responds:
    Posted: September 20th, 2007 at 8:41 am

    I wish I was as bright as you…my bulb only has a very dim glow :(

    Great idea…I will be borrowing it.

  5. Phantom Smilies responds:
    Posted: September 24th, 2007 at 10:37 pm

    […] Although these smilies are for forums, you can also use them for many other things including WordPress websites, Mike Cherim just recently published some articles on how to use customised smilies for your WordPress website. […]

Sorry. Comments are closed.

Note: This is the end of the usable page. The image(s) below are preloaded for performance only.