SEOに効果あり!WordPressの構造化マークアップ(Schema.org)まとめ サンプル付き - inokawablog

    SEOに効果あり!WordPressの構造化マークアップ(Schema.org)まとめ サンプル付き

    先にサンプルコードを表示して、後から解説を行います。microdataというマークアップの方法で行っています。

     

    構造化マークアップする項目は以下

    ヘッダー

    • ヘッダー
    • フッター
    • サイドバー
    • ナビゲーション
    • パンくずリスト
    • ブログ記事

     

    それでは、やっていきます。

     

    ヘッダー

    header.php

    <header itemscope="itemscope" itemtype="http://schema.org/WPHeader" >

     

    フッター

    footer.php

    <footer id="footer" role="contentinfo" itemscope="itemscope" itemtype="http://schema.org/WPFooter">

     

    サイドバー

    sidebar.php

    <div id="sidebar"  role="complementary" itemscope="itemscope" itemtype="http://schema.org/WPSideBar">

     

    ナビゲーション

    このような形になります。

    <ul>
    	<li itemprop="url"><a href="#" itemprop="name">sample1</a></li>
    	<li itemprop="url"><a href="#" itemprop="name">sample2</a></li>
    	<li itemprop="url"><a href="#" itemprop="name">sample3</a></li>
    	<li itemprop="url"><a href="#" itemprop="name">sample4</a></li>
    	<li itemprop="url"><a href="#" itemprop="name">sample5</a></li>
    </ul>

     

    実際の実装方法はこちら。

    WordPress 構造化マークアップ済ナビゲーションを作成 コピペOK

     

    パンくずリスト

    パンくずリストではJSON-LDというマークアップの方法を用いています。別記事にまとめておきました。こちらをご覧ください。

    WordPress 構造化マークアップ済パンくずリストを作成。コピペOK

     

    ブログ記事

    ブログ記事でもJSON-LDというマークアップの方法を用いています。

    別記事にまとめておきました。

    WordPressのSchema.orgの設定。ブログ用構造化データを埋め込む。サンプル付

     

    できたら構造化データテストツールでマークアップできているか確認を取りましょう。

     

     

    解説

    構造化データのitem_scopeやrole、item_typeなどの詳細はこちらにまとめっています。