Placeholder Image

Subtitles section Play video

  • (upbeat music)

  • - [Jen] Google's preferred methodology

  • for structured data is through JSON-LD.

  • Not only is this information useful for webpages

  • it's becoming important for home devices

  • like Alexa and Google Home.

  • Even if you're not a JavaScript person

  • writing the JSON-LD document

  • is a relatively straight forward thing to do.

  • First of all, let's get our JSON-LD into the webpage.

  • This form of JavaScript may be embedded

  • in the head of your document,

  • or just before the slash body tag.

  • Either is fine, but it should not be linked to a file

  • as you might do for other JavaScript in your document, why?

  • Because the JSON-LD is specific to this page only.

  • In other words, if you have 100 pages on your website

  • and you want every page to have structured data

  • then you'd have to embed a JSON-LD script

  • on every one of those 100 pages individually.

  • It's not possible to have a single central JSON-LD document

  • and then link to it from other pages

  • as you might want to do with other JavaScript.

  • The content's different on every page.

  • Let's also take a quick peek at our restaurant schema

  • at schema.org.

  • The fastest way to get started is just to scroll

  • to the very bottom of this page.

  • And let's look at example number two.

  • Click on the JSON-LD tab

  • and this will give you some sample opening code.

  • So we're going to go ahead and copy this

  • mark up here as a starting point,

  • just go ahead and copy that.

  • And then we're going to paste this right here

  • into the head of the document.

  • If you prefer to paste it

  • just above the slash body tag, that's fine also.

  • I like the head,

  • since this is data that's describing the document

  • just like the metatags do in this particular situation.

  • So obviously this is not the information for Nadia.

  • Let's go on ahead and make some changes to this,

  • and we can add some additional information as well.

  • Note that this starts with the @context property here.

  • It's telling you it's going to go to schema.org

  • and look for the restaurant type

  • in order to derive the information that's inside

  • of this piece of code.

  • It'll give us a name, we'll have to type that out,

  • Nadia's Garden Restaurant.

  • We may not want to include some of these things.

  • If you wanted to include a description

  • you could certainly copy and paste that on in,

  • like just to demonstrate here,

  • you can also get rid of things.

  • You can add things as well.

  • The order here as always is not really all that important.

  • I'm going to add an email,

  • just make sure that you follow the same sort of syntax

  • that you see on a other lines here.

  • So email in quotes followed by a colon

  • and then inside of that nadiasgardenrestaurant@gmail.com.

  • And then make sure you put a comment

  • after each one of these, except for the very last one.

  • For our opening hours, we are going to have

  • TU to SU, Tuesday to Sunday, and then we can have a time

  • and this will be something like 1730,

  • to, whatever it was I said before 2200.

  • We can have a phone number, 1234567890.

  • And of course we have a menu,

  • this menu is got a different URL,

  • it's Nadia's-garden.com/menu.html.

  • And then there's some things that we know we are missing

  • because we saw when we ran our information

  • through the structured data markup tool

  • and the testing tool in the micro data chapter

  • we know that Google looks for things like serves cuisine

  • and that type of information as well.

  • So you can add that if you wish

  • just remember to put a comma.

  • And so we could say serves cuisine, American.

  • No comma after the very last one on the list of these.

  • And of course this isn't a list of all the properties

  • but this is enough to get you started

  • with how you would go about coding your own JSON-LD file.

  • You can see the form that the syntax is taking

  • and you can see how to choose properties

  • and values from the schema.org website.

  • (upbeat music)

(upbeat music)

Subtitles and vocabulary

Click the word to look it up Click the word to find further inforamtion about it