Sometimes I just want to bake a cake. That means I only want to read the recipe and not the whole 700 word blurb all about how awesome it is (because that’s a decent number of words needed for good SEO and Google and that sort of stuff). I’m a big fan of food bloggers (obviously), but there are days when I just want to get to the actual recipe and not read the whole story behind it. So I figured that I might not be alone and I should find out how to add a ‘Skip to Recipe’ button to my recipes to give my readers the option to … wait for it …. skip to the recipe.
Thankfully, it’s a lot easier than it looks. Which is a good thing for us non-techy types. It’s just a little bit of copy and pasting and Voila …. you can have your readers hopping all over the place.
Test the button below to see what I mean.
Click here to try the ‘Jump to anywhere button in action’.
This is so much fun!
HOW TO SET UP A JUMP BUTTON IN A WORDPRESS POST:
1. CREATE YOUR IMAGE: (this is optional as you can use a text link if you want to) Create a graphic to serve as your jump button. I use Picmonkey (You can Try Picmonkey FREE for 7 Days here) to make an image. My Jump to recipe graphic measures 300×75 pixels but feel free to go with a size and color that suits your blog. Then add this image to your post where you want your Readers to see it.
2. CREATE YOUR DESTINATION JUMP LINK: Switch to the “Text” editor to create your HTML jump anchor. This is the destination or where you want your readers to jump to. (In my case it is to the recipe. On the line before your recipe (or anywhere you want this jump to go to – the example below shows how I added it to this post), type the following:
<div id="recipejump"></div>
3. CREATE THE BUTTON: Switch back to the “Visual” editor, click your jump button graphic (or highlight the text you want to act as the button), and select “Edit”. In the “Link to” dropdown menu, choose “Custom URL.” Insert your post’s permalink, and add /#recipejump to the end. Your Posts permalink is it’s URL. If your post is still in draft format, you can find your permalink in the box under the title in WordPress editor (see image below).
So for this post, the Custom URL link would look like this:
https://www.cleaneatingwithkids.com/how-to-skip-to-recipe-in-wordpress/#recipejump
and then I would add this link to my graphic like this below:
4. Save and Publish. To test the link before you publish, just preview the post. All links should work otherwise you’ve done something wrong.
Here is a fantastic Summary from Striped Spatula on How to add a Recipe Jump Button to your Post.
Pin it and Save it so you can find it.
Yay it WORKED!!!
Well Done!
Now Click here to Jump Back to the Tutorial at the Top of this Page