Creating a Recipe Index

Tracking recipes is highly important for every single food blog. It offers a clear perspective about your culinary history, and it allows your readers to easily access them at any time.

That’s why we offer you a convenient way to browse them all with the Recipe Index — a template page that is fully customizable and suits your particular needs.

Step 1 — How Templates Work?

A template is a starter layout with numerous areas where you can add your content.  In the Recipe Index template, each area is called a Widget area and can hold widgets such as Featured Posts, Calendar, Categories, etc. For example, the Recipe Index on our Julia demo is built with the Recipe Index template. Here are the Widget areas that you can find:

  1. Archive Content: by using our Featured Posts widgets you can customize this area, adding the categories that are important to showcase on the Recipe Index
  2. Sidebar: this area is the general Sidebar area for the rest of the website
  3. Default search widget: so that browsing through your recipes could be done.

Step 2 — Set up the Recipe Index Template

Now that we’ve made it clear what a template is and how you can use it in this particular theme, let’s move next and set it up.

  • Log in the WordPress Dashboard
  • Create a New page, and give it a name like “Recipes Index”, for instance.
  • Go to the Page Attributes section, open the Template drop‐down menu.
  • Select the Archive Index option (screenshot).
  • Click Update and you’re done.

Step 3 — How to Add Widgets?

Now that we have our page set up it’s time to add some relevant widgets to the page. Here’s what you need to do:

  • Go to Apperance → Customize → click on the Widgets section (keep inmind that we are referring to the page that you set it with an Archive Page template)
  • Choose the Archive Index widget area.
  • Click on the Add a Widget button. From the menu that will appear on the right, select any widget that you would like to add.

If you want to learn more about our custom widgets, you can dig deeper right here.

Tips and tricks

The next step is to make searching for recipes a pleasant experience for your readers. Using the Jetpack Visibility feature you can easily organize your widgets depending on what page you want to display them.

The Recipe Index on our demo is a good example for this case. We have customized our Sidebar area such that some menus are displayed only on the Recipe Index, categories pages, and search pages. This way your readers can browse through your recipes without going back and forth between the Recipe Index and the search results’ pages.

Here’s how we’ve done it:

  1. Make sure you have the Jetpack plugin activated.
  2. On your Dashboard, on the left menu, go to Jetpack→ Settings→ Appearance and enable Widget Visibility module.
  3. Create a Recipe Index page following the instructions described above.
  4. Go to Appearance → Customize→ Widgets→ Sidebar and add the widgets you would like to display only on the Recipe Index. For the moment they will appear at the end of the already existing widgets.
  5. Click on the widgets you don’t want to appear on the Recipe Index. In the bottom right corner, you will see the Visibility button. When clicking it, a new section with multiple options will appear. From the first drop‐down, select the Hide option. The next field selects the type of the web pages where your widget should be hidden. The last field tells you which specific page you would like to hide the widget from. Select them accordingly to your needs. The options will be automatically saved.
  6. Go to the Recipe Index and you can see that the widget you selected will not display on the Sidebar.

Now, you can edit the widgets you want to be visible only on the Recipe Index. For this, all you have to do is to repeat the step five from the above list, but please make sure that in the first drop‐down you replace Hide with Show.

Updated on June 14, 2017

Was this article helpful?