How To Add JSON-LD To Your Website

Before we explore how to add JSON-LD to your website, what is JSON-LD and why use it? Next to writing awesome content, you’ve got to be able to technically SEO your site. One way of doing this is using Structured Data with Schema.org. JSON-LD is a modern way of presenting Schema that contextualises your websites content to search engines. Using Schema increases the chances that Google will show rich snippets about your website content which can really make your website stand out in search engine result pages (SERPs).

Why should I want rich snippets in SERPs?

According to recent studies by Search Engine Land, click-through rates (CTR) have increased by up to four times when rich snippets appear, resulting in significant increases in website traffic from organic search as a result. Here's some examples of what rich snippets look like in SERPs:

Sitelink Extensions


Ratings


Local Business - Address, Logo, Map


Reviews


So, by using JSON-LD you can collect all the data about your product, address, events, website, and services and show them in one, small, piece of JavaScript code, that can just be pushed anywhere on a web page. In it’s own documentation, Google often states JSON-LD is the easiest way to add metadata to sites. It’s the option that is least likely to break when you make other changes to your site.

So, what does JSON-LD mean?

JavaScript Object Notation for Linked Data. This basically means it’s a lightweight data-interchange format easy for users to write and easy for search engines to parse and generate. The “linked data” means it uses the internet to connect related data.

In layman's English, JSON-LD is a code snippet that tells search engines a specific price belongs to a specific product, or a postcode belongs to a business address, or that an event has a specific date - you get the idea. So instead of having to individually markup elements on a page with schema attributes, you can now write a block of JavaScript code that has all the info.

Ok, so now what is Schema?

A joint effort by Google, Bing, Yahoo!, and Yandex in 2011 to create a unified structured data vocabulary for the web. Schema presents data to search engines in a readable and contextual way to create Structured Data. Using Structured Data increases your chance of your website content appearing in SERPs as rich snippets, which means your contextual content appears in your organic search results such as price of product, rating, availability. Please see an example for the Google Home below:


You can also increase the chances of a Sitelinks Search Box appearing dedicated to searching your website within Google’s search engine result pages. See an example for Pinterest below:


You will also start seeing the content within the Knowledge Graph cards, similar to the Local Business information we used earlier in this article..

How to add JSON-LD to your website?

Before adding any JSON-LD to your website you’ll want to ask yourself “what do I want to mark up?” for example, you might want to markup that your website refers to a local business. “Why do I want to mark up that my website is a local business?” you don’t want to write JSON-LD just for the sake of it. There’s got to be a business case for it. You want to markup content that will be useful for search engines to know, to help search engines understand the most vital information about your website.

Luckily JSON-LD is written in a standard format, so you've got clear instruction and direction to follow. Even better, Jolojo uses a built-in JSON-LD generator to easily create standard markup for some popular Schema item types such as Local Business, Website and Events. With more to come. As you will soon be able to see from my demonstration, adding information to your web pages using JSON-LD is easily achieved using the Jolojo platform. Jolojo also allows free coding JSON-LD using the JSON-LD editor where you can use any Schema markup and publish it to any page, or pages, of the website.

Step 1 - Create Linked Data Using Jolojo's Built-In JSON-LD Generator

When logged into the Jolojo CMS, navigate to the Admin section > Linked Data, as per the screenshot below:


Step 2 - Select Your Item Type To Markup

In this example, we're using the dropdown within the JSON-LD Generator to markup Local Business information.



Once you've names the Linked Data tag, it will open a Modal window for you to complete the relevant markup based on the Item Type, in this example, Local Business info such as name, address, contact information etc. See below a screenshot of the fields:


Step 3 - Complete The Fields Using The JSON-LD Generator

Complete all the information as accurately as possible, in this example I've completed the Local Business markup for BarkWeb:


Step 4 - Choose Pages

Once you've updated the fields within the JSON-LD Generator, you'll need to choose what pages you want the JSON-LD code snippet to load on:


Step 5 - Create the Linked Data

Once you've completed all the fields within the tag, and chosen the pages you want the JSON-LD to load on, you simply need to hit the Create button to save the tag and generate your JSON-LD, without having to write a single line of code.

Final Step - Validate Your Markup

Be sure to validate your code using Google’s Structured Data Testing Tool.

Briefly recap

JSON-LD is a great way to contextualise your website to search engines in a really efficient way. Using Jolojo’s inbuilt JSON-LD generator means you don’t need to know any JavaScript to be able to markup your website, so there’s nothing holding you back. Next time I’ll be taking a look at the free coding aspect of Jolojo’s JSON-LD tool, so keep a look out for that. If you want to find out more about Jolojo, visit the Jolojo website at jolojo.com.

Find this article interesting? Please share your comments with me by calling Ben Keeley on 01323 735 800 or emailing me at ben@barkweb.co.uk 

Further reading:

JSON-LD; The Time Efficient Method To Schema Markup, BarkWeb - https://www.barkweb.co.uk/blog/json-ld-the-time-efficient-method-to-schema-markup 

Mark Up Your Content Items, Google - https://developers.google.com/search/docs/guides/mark-up-content 

Search Gallery, Google - https://developers.google.com/search/docs/guides/search-gallery 

Tell us about your project

If you'd like a refreshing conversation about your project or any of our web design, web development or digital marketing services, with a team who are programmed for your success, we'd love to hear from you.

Let's chat

All images and content are subject to Copyright © 1999 - 2018. All rights reserved.
Business address: BarkWeb Limited,15 Hyde Gardens, Eastbourne, East Sussex, BN21 4PR, GB | Tel: 01323 735800 | Email: enq@barkweb.co.uk.
BarkWeb Limited is a private limited company registered in England and Wales | Company No. 04695538 | Business hours are 09.00 to 17:00 Monday to Friday
Terms and Conditions | Privacy Policy | Sitemap
BarkWeb Limited Rated 5 / 5 based on 12 reviews | Review us on Google

Powered by Jolojo

Enter our Galaxy... Enquire Now

All images and content are subject to Copyright © 1999 - 2018. All rights reserved.
Business address: BarkWeb Limited,15 Hyde Gardens, Eastbourne, East Sussex, BN21 4PR, GB | Tel: 01323 735800 | Email: enq@barkweb.co.uk.
BarkWeb Limited is a private limited company registered in England and Wales | Company No. 04695538 | Business hours are 09.00 to 17:00 Monday to Friday
Terms and Conditions | Privacy Policy | Sitemap
BarkWeb Limited Rated 5 / 5 based on 12 reviews | Review us on Google

Powered by Jolojo