Navbar BreadcrumbList: A value for the id field is required

[dimassamid]

Hello!

Google Search Console sent me a message that my site navigation contains a lot of errors in a different pages. The problem with BreadcrumbList in navbar.

A value for the id field is required

I tested on a clean forum. The problem with the new navbar, which comes with the 3.3.0
There was no such error on 3.2.8

navbar error.png

Could you help me? How can I fix it?

Thanks in advance!

[GIK-Team]

I have a similar problem

[Prosk8er]

its not a specific 3.3.x problem i was getting the email on 3.2.x they probably just finally noticed it and emailed you
i got my email from them nov 20th 2019

[jackennils]

I fixed this in my custom style before 3.3 and now after implementing the 3.3 changes in my style it came back. Definitely a problem of 3.3.

Possible solution:

Open "navlink_header.html" in the prosilver template folder.

Find:

Code: Select all

	<ul id="nav-breadcrumbs" class="nav-breadcrumbs linklist navlinks" role="menubar">
		<!-- DEFINE $MICRODATA = ' itemtype="http://schema.org/ListItem" itemprop="itemListElement" itemscope' -->
		{% set navlink_position = 1 %}
		<!-- EVENT overall_header_breadcrumbs_before -->
		<li class="breadcrumbs" itemscope itemtype="http://schema.org/BreadcrumbList">
			<!-- IF U_SITE_HOME -->
				<span class="crumb" {$MICRODATA}><a href="{U_SITE_HOME}" itemtype="https://schema.org/Thing" itemscope itemprop="item" data-navbar-reference="home"><i class="icon fa-home fa-fw" aria-hidden="true"></i><span itemprop="name">{L_SITE_HOME}</span></a><meta itemprop="position" content="{{ navlink_position }}{% set navlink_position = navlink_position + 1 %}" /></span>
			<!-- ENDIF -->
			<!-- EVENT overall_header_breadcrumb_prepend -->
				<span class="crumb" {$MICRODATA}><a href="{U_INDEX}" itemtype="https://schema.org/Thing" itemscope itemprop="item" accesskey="h" data-navbar-reference="index"><!-- IF not U_SITE_HOME --><i class="icon fa-home fa-fw"></i><!-- ENDIF --><span itemprop="name">{L_INDEX}</span></a><meta itemprop="position" content="{{ navlink_position }}{% set navlink_position = navlink_position + 1 %}" /></span>

			<!-- BEGIN navlinks -->
				{% set NAVLINK_NAME = navlinks.BREADCRUMB_NAME | default(navlinks.FORUM_NAME) %}
				{% set NAVLINK_LINK = navlinks.U_BREADCRUMB | default(navlinks.U_VIEW_FORUM) %}
				<!-- EVENT overall_header_navlink_prepend -->
				<span class="crumb" {$MICRODATA}<!-- IF navlinks.MICRODATA --> {navlinks.MICRODATA}<!-- ENDIF -->><a href="{{ NAVLINK_LINK }}" itemtype="https://schema.org/Thing" itemscope itemprop="item"><span itemprop="name">{{ NAVLINK_NAME }}</span></a><meta itemprop="position" content="{{ navlink_position }}{% set navlink_position = navlink_position + 1 %}" /></span>
				<!-- EVENT overall_header_navlink_append -->
			<!-- END navlinks -->
			<!-- EVENT overall_header_breadcrumb_append -->
		</li>
		<!-- EVENT overall_header_breadcrumbs_after -->

		<!-- IF S_DISPLAY_SEARCH and not S_IN_SEARCH -->
			<li class="rightside responsive-search">
				<a href="{U_SEARCH}" title="{L_SEARCH_ADV_EXPLAIN}" role="menuitem">
					<i class="icon fa-search fa-fw" aria-hidden="true"></i><span class="sr-only">{L_SEARCH}</span>
				</a>
			</li>
		<!-- ENDIF -->
	</ul>

Replace with:

Code: Select all

	<ul id="nav-breadcrumbs" class="nav-breadcrumbs linklist navlinks" role="menubar">
		<!-- DEFINE $MICRODATA = ' itemtype="http://schema.org/ListItem" itemprop="itemListElement" itemscope' -->
		{% set navlink_position = 1 %}
		<!-- EVENT overall_header_breadcrumbs_before -->
		<li class="breadcrumbs" itemscope itemtype="http://schema.org/BreadcrumbList">
			<!-- IF U_SITE_HOME -->
				<span class="crumb" {$MICRODATA}><a href="{U_SITE_HOME}" itemprop="item" data-navbar-reference="home"><i class="icon fa-home fa-fw" aria-hidden="true"></i><span itemprop="name">{L_SITE_HOME}</span></a><meta itemprop="position" content="{{ navlink_position }}{% set navlink_position = navlink_position + 1 %}" /></span>
			<!-- ENDIF -->
			<!-- EVENT overall_header_breadcrumb_prepend -->
				<span class="crumb" {$MICRODATA}><a href="{U_INDEX}" itemprop="item" accesskey="h" data-navbar-reference="index"><!-- IF not U_SITE_HOME --><i class="icon fa-home fa-fw"></i><!-- ENDIF --><span itemprop="name">{L_INDEX}</span></a><meta itemprop="position" content="{{ navlink_position }}{% set navlink_position = navlink_position + 1 %}" /></span>

			<!-- BEGIN navlinks -->
				{% set NAVLINK_NAME = navlinks.BREADCRUMB_NAME | default(navlinks.FORUM_NAME) %}
				{% set NAVLINK_LINK = navlinks.U_BREADCRUMB | default(navlinks.U_VIEW_FORUM) %}
				<!-- EVENT overall_header_navlink_prepend -->
				<span class="crumb" {$MICRODATA}<!-- IF navlinks.MICRODATA --> {navlinks.MICRODATA}<!-- ENDIF -->><a href="{{ NAVLINK_LINK }}" itemprop="item"><span itemprop="name">{{ NAVLINK_NAME }}</span></a><meta itemprop="position" content="{{ navlink_position }}{% set navlink_position = navlink_position + 1 %}" /></span>
				<!-- EVENT overall_header_navlink_append -->
			<!-- END navlinks -->
			<!-- EVENT overall_header_breadcrumb_append -->
		</li>
		<!-- EVENT overall_header_breadcrumbs_after -->

		<!-- IF S_DISPLAY_SEARCH and not S_IN_SEARCH -->
			<li class="rightside responsive-search">
				<a href="{U_SEARCH}" title="{L_SEARCH_ADV_EXPLAIN}" role="menuitem">
					<i class="icon fa-search fa-fw" aria-hidden="true"></i><span class="sr-only">{L_SEARCH}</span>
				</a>
			</li>
		<!-- ENDIF -->
	</ul>

I basically removed the 3 instances of

Code: Select all

itemtype="https://schema.org/Thing" itemscope 

from the file and Google seems to like it.

[arbsoft]

Check it out: https://search.google.com/test/rich-res ... zrivHMvoHg

You will see this error "Not all markup is eligible for rich results".

In order to fix it, remove "itemscope" of all occurrences of

Code: Select all

itemtype="https://schema.org/Thing" itemscope

In \styles\prosilver\template\navbar_header.html

[jackennils]

So basically what I already posted.

[david63]

Has anyone posted this in the Bug Tracker?

[jackennils]

I can do it if you want.

[david63]

I can do it if you want.

Somebody who knows about the problem should do it

[jackennils]

Okay, I'm on it.

[mrgoldy]

poke

You might know more about this

[3Di]

...
In order to fix it, remove "itemscope" of all occurrences of

Code: Select all

itemtype="https://schema.org/Thing" itemscope

In \styles\prosilver\template\navbar_header.html

itemscope shouldn't be removed since specifies that a block of an HTML element is about a particular item.

Let's try ... in \styles\prosilver\template\navbar_header.html

Find
<span class="crumb" {$MICRODATA}><a href="{U_SITE_HOME}"
Inline replace with
<span class="crumb" {$MICRODATA}><a href="{U_SITE_HOME}" id="{U_SITE_HOME}"

Find
<span class="crumb" {$MICRODATA}><a href="{U_INDEX}"
Inline replace with
<span class="crumb" {$MICRODATA}><a href="{U_INDEX}" id="{U_INDEX}"

Find

Code: Select all

<span class="crumb" {$MICRODATA}<!-- IF navlinks.MICRODATA --> {navlinks.MICRODATA}<!-- ENDIF -->><a href="{{ NAVLINK_LINK }}"

Inline replace with

Code: Select all

<span class="crumb" {$MICRODATA}<!-- IF navlinks.MICRODATA --> {navlinks.MICRODATA}<!-- ENDIF -->><a href="{{ NAVLINK_LINK }}" id="{{ NAVLINK_LINK }}"

I can't test it now. See: https://search.google.com/structured-data/testing-tool

[Senky]

Hmm, apparently a new specification, I tested it in the past, it passed all tests. Apparently, id can be a link, so you can just copy URL of the breadcrumb to the ID and it should work.

[3Di]

Yes, id (identifier) can be an URL, TEXT and something else I forgot.
https://schema.org/identifier

PR: https://github.com/phpbb/phpbb/pull/5836

[vikingman]

Post by "3Di » Thu Jan 16, 2020 5:12 am"

Seems to work for me. Saw some error (white page with one line error message on top) upon first page reload, but then worked fine.

Google Search Console now happy and no more Breadcrumbs "missing ID" related error.