WordPress 5.3 update

If you already updated to WordPress 5.3, and use the Gutenberg editor in combination with the Recipe Grid, you should update to the latest versions of Zip Recipes friend (6.2.7) and Zip Recipes Lover (6.3.4).

WordPress 5.3 has blocked usage of the $ property in jQuery, forcing the preferred usage of “jQuery”.

This has been fixed, updating to the latest version should resolve the problem. If you have any questions, please contact us!

Rich Snippets in Google, getting the most out of it

Images in Rich Snippets sometimes seem elusive: you have set it up correctly right? Why isn’t Google showing the image you prepared with so much care!

Sometimes it’s just as simple as ratio’s or pixel count. Google prefers images of at least 50K pixels, and prefers the image in three different ratio’s: 1×1, 4×3 and 16×9. See for more information on Google’s preferences this article.

To give a user full control over the snippet images, I’ve added a new tab in the recipe editor, which allows a user to manage the images manually. This is not necessary! Zip Recipes will automatically generate the required images in the correct ratio’s and pixel size. If you image quality is too low, you will see a warning about this.

This feature takes the guesswork out of the rich snippets, and is now part of both free and premium versions of Zip Recipes.

 

 

Nutrition label in Zip Recipes free

In the most recent version of Zip Recipes (free version) a new feature has been introduced: a beautiful styled HTML and CSS Nutrition Label. To get this label you can just enter all the nutrition data, and it will appear below your recipe. When not enough data is present, it won’t show. When the data is there, it will show up like this:

 

Or you can take a look at the nutrition label on our demo site for a live preview.

If you still prefer the nutrition data to show in text, you can just enable the option “use text for nutrition data”. If you enable “hide nutrition info”, it will be hidden, both text and label.

The data will get automatically sent with your site in Google friendly json+ld, which is Google’s preferred method for schema.org rich snippets.

 

Meet the new recipe grid!

This week we’ve released Recipe Grid 2 (part of Zip Recipes Lover and Zip Recipes Friend), which will replace the previous Recipe Index and Recipe Gallery. The new grid has been designed to make your recipes look mouthwatering, and trigger your users to try multiple recipes. They’re searchable and filterable in a quick and easy way. Check out the new gallery on our demo recipe blog!

The recipes are also shipped with a json+ld description for Google to read: json+ld is Google’s preferred method to send microdata with the recipes, allowing Google to show rich snippets in the search results.

There are numerous options to configure your grid: number of recipes, load more button or not, search, show with or without title, etc.

The Gutenberg interface is especially easy to use: just insert the Zip Recipes Grid block, and you’ll have your grid. By clicking on it, you can start editing your grid, adjusting it to your preferences!

schema.org for recipes, JSON-LD or Microdata?

When building a food blog, you need to rank in Google to get you visitors. Apart from great recipes and beautiful food photography, you need to make Google understand your recipes. Luckily, recipes are one of the items that are detailed in the schema.org structure. When searching for info on this, you’ll find several terms: Structured Data, Schema.org, JSON LD, Microdata. They’re basically all the same thing.

What microdata in your recipe does, is that it wraps a snippet of information like for example Cook Time, in a tag that search engines can understand. Schema.org is the standardised method of doing this. You can supply structured data either with JSON LD, or with microdata. In the case of JSON LD, the data is added as separate string in your website. It looks a bit like this:

{"@context":"http:\/\/schema.org","@type":"Recipe","description":"Quite simply the BEST chocolate cake for chocolate lovers."}

You see here some info, like what kind of data is provided here (recipe), and what the information is (description in the example above). This string will be inserted in addition to your recipe.

You can do the same thing with microdata, only in that scenario the data gets added to the html of your recipe.

<div itemscope itemtype="http://schema.org/Recipe">
 <span itemprop="description">Quite simply the BEST chocolate cake for chocolate lovers.</span>
</div>

You see this contains the same information, only in this case it is included with your recipe’s html.

JSON-LD or Microdata?

So what should we use then? You’d think it’s better to add them both right? More data is better? That’s definitely a no! We have tested with this and if you add both JSON-LD and microdata, Google will think you have TWO recipes on your site. Warnings and errors may occur.

So we need to choose. And let’s face it, we choose what Google wants us to choose. This is not always transparent, but in the case of schema.org, Google has made it very clear:

“We currently prefer JSON-LD markup. I think most of the new structured data that are kind of come out for JSON-LD first. So that’s what we prefer.”

For this reason, Zip Recipes generates your recipe card with JSON-LD.

How to check if it’s configured correctly?

Google to the rescue! They provide a great tool with which to test your structured data. Simply enter your recipe’s page URL, and you can see the results.

Because lots of plugins insert structured data these days, it’s always a good idea to test this.

What do I get out of this?

Rich Snippets, and ranking. That’s what we’re aiming at here. Tak a look at this rich snippet. You can see Google has read the preparation time, the number of calories, and the rating, as well as the image from the Structure Data.