How to install the Rich Snippets Plugin.

Installing the plugin is super easy. Just follow the steps below:

  1. Upload the rich-snippets-wordpress plugin folder to the /wp-content/plugins/ directory.
  2. Activate the Rich Snippets WordPress Plugin through the „Plugins“ menu in WordPress.
  3. Head to the „Rich Snippets“ menu that appears in your WordPress dashboard and click „Activation“. Enter your Envato purchase code end click the big blue „Let’s get started“ button.? If you don’t know where you can find your Envato purchase code, click here.
  4. Then click the „Global Snippets“ menu in your WordPress dashboard to manage global snippets.
  5. Or add your own snippets directly in your blog posts, pages or custom post types.

Quick start

Take the Structured Data Training. It’s free for all customers. It tells you every thing from:

  • What Structured Data is.
  • What Rich Snippets are.
  • How to use SNIP.

 

What are Global Snippets?

Global Snippets are a beautiful thing. They allow you to add one rich snippet to many posts at once. But how does it work exactly?


How to create a global Rich Snippet

  1. When you activate the plugin you will see a new menu item under “snip” in your WordPress dashboard. It’s named “Global Snippets”.
  2. Just open it up and add a new Global Snippet.
  3. You will then be able to create a Rich Snipppets.
  4. When you’ve finished creating the snippet, you can choose where it should appear.
  5. For this scroll down to the “Position” metabox.
  6. There you can create a set of rules to determine which pages will use these schema.org syntax you’ve just created.

Are there any examples?

Yes there are!

If you have a fresh install:

  1. Go to “snip” in your WordPress dashboard and choose “Global Snippets”.
  2. A new admin notice will appear on top of the screen. It says “Hey Dude! The plugin can install some predefined global snippets for you!”.
  3. It also shows a button that says “Awesome! Install them please”.
  4. Click on this button.
  5. Here are your examples! 😉

If the snippets where installed previously and you want to create them again, do the following:

  1. Go to “snip” in your WordPress dashboard and choose “Settings”.
  2. Scroll down to the “Actions” part.
  3. Click the “Go for it” button where it says: “Reinstall predefined global snippets.”.
  4. You should then be redirected to the Global Snippets page and should see some new Global Snippets, like the “Article”.

How can I fill certain properties automatically?

Can I add another snippet to a post that has a global snippet?

Yes you can. Read more about this here: Can I use multiple snippets on one page?

How to generate an image (sub)snippet in global schemas for the main thumbnail

Some Rich Snippets (like the Article snippet) provide an image-attribute. In the early days it was easy: you could just provide an image URL here. However this no longer works as search engines want to see more data. That is the width, the height and the URL of an image. This is how you properly add an image snippet into another snippet: Continue reading

How to reference to something in the text editor

Referencing to content is outdated and will not work as of version 2.2.0! Referencing from JSON+LD format to HTML no longer works. The reference shortcode will be removed in version 2.2. Please read more on how to make the switch here.

Update July 30, 2018: There is currently a new schema type in development that would allow to reference something in the HTML sourcecode. It’s called CssSelectorType. However this type is currently in development and not supported by the major search engines. Once this is approved, the following information should work again as described.

Today I’ve got a question from Björn who works a lot with recipes on his website. He had a question about how to reference to some content in the editor. Here I describe how this works: Continue reading

Why should I surround my content with a DIV?

This information is outdated and no longer works. Update: July 30, 2018: There is currently a pending schema Type called CssSelectorType that would allow to use content from the current HTML page. However this is currently pending. Once this is approved the below information should work as described again.

A div-Element in HTML is just a section that has no layout. That means, surrounding your main content area will have no visual affect in most themes. However it allows to give the content an ID. For example if you wrote a post the sourcecode of the content could look like this:

No Div

<p>Praesent commodo cursus magna, vel scelerisque nisl consectetur et.</p>
<p>Maecenas sed diam eget risus varius blandit sit amet non magna. Nullam id dolor id nibh ultricies vehicula ut id elit.</p>

Here is what it looks like when surround it with a <div>-Element:

With DIV

<div><p>Praesent commodo cursus magna, vel scelerisque nisl consectetur et.</p>
<p>Maecenas sed diam eget risus varius blandit sit amet non magna. Nullam id dolor id nibh ultricies vehicula ut id elit.</p></div>

What the DIV-Element allows us is to give it an unique ID that we can refer to:

With DIV and ID

<div id="the_content"><p>Praesent commodo cursus magna, vel scelerisque nisl consectetur et.</p>
<p>Maecenas sed diam eget risus varius blandit sit amet non magna. Nullam id dolor id nibh ultricies vehicula ut id elit.</p></div>

With that ID it’s possible to refer to that content in a Rich Snippet.

Usage in a Rich Snippet

For example if you take a look at the Article-Snippet (that comes shipped with the plugin) you can find a property called http://schema.org/articleBody. This property usually inherits the content of a post. To avoid posting your complete content into this property we can instead refer to the main content in a post via the ID so that you don’t need to worry about changing it when the main post content gets changed.

Once the setting called “Surround main content with a DIV so that it can be addressed by snippets.” is active, you will see a new option called “Link to current post content” when you select the value for the property.

Property selection in the rich snippet plugin
Refer to the content via its ID.