メニュー
ブログメインイメージ

BLOG

ブログ

2020/05/15

【Breadcrumb NavXT】の導入後、htmlチェッカーでエラーが出た場合

弊社ではホームページの納品前にhtml5チェッカーで、文法エラーがないかチェックいたします。

今回、WordPressプラグイン【Breadcrumb NavXT】の導入時後にチェックしたところ、発見したエラーがあったので記事にさせて頂きます。

解決方法はいたって簡単なのですが、文法チェックされない方にとっては意外な落とし穴かもしれません。

パンくずリストの設置個所に記述するソースにご注意を

プラグイン【Breadcrumb NavXT】のインストール・有効化の後、パンくずリストを設置する箇所にソースを記述します。

記述するソースは、多くの参考サイトで以下のものが紹介されています。

<div class="breadcrumbs" vocab="http://schema.org/" typeof="BreadcrumbList">
  <?php if(function_exists('bcn_display'))
  {
  bcn_display();
  }?>
</div>

<div>の開始タグに記述されている【vocab=”http://schema.org/” typeof=”BreadcrumbList”】の箇所が文法エラーの原因となります。

解決策はいたって簡単。

<div>の開始タグに記述されている【vocab=”http://schema.org/” typeof=”BreadcrumbList”】の箇所を削除します。

削除後のソースは以下の通りです。

<div class="breadcrumbs">
  <?php if(function_exists('bcn_display'))
  {
  bcn_display();
  }?>
</div>

不要な属性を削除してソースもすっきり。

パンくずリストの動作にも全く問題ありません。

html5チェッカーによるエラーの内容は

html5チェッカーでチェックすると【vocab=”http://schema.org/”】、【typeof=”BreadcrumbList”】のそれぞれに対してエラーの内容が表示されます。

01. 【vocab="http://schema.org/"】の属性に対して<DIV> に不明な属性 `VOCAB` が指定されています。

02. 【typeof="BreadcrumbList"】の属性に対して<DIV> に他のHTML用の属性 `TYPEOF` が指定されています。

それぞれ、解説もついてますので、一度html5チェッカーで試してみてください!

CONTACT

お問い合わせ

株式会社京都ホームページ
京都本社 京都市伏見区納所下野27-32
京都営業所 京都市下京区中堂寺南町134
京都高度技術研究所8F

まずはお気軽にお問い合わせください。

お問い合わせフォーム 075-754-7836
©2020 株式会社京都ホームページ
close

HOME
SERVICE
WORKS
COMPANY
CONTACT

ページトップへ