Purpose: To demonstrate through example how to use the Schema App Highlighter from Create New Template through to Publish. This will include tasks and processes within the Highlighter and also Schema App Pro-Tools. Upon completion a Template will be ready to deploy to a determined page set.
1. Define the schema class & properties
Select pages to be templated
Collect a few examples of pages that are ideal for the Schema App Highlighter. This will be a web page that has many (possibly thousands) of similar pages. Our example will be a Schema App blog post: https://www.schemaapp.com/news/schema-markup-news-feb-13th-2018/.
Decide which Schema Class to use
Use the Schema.org class type that is the most specific while still being accurate. In our case we are creating markup for a blog post, so we will use the schema class BlogPosting. A quick way to search for the best schema class is to use the class Tree in the structured data editor. Simply start with the most generic class, which is Thing, and drill down until you reach the most specific while still accurate schema class.
Decide & document which Schema Properties to use
Properties are used to further describe the thing that we’re creating markup for. The best way to determine which properties to use is to create a data item in the structured data editor and look through the properties listed in the Form Builder. There, they will be listed in order from Required, to Recommended, to other Properties. You DO NOT have to use EVERY property, however you should use all of the Required properties. This is because the required properties are necessary for Rich Result eligibility. The recommended approach is to think about what you believe is important to call out about the thing you’re creating markup for, and use the available properties to do so.
Create a list of these properties.
2. Prepare for the Highlighter
Before using the Highlighter have these things prepared:
- The URL for the first page.
- The schema class we will use.
- The properties we will use and how we will capture that information.
- For some properties, we will just tag the content on the page.
- For some properties, we will add a fixed tag.
- For some properties, we will link an existing data item.
- For some properties, we will add a template.
- A list of 3 other URLs for pages similar to our first page.
NOTE: If your template includes a Linked Data Item, then should create that data item (using the Structured Data Editor) before starting to build the template.
3. Using The Highlighter: Step 1 Load Page
Open Schema Highlighter and Click New Template
Paste in the URL for the first page
Site URL: https://www.schemaapp.com/news/schema-markup-news-feb-13th-2018/
Select the Schema Class
4. Step 2 Tag First Page
Use your notes to create a highlight for each property
Remember that you may have to Add a Fixed Property or Link Existing Data Item for certain properties!
Create highlights for properties in your list
Steps for creating a highlight:
- Hover your cursor over the content on the page. A box will surround the content your cursor is over. Click to select the content on the page that is to be used for one property.
- In the example above we’ve selected the content that will be used for the Headline property.
- Clicking will open a highlight on the right side of the page.
- Select the property that the highlighted content will be used to define.
- If the property requires a class, select the appropriate class. (For example: highlighting a picture for the Image property. That will require a class of ImageObject and sub-property of URL.)
Add Fixed Property
Click on the Add Fixed Property button to create a manual highlight.
This will launch a highlight that will capture static content. By nature, all manual highlights will be the same across all pages.
The Value is where you’ll enter the TEXT that will apply. Take for example the “inLanguage” property. We used the Value of “en-US” and the property inLanguage:
Link Existing Data Item
Click the Link Existing Data Item button.
Select the property that is to be defined. Our example was “Publisher”. Once a property is chosen, you may see a new line asking for a Class. Leave this as No Class Selected. The schema class is defined already within the data item we’re going to be selecting.
Search for the data item by name. Select it and save!
By nature, all highlights created with a linked data item will be the same on all pages.
Add A Template
Click the “Add a Template” Button to create a template for a list of entities.
Click on part of one of the entities that you wish to create a template for.
Once you’ve selected the entity, you’re able to increase the scope or widen the effect of the template.
Once the scope of the template is correct, set the property and class. Finally, tag the elements you’ll include in your template. In this example, I will be using the mentions property and BlogPosting class.
Once you’re happy with the content that will be included, click save!
Check that each property has a corresponding highlight
Scroll through the saved highlights on the right side of the page. Ensure that you have a highlight for each property in your list.
Should you need to, you may delete a highlight by clicking the “x” on the top right of a specific highlight, or click on the tag in the page and choose “Delete Highlight”.
5. Step 3 Create Page Set
Choose Page Set Option
There are 3 options to choose from. Each option is a different method of defining the Page Set for your Template
- List URLs: This option allows you to use a list of specific URLs to define the page set.
- Define Pattern: This option allows your to define a URL segment pattern to define the page set. For example: /news/**
- Define XPath: This option allows you to use some element in the page to define a page set.
To Use List URLs
Simply enter all the URLs you wish to apply the template to in the box.
To Use Define Pattern
1. Indicate the URL pattern
The URL pattern will tell the highlighter how to find the pages you want marked up. Exclude the domain from the URL pattern. For every section that varies and is separated by a slash “/” add an asterisk after the set. Ex: /blog/**
In our example we created markup for https://www.schemaapp.com/news/schema-markup-news-feb-13th-2018/ in step 2. So the URL pattern here is simply: /news/**
2. Click Add URL Examples
3. Add URL examples
From the notes you prepared, enter the 3 URL examples. Include the full URL and separate URLs by line.
4. Click Validate URLs
5. Check that the URLs are Valid
Pages are not valid:
Pages are Valid:
If the URLs are not validating it means that they they do not match the indicated URL pattern. You’ll have to correct this before moving on.
6. Click Next
To Use Define XPath
1. Decide which element in the page to use
Choose an element on the page that is common to all the pages that the template should be applied to. Using the blog page as an example, I would choose to use the blog authors name. That element only exists on Schema App blog pages, and therefore would work perfectly.
2. Once you know which element you’d like to use, you can right click on it and choose “Inspect”.
3. Ensure you’ve found the correct element and then right click, choose “Copy”, and choose “Copy XPath”.
4. Paste the XPath underneath where it says “Xpath:”
5. Include at least 3 URLs for pages to test the template with and click “Review URLs”
6. If all looks good, then click NEXT
6. Step 4 Review Highlights
Review each page
In this step, we’re checking the template to ensure that each property is being successfully mapped to the correct content on the page. The URLs listed in step 3 are being used as examples for us to go through and check. Start with Page 2 of 4 (page 1 was used to create the template in step 2).
When checking the highlights, be sure to check that the “Highlight content” is from the page:
- There is a highlight for each property from our list.
- The “Highlight Content” is correct for the page.
Fix any “No matching X-path” errors
Take note of any highlights have an error stating “No matching xpath”. Not every page set will be perfectly templated. Sometimes, the content on the page that we’ve highlighted to define a property won’t be in the exact same place. When this happens you’ll see that the highlight says “No matching xpath”.
DO NOT DELETE THE HIGHLIGHT. Instead, create a new highlight for the missing content. This is training the template to look in both spots for content that will define a property. By creating another highlight, we’re building a cascading template that will be able to recognize when the information you want highlighted is in different places!
Final check for current page
After you’ve created a new highlight for all the highlights with a missing xpath, please double check that there IS a highlight with the correct content for every property in your list.
If all is well, proceed to Page 3
Select the right arrow to move to page 3.
Perform the same review on page 3
Reviewing this page may be much faster, as there should be fewer highlights (if any) with a missing xpath.
Perform the same review on page 4
This is the last page to be reviewed!
Once ready click next
After reviewing each page and you’ve confirmed that all the correct content has been highlighted for all properties, you may click Next-> to move to step 5.
7. Step 5 Review & Publish
In this step, we’re going to do a final review of the template before saving and publishing. It is important to be sure the template is complete and accurate as it’s possible it will create markup for thousands of pages!
Go through and check that for each page URL set, the properties are listed with the correct information!
Save & Finish
Once you’ve confirmed all is well and good, click Save & Finish!
8. Deployment Method
Choose a Deployment Method
9. Publish Status
Finally, you may control which templates are being deployed to your domain with the publish status.
Congratulations, you’re done!
Be sure to test your pages using the Structured Data Testing Tool!