How to Add Schema to your Website and Improve your SEO

on 14 Nov 2023, by Bogdan, in Blog, Cloud, FREE, Guides

by Bogdan

If you’re looking for an easy way to add Schema SEO to your website, this guide is for you!

As a site owner, adding Schema SEO markup to your website is the best way to put your website in the spotlight. More users will be able to discover your websites quickly on search engines, click through your site, explore, and take action!

In this article, we’ll show you how you can effectively add Schema markup to your web pages. We will cover the following:

What Schema SEO markup is
Why Schema markup is important for SEO, and
How you can add Schema to your site pages.

Let’s begin!

What is Schema SEO Markup?

Schema markup, or structured data, is a specific code you add to your website to help search engines provide detailed information about your page’s content.

Schema markup is normally represented in the form of code snippets. These code snippets contain additional information about your site content, products, and/or services. Search engines can interpret these code snippets to show your users relevant, detailed information directly in the search results.

For instance, let’s say you use Schema markup on your recipe pages. Search engines like Google can read and show your users extra details like the food name, image, prep time, ratings, ingredients, calories, and so on.

Here’s another example of a website with no Schema Markup added:

In this scenario, the search result for our high-calorie cookies is basic. The information provided in this metadata doesn’t provide extra details such as ingredients, cooking time, reviews, or even an image that can convince your customer to click.

Normally, this is the kind of search results that will show your website on the second pages of Google.

Our goal in this guide is to help you avoid this altogether and become more visible to your site users for every search query imaginable.

But first, let’s take a closer look at why it is important to use Schema SEO on your site.

Why Schema Markup is Important for SEO

There are multiple benefits of adding schema markup to your web pages. These include:

Rich and informative search results

Structured data enables search engines to display rich results with extra details such as ratings, events, offers, business information, addresses, locations, etc.

Schema markup also utilizes special features like recipe cards, reviews, and FAQ blocks directly in the search engine results pages (SERPs). These features also provide more detailed search results.

These features usually make schema act like a digital billboard. For example, when you search for Walmart – or, even Amazon – these stores will take up an entire above-the-fold part of the SERP because of the rich results it contains.

Tip: Google supports 32 types of Schema markup. These include articles, book actions, breadcrumbs, carousels, course lists, recipes, datasets, events, fact checks, FAQs, job postings, logos, review snippets, Q&As, speakable, subscription & paywalled content, podcasts, movies, math solvers, etc.

The additional information displayed on rich results also helps with click-through rates.

Increased click-through rates (CTR)

The extra information that appears in the SERPs can make a big difference. When search engines display rich snippets, users get a preview of relevant information directly in the search results, encouraging them to click on the link. This, in turn, results in higher click-through rates.

For instance, Rotten Tomatoes, after adding structured data to 100,000 unique pages, registered a 25% higher click-through rate than those without. Nestle measured an 82% higher CTR for rich results than regular search results.

A higher CTR normally indicates that a larger percentage of users find the content compelling and relevant enough to click on the link. Click-through rates also boost your organic traffic.

Drive more organic traffic

As your click-through rates soar, so do the number of visitors to your website. The Food Network proved this after converting 80% of their pages and adding structured data. They experienced a substantial 35% increase in visits just to prove our point.

Note: Applying Schema Markup SEO enables your visitors to easily find your website through simple phrases or keyword searches.

Improves SEO ranking

When you make the effort to help search engines understand what your web page is all about using schema markup, it can lead to better search results.

While schema markup won't guarantee the top ranking on its own, it does improve the way search engines interpret and display your content. Factors like content quality and website authority still remain crucial for high rankings.

Schema markup, however, aids search engines in indexing your pages more effectively. This enhances your overall site visibility in search results.

Improves search experience for your users

The additional information provided by the search engines also makes it easier for users to know exactly what they’re looking for beforehand. Things like FAQs, ratings and reviews, your business information, and more make research smooth for users.

With all these in mind, let’s take a look at how to add schema markup to your page and enjoy all these benefits and even more.

How to Add Schema Markup to Your Pages

To add Schema Markup to your web pages you’ll need to:

Mark up your WordPress website page
Generate schema markup code for your page with just a click of a button.
Add the Schema Markup code to your page using Brizy
Test your Schema markup

This guide assumes that you’re the administrator account to your WordPress website.

Step 1: Mark up your WordPress site page

The first thing you’ll need to do is to mark up elements on your web page. For this, we can use Structured Data Markup Helper. This free tool is provided by Google to enable you to generate your Schema markup code.

There are various data types available in Google Structured Data Markup Helper which you can choose from. These include articles, book reviews, events, products, movies, restaurants, and more.

1. Go ahead and choose the type of page that you are marking up. For example, a blog page, a product page, or an event page.

You can have multiple items on a single page, but Google recommends that all items are of the same type (for example, all products).

For this guide, we’ll use a WooCommerce product from our demo website.

Note: The URL you use must be from an existing page and available to anyone without logging in.

2. When you’re ready, click on the Start Tagging button. This will take you to the Tag Data page:

3. Here, we’ll highlight parts of the page with important information. For example, the product name, product image, product description, price, ratings, etc.

4. For tags that you cannot highlight, just click on the Add missing tags button at the bottom right of the screen and enter them manually as follows. In this case, we are adding in our rating values.

5. When you’re finished, click Save and proceed to step 2.

Tip: You can highlight and tag as much information as possible depending on the type of web page you want to add Schema markup to.

Step 2: Generate Schema Markup for your WordPress web page

This step is straightforward. After you've tagged all the necessary data on your page, you can take the following steps to generate schema markup:

Click the red Create HTML button at the top right-hand corner of the entry screen.
This will generate the schema markup code based on your selections and look like this:
Next, you’ll have two output format options you can select. These include:

JSON-LD – JSON-LD is a script added as a data block, separate from the rest of a page’s code. Google recommends using JSON-LD because JSON-LD data blocks are easier to organize and change or edit, when necessary.
Microdata – this enables you to replace your existing page with the generated HTML code.

4. For the purpose of this guide, we’ll be using JSON-LD, so you can go ahead and copy this code.

Step 3: Add the Schema Markup code to your page using Brizy

To add Schema Markup code to your web page, you’ll need the help of a plugin called Brizy.

One of the standout features of Brizy is it integrates seamlessly with Schema Markup code. This means that you can easily incorporate Schema Markup code directly into your web content. This will enhance your site’s visibility, search engine results, and SEO by creating rich snippets for various pages of your website.

Other best SEO-friendly practices Brizy uses include the following:

Brizy uses clean and Semantic HTML markup – which ensures that your website’s code is well-organized and easy for search engines to crawl and index. Properly structured HTML enhances search engine readability and indexing.
Customizable meta tags – This allows you to create things like titles and unique and descriptive site descriptions or meta tags for each page.
Brizy automatically generates XML sitemaps for websites – XML sitemaps help search engines like Google understand the website's structure and index its pages more efficiently, leading to better search visibility.
Brizy Cloud automatically generates the robots.txt file – all you need to do is go to Project Settings and enable Search Engine Visibility.
Brizy also provides free SSL certificates – Secure websites are favored by search engines and provide a safer browsing experience for users.
Brizy enables you to create SEO-friendly URLs (web addresses) that are descriptive, concise, and easy to understand. Meaningful URLs containing relevant keywords enhance user experience and improve search engine rankings.
Integration with popular SEO plugins, particularly Yoast SEO.
Brizy websites are also mobile-friendly, load faster, and the images are automatically compressed. These features boost your SEO in one way or the other.

If you want to add the Schema Markup we generated from Step 3, you can follow these simple steps and you’re good to go.

Adding Schema Markup code to your web pages using Brizy

If you have a project you’re already working on Brizy Cloud, simply click Edit Project from your Brizy Cloud dashboard to open the editor. If you’re using WordPress, you can install Brizy Pro and then edit your product page with Brizy. When you’re done, continue with step 2.
Click the hamburger menu at the top left corner of your screen and select Project Settings below the screen on the left. This will open a page like this:

3. You can add your site’s title and description if you haven’t done that already. Otherwise, click the code insert icon (third icon from left). You’ll have three options:

Custom CSS code – this is where you inject CSS code. It will affect the styling of your entire website.
Code injection > header – this code will be injected in the head tag of every page of your website.
Code injection > footer – this code will be injected in the footer tag of every page of your website.

4. Next, paste the code we copied from Step 3 in the head section of your website as shown below.

5. Once you’re done, click Save Changes to update your code.

That’s it! Next, we test your schema SEO markup.

Step 4: Test your Schema Markup

You can test your generated Schema markup code by pasting it on the Rich Results test.

This testing tool is provided by Google. It tells you about any missing fields that you must provide to help Google understand your page. For some data types, it can further provide a preview of how your page might look in Google Search Results.

To do this:

Just go to Rich Results, paste your generated code, and click Test code.

2. You’ll see something like this when the testing code is done:

3 You can also click the Preview Results option to see how your website will appear on the Google search engine results page.

Conclusion

That’s it. By now you should know how to add Schema SEO to your websites. Schema markup benefits site owners by improving search engine visibility, leading to higher organic traffic and better search rankings. For users, it enhances their search experience by providing more accurate and relevant information in search results, making it easier to find the content they need.

Using Brizy allows you to streamline the entire process of adding Schema markup. All you’ll have to do is to generate your Schema markup and paste it into Brizy.

Choose Brizy today and stay ahead in this digital landscape!

Start building better websites today!

Start with Brizy Free

Step up to Brizy PRO

Compare All Plans & Features

Article by Bogdan

Co-founder & Head of Design, Bogdan has a passion for everything that works great and looks awesome. Guilty for most of the UI and UX around this place, you can say "Hi" to him at bogdan at brizy dot io