How To Add And Embed A Printable Recipe To Your WordPress Blog

Since starting a new blog, I have spent hours scouring the web for any and all tips I could find. There are so many things to learn. WordPress has made many things very easy and somethings require a little more research. Basically, for me, it seems to come down to knowing the right search term to stumble onto the exact information I’m looking for. I decided that when I found the perfect info and implemented it on my blog that I would pass it on to other bloggers who might need some assistance. I figured if I was searching for this info then someone else out there might be too. In this post I will explain how to add an embedded recipe to your WordPress.com blog using shortcode. Using this shortcode will help set your recipe apart from the rest of your blog post.

If you are like me and don’t have a blog theme meant for just straight up recipes but still would like to be able to add a printable recipe, then you’ve come to the right place. It is really easy to do and I’ll give you step by step instructions.

Let me show you how to add and embed a printable recipe to your WordPress blog.

On WordPress.com you can add a shortcode to embed a recipe to your post. This will give you formatting, some metadata, and your readers the option to print the recipe. You can also include other attributes such as, title, servings, time, and difficulty. These attributes will also help search engines index your recipe properly. The first four attributes I listed can be customized and the print attribute will automatically be added by default if one of the first four are added.

Now onto the the recipe shortcode…

If you are thinking…I have no idea how to write code. Never fear WordPress makes it really simple with shortcode. You don’t have to be a tech genius to do this. I promise! The great thing about adding the recipe shortcode is that you don’t have to switch from visual to text view in your post. You just add the shortcode right to the visual view of your post. To add a recipe short code, you will insert the opening [recipe] and closing [/recipe] tags. This will set the recipe apart from everything else on your page. Here let me show you what I mean.

In the following display I have added the recipe shortcode opening including the attributes I wanted to display. Then wrote out my recipe using bullets to improve the look, followed by the directions and a link back to my blog. Finally, I added the recipe shortcode closing.

(Updated Feb 2017- Do not copy this section…The shortcode you need to copy is at the bottom of the post.)

[recipe title="Frito Corn Salad" time="10 mins" difficulty="easy"]

Ingredients

  • 2 cans corn, drained
  • 1/2 cup chopped celery
  • 1/2 cup chopped onion
  • 1/2 chopped bell pepper
  • 1 cup mayo
  • 1 1/2 cups shredded cheese
  • 10 oz bag Chili Cheese Fritos

Directions

Mix together all ingredients except the Fritos. Refrigerate until ready to serve. Stir in Fritos until well blended when serving.

www.easypeasypleasy.wordpress.com

[/recipe]

That is the view you will see while writing your post. Now let me show you what it will look like once your post is published.

(Updated Feb 2017- Do not copy this section…The shortcode you need to copy is at the bottom of the post. This is what it should look like in your preview mode.)

Frito Corn Salad

  • Time: 10 mins
  • Difficulty: easy
  • Print

Ingredients

  • 2 cans corn, drained
  • 1/2 cup chopped celery
  • 1/2 cup chopped onion
  • 1/2 chopped bell pepper
  • 1 cup mayo
  • 1 1/2 cups shredded cheese
  • 10 oz bag Chili Cheese Fritos

Directions

Mix together all ingredients except the Fritos. Refrigerate until ready to serve. Stir in Fritos until well blended when serving.

www.easypeasypleasy.com

There is no need to worry about the recipe display if it is your first time using shortcode. Just hit the preview button to make sure it is all working out properly. Don’t forget to use the Recipe shortcode closing. I did that a few times…lol!

Now you can see how using the recipe shortcode will set your recipe apart from the rest of your blog post. I also love that myself or someone else is able to print the recipe. Maybe you want to take the print feature off and still use the recipe shortcode to set your recipe apart from the rest of your blog post. That is totally possible. You can hide the print button by adding print=”false” to your attributes.

To make it even easier for you I am providing a way to just copy and past the Recipe Shortcode. Then change out the information to fit your recipe. Remember you can add attributes and take off the attributes you don’t need.

(Updated Feb 2017- Copy this section. Change out the wording between ” here”. Copy and paste this in your visual view not the text view.)

[recipe title="Frito Corn Salad" servings="10-12" time="10 mins" difficulty="easy"]

Put your recipe here.

[/recipe]

This is a tutorial on how to add and embed a printable recipe on WordPress.com

I hope this tutorial on adding an embedded printable recipe to your WordPress.com blog has been helpful. If you have any questions, please feel free to ask.

Don’t forget to sign up and follow to get all my Easy Peasy tips!

39 thoughts on “How To Add And Embed A Printable Recipe To Your WordPress Blog

  1. Nice, thanks for sharing. And you’re right, I am looking up things like such. One thing I’ve found is called plug ins. Some cost though. Word press plug ins, look them up ?

  2. This is a great post! I’m lucky, and Sam actually stumbled upon this when we first started blogging, but I never would have found it on my own! It really makes blogging recipes so much easier and I love that there’s a quick “print” function so that our readers can use it with ease!
    –Brittany

  3. This is absolutely brilliant. I was so excited when I printed out my first recipe using this short code I squealed a little. That’s a bit embarrassing when you are in the middle of the public library. Thanks you for this very useful piece of information. Julie

    • lacier77 says:

      Hey Alexandra. I’m not sure what that could be. I use this on every recipe. Are you scrolling down towards the bottom of the post and copying from there? If you copy and paste that, you don’t have to add to text view. I’m here if you can’t get it to work, send another comment.

        • lacier77 says:

          Hey Alexandra. I used this yesterday and it worked. Let me get my computer pulled up and I’ll try to get the same message you’re getting so I can point you in the right direction. I’ll be back with you in a few minutes.

        • lacier77 says:

          Hey Alex, I’ve tried to get the message you are getting with no luck. I’m not sure what to tell you but I still would like to help you. You could screen shot and email me the visual and text format pics. That way I could see exactly what you are experiencing. My email is in the menu under contacts.

  4. Rose Lane says:

    I have never posted on a blog in my life, but you are truly my favorite person in the whole word right now for posting this information. I have been struggling forever trying to figure out how to do this. I am so glad that I found your blog today because I just now did what you said and it was easy peasy. THANK YOU!

    • lacier77 says:

      Hey Rose! Yay! I’m so glad this worked for you and that it was Easy Peasy. Thanks for letting me know. I think I will publish some post on shortcuts and things I use to blog during the month of January so I hope you stop back by. πŸ˜‰

  5. Hi, I tried this today, and when I enter this in, it just literally spits the same thing out. What am I doing wrong?

    [recipe title="Frito Corn Salad" time="10 mins" difficulty="easy"]

    Ingredients

    2 cans corn, drained
    1/2 cup chopped celery
    1/2 cup chopped onion
    1/2 chopped bell pepper
    1 cup mayo
    1 1/2 cups shredded cheese
    10 oz bag Chili Cheese Fritos
    Directions

    Mix together all ingredients except the Fritos. Refrigerate until ready to serve. Stir in Fritos until well blended when serving.

    http://www.easypeasypleasy.wordpress.com

    [/recipe]

    • lacier77 says:

      Hi Sherry. Scroll down almost to the bottom of the post and copy the short code from there. Then check your preview. Let me know if that works.

  6. This looks great – thank you so much! I’m having the same problem as Sherry. It just spits out the same thing when I go to publish or preview. Any clue as to what I am missing???
    Thank you again – love your site!

    • lacier77 says:

      Hey Katherine! You have to scroll to the bottom of the blog and copy from there. I think I may need to add some additional wording in the blog post to direct exactly where to copy the short code from. I’m working on it right now. Give me 15 mins to update and try again. Let me know if you still have problems.

      • Thanks for helping me out! I must be doing something wrong – I have no experience coding at all – but when I copy and paste (from your new, improved instructions above) into my blog in Visual mode, it still shows as the coding even when I publish. I am substituting my recipe info by inserting it into the spaces between the ” -“s from your example above. Any thoughts on what it could possibly be? I’m perplexed by this!

  7. I tried this (thanks for making it so easy and approachable!), and it worked great for the most part. Except that there isn’t a print button when i post the recipe. Do you know why this is? Thank you!

  8. Thanks for sharing Lacie! I actually have a wordpress.org blog and use the free recipe plugins. But I was looking for a way to add a printable recipe to a DIY post I had already written and this worked great!

    • lacier77 says:

      Ina, I’m so glad this worked for you! I still use this now that I’m on WordPress.org. What plugin do you use? I haven’t found a recipe plugin that I’m in love with yet.

Leave a Reply

Your email address will not be published. Required fields are marked *

CommentLuv badge