Schema SiteNavigationElement in webflow (JSON-LD or Microdata), SEO, Structured Data

Community resources
1

Hi everyone, there are already some posts in the forum regarding schema and structured data in webflow. However, in my opinion one of the most important ones, the SiteNavigationElement (see picture) has not been covered yet.

image
image738×522 65.2 KB

Generally there are several ways to add schema to a website. The preferred one is JSON-LD since you can easily implement it with custom code. Yet, there is literally no documentation about how to add the SiteNavigationElement with JSON-LD to a website. The other way would be with Microdata, which has a lot of documentation, but it needs to be implemented via custom attributes in webflow, which I’m not 100% sure how to do it for SiteNavigationElement so far.

Has anyone in the community used the SiteNavigationElement schema in webflow so far? How did you do it?

2

Hey @Siton_Systems , I’ll just tag you on this question since you seem to be the schema expert in the webflow community. Thanks a lot for your contributions to other posts regarding this topic already.

3

Read this:

The links shown below some of Google’s search results, called sitelinks, are meant to help users navigate your site. Our systems analyze the link structure of your site to find shortcuts that will save users time and allow them to quickly find the information they’re looking for.

Google sitelinks google (You find a lot of tutorials/guides).

The bottom line: There is no way to control it. It is controlled by the algorithm (You can help the algorithm).

One article of many:

  1. Rank at Position #1 for Your Brand Name
  2. Use Structured Data
  3. Use a Clear Website Structure and Navigation
  4. Add an XML Sitemap to Google Search Console
  5. Build Internal Links
  6. Use Relevant Page Titles
4

Hi Ezra, thanks for your answer already. Super helpful!

My takeaway: can’t influence the appearance of the links. However, when I add the html markup manually, the site links appear for my website. When I delete them the links are gone again. The problem is I can’t show the code on the site because it creates a visible list of the links as bullet list, which shouldn’t be visible. Isn’t there a way to add the html attributes directly to the links in the navbar in webflow?

This is the custom code I added (got it from A Guide To Schema Markup & Structured Data SEO Opportunities By Site Type)

<ul itemscope itemtype="http://www.schema.org/SiteNavigationElement">
  <li itemprop="name"><a itemprop="url" href="http://www.travelstore.com/our-advantage">Our Advantage</a></li>
  <li itemprop="name"><a itemprop="url" href="http://www.travelstore.com/our-travel-experts">Travel Experts</a></li>
  <li itemprop="name"><a itemprop="url" href="http://www.travelstore.com/destinations">Destinations</a></li>
  <li itemprop="name"><a itemprop="url" href="http://www.travelstore.com/cruises">Cruises</a></li>
  <li itemprop="name"><a itemprop="url" href="http://www.travelstore.com/interests">Interests</a></li>
  <li itemprop="name"><a itemprop="url" href="http://www.travelstore.com/explore-your-world/interests/hotels-and-resorts">Hotels</a></li>
  <li itemprop="name"><a itemprop="url" href="http://www.travelstore.com/travel-guides">Travel Resources</a></li>
</ul>