Leslies Blogger: How to Include Recipes in WordPress Posts

In this video tutorial, you will learn:

How to install and activate the JetPack plugin.
How to activate JetPack’s Recipes shortcode.
How to find the Image URLs from the WordPress Media Library to be used within your recipe.
How to use the Recipes Shortcode to easily add search engine friendly Rich Recipes with Print Buttons in WordPress.

To activate the Extra Shortcodes in JetPack:

From within your WordPress Dashboard, go to JetPack, then Settings.
Click on the Writing link across the top.
Activate Shortcode Embeds.

If you would like to include an image within your recipe, the shortcode requires that you include the full URL for the image.

At this point, I will insert a 4 minute video that walks through the process of getting image URLs from the Media Library. Feel free to skip through if you already know how to get these URLs.

Finally, let’s go through the steps for creating a recipe in WordPress.

To create a recipe in a Post:

From within your WordPress Dashboard, go to Posts, then Add New.
Give the Recipe Post a title.
Open and close your Recipe shortcode now by typing: open square bracket, the word recipe, then a closing square bracket. Press Enter a few times, then open a square bracket, type in a slash, then the word recipe, then a closing square bracket.
Next, add in the main recipe properties within the opening of the recipe shortcode. Just after the word recipe in the opening shortcode, add a space, then include a title wrapped in quotes.
Press space, and include the servings property and enclose the value in quotes.
Press space, and include the time property and enclose the value in quotes.
Press space, and include the difficulty property and enclose the value in quotes.
Press space, and include the image property and enclose the value in quotes.
Press space, and include the description property and enclose the value in quotes.

Now, between the opening and closing of the recipe shortcode, you can add any other text, images, HTML, videos, etc.

Let’s add some of the additional shortcodes that complement the recipe shortcode.

It’s not a bad idea to include a “notes” section for your recipe. This can be used to indicate the source of the recipe for example. Let’s include a notes section now.

To include a “notes” section within your recipe:

In between the opening and closing of the recipe shortcode, wherever you want the notes to display: type an open square bracket, then type recipe-notes, a space, the word title, equals, then the title you want to use for this section wrapped in quotes, then close the square brackets.
Now include any text and/or HTML you want to display for this section.
Then close the “notes” section by typing: open square brackets, a slash, then recipe-notes, then a closing square bracket.

Now, let’s add an “ingredients” section.

Start by opening the square brackets, type recipe-ingredients, then a space, then include the title property and enclose the value in quotes, then close the square brackets.
Press Enter a couple times, and then close the recipe-ingredients shortcode by typing: open square brackets, a slash, then recipe-ingredients, then a closing square bracket.
Now, go back between the opening and closing recipe-ingredients shortcode and type each ingredient on a new line. If you want them to be a bulleted list on your web site, prepend each ingredient with a dash and a space.

Now, let’s add a “directions” section.

Start by opening the square brackets, type recipe-directions, then a space, then include the title property and enclose the value in quotes, then close the square brackets.
Press Enter a couple times, and then close the recipe-directions shortcode by typing: open square brackets, a slash, then recipe-directions, then a closing square bracket.
Now, go back between the opening and closing recipe-directions shortcode and type each direction on a new line. If you want them to be a numerical list on your web site, prepend each ingredient with the step number, a period, and a space.

You may use as many Ingredients and Directions sections as you like, and you can use the Insert Media option to include images or videos above or below each section.

Now, Save and Preview your recipe.

Feel confident that using the Recipes shortcode in this way, that your recipe is “marked up”, using what is called hRecipe microformat, to give search engines, and other sites like Pinterest, the ability to display your recipe in an attractive and informative way in their “rich” results.

Plus, it has the added value of automatically having a working Print button!

How to Include Recipes in WordPress Posts shared from Tipsandtricks-HQ

How to Include Recipes in WordPress Posts syndicated from Aileen Batts Blog