Correctly formatting the Ingredients and Instructions for the hRecipe plugin will provide better SEO benefits and more attractive layouts for your recipes. However, one of the most common stumbling blocks is misformatting the Ingredient and Instructions lists.
We’re going to fix that in this article.
When you’re finished reading, you will understand
- What’s required for correct formatting.
- Why it’s important to get your formatting correct.
- How to correctly format Ingredients and Instructions using the hRecipe WordPress editor component.
First, let’s recap the first 4 months of hRecipe.
hRecipe birth and growing pains
The hRecipe plugin for WordPress has been “in the wild” for a few months now. It’s been downloaded from WordPress.org over 1000 times at the time of this writing. From the trackback implemented a couple of months ago, hRecipe has been at least tested on more than 70 web sites, and appears in regular use in around a dozen web sites.
That’s pretty good!
But there’s a lot of room for improvement.
Here’s the story: hRecipe is specifically designed to encourage ordinary bloggers to gain SEO and layout benefits for their recipes, without having to be a programmer or designer. That requires a fair bit of work from the programmers and designers!
What’s more, without a large database of users, it’s impossible to determine the best design. People use software tools such as hRecipe in ways impossible for a programmer or designer to anticipate. But the ways people are using a tool can be used to improve the tool on a step by step basis, and for helping write documentation so users can use the tool more effectively.
With this in mind, let’s take a look at what’s required for a correct hrecipe microformat.
The hrecipe microformat specification
Take a quick look at the hrecipe microformat specification. You don’t need to examine the whole page in detail (unless you want to), just skim to get an idea of how much thought has gone into the hrecipe microformat. Buried down in the page is the actual specification, and here’s a screenshot of that:
What this means is that a recipe has one or more ingredients (obvious). Here’s what’s not obvious: treating each of these ingredients as an item in a list provides powerful “machine intelligence” capabilities. For example, you could write a program to classify recipes in terms of “simple” or “complicated” by counting the number of ingredients in the recipe.
I bet you could think of other ways to use lists of ingredients. (Comments are welcome!)
Making Ingredient list in hRecipe plugin
By now, we should all agree that arranging ingredients in a list is beneficial. It won’t hurt and may help SEO, and it makes layouts more attractive.
And it’s easy.
- Write each ingredient on it’s own line
- Start each line with an “*” (asterisk)
For the Garlic Ancho Soup recipe, here’s what these two steps look like (click on picture to enlarge, or better: right click and save the image for your own use):
Remember, each ingredient on it’s own line, starting with an asterisk *.
Very easy business.
Attractive recipe display
At this point you should be questioning exactly how listing ingredients separately helps make recipe displays more attractive.
And that’s an excellent question!
The answer goes back to CSS: you are free to display your lists any which way you like!
Ok, I agree, that’s a lame answer, so watch for the next article, and we’ll take a tour through CSS list display for your recipe layouts.