Highlighter – Lesson 2 – Tag First Page

Training Objective

Tag your chosen templated page with schema markup.

Highlighter Tag first page
Several Options Available

There is a good chance that you won’t be able to use the same method to tag all of the content on your page, so depending on the type of content and its structure, the Highlighter contains different options.  We recommend that you consider each option in the following order:

  1. Tag content on a page
  2. Add a “Sub-template”
  3. Link an existing data item
  4. Apply a fixed property

Option 1: Tag content on a page

Hover your cursor over the content on the page. An orange box will surround the content that is eligible for markup.

  1. Click to select the content. Clicking will open a highlight on the right side of the page.
  2. Select the property that best describes the highlighted content. In the example below, we’ve selected “Headline” property.

See it in action: Watch this Video (Add “Headline” highlight to content)

Sometimes schema.org requires further clarification. A schema.org type (aka class/entity/data type) may have properties that can be further broken down into a new schema.org type (with its own set of properties). When this is the case, both the Schema App Editor and Highlighter will present you with available options specific to that property so you can select the one that best aligns to your content.

For example, highlighting a picture for an “Video” property will direct you to an additional type/class called “VideoObject”, which contains a property, “Video”. The Highlighter will narrow down the available options for you. If you aren’t sure what to choose, we recommend that you go to “schema.org” to read the short definitions of the options.

Example: Watch this Video (Select an additional class for your property)

Highlight Content
Click to “Reveal Content” on a page

If you want to expose all of the content on a page, that might be hidden in an accordian, slider, etc., click “Reveal Content” from the drop down menu in the top left corner of the Highlighter.

Option 2: Add a Sub-Template

There are two situations for which this option makes sense:

    1. There is a section within your page that contains content that repeats – for example, a collection of things such as a list of job postings that display the title, a short description and the author. In this case, you could mark up the first job posting and apply the same markup to all of the other job postings. 
    2. When you have one section on a page (with a different class type than the page itself) that shares the same sub-class.  For example, the primary page is an “Article” which contains the name of the author and their picture. On the same page, there is reference to the name of an author and the title of the article. If you don’t differentiate the two sections, you’ll confuse the search engine.

Helpful tip! Click and drag your cursor around the item (to add a bounding box around the thing that you want to highlight). Be sure to capture all of the properties associated with it. Start small and expand your box so that you only capture the items that are relevant to your thing, adding nothing additional.

Add a sub-template step-by-step

1. Click the “Add a Template” button

2. Click on part of one of the entities that you wish to create a template for. In this case, we are marking up a blog in our “Recent Post” section.

3. Once you’ve selected the entity the “Highlight Content” box appears on the right-hand side of the page. Now you can increase the scope (or widen) your selection to capture all of the information you wish to mark up.

4. Choose one of the articles to Highlight.  In this example, we leveraged the “mentions” Property option and “BlogPosting” Class to weed out anything else that might appear on our Recent Posts listing.

5. Leverage Property = “mentions” to select only Blogs from the list of recent posts

6. Click save!

Add a Template
Choose entity you'll Highlight
Widen Scope
Narrow Down Options

Option 3: Link Existing Data Items

Using the “Link Existing Data Items” functionality we can link to a Data Item that we previously marked up (potentially in the Schema App Editor). 

When you link, via schema.org, the content on a page to another page, you improve the crawlability of your website while building a knowledge graph. In this example, the reader may want to learn more about an author who has written an article.

1. Click the “Link Existing Data Item” button.

2. Select the property that is to be defined.  We have chosen “Publisher”.

Image: Choose the property, leave class empty

You may be requested to fill in the Class. Leave this as, “No Class Selected” because the schema class will already be defined within the data item we are linking to.

Search for the data item by name. In our case, since the data item for the company Schema App was created during the Organization markup, it appears in the search box.

3. Click on the name of the data item and save!

Link to another part of website
Link Existing Data Item(main)
Link Existing Data Items

Option 4: Add Fixed Property

You can use the “Add Fixed Property” option when you need to further define something that:

  • Resides in the same place on every page
  • Is consistent
  • Needs further definition

Examples:

  • A currency symbol that always represents USD
  • Inventory that is always “in stock”
  • Inventory that is always in “new condition”
  • Blogs that are always written in “English”

Process:

Click on the “Add Fixed Property” button

This will launch a highlight that will capture static content. By nature, all manual highlights will be the same across all pages.Enter the relevant TEXT in the “Value” field that applies.  For example, we used the Value of “en-US” and the property inLanguage:

Add Fixed Property
Fixed property

Validate for Completeness

Scroll through the saved highlights on the right side of the page. Ensure that you have a highlight for each property in your list.

Delete a highlight (if necessary) by clicking the “x” on the top right-hand side of a specific highlight.

Ready to for Highlighter Lesson 3 - Create Page Set?

Menu