WpTHK 3.01 リリース（SEO 強化と修正） アップデート大推奨

2016年11月11日

data-vocabulary.org が運営を停止してしまったので、
WpTHK 3.x からパンくずリストも全て、schema.org に移行したのですが、

Google の構造化データを見直したところ、
パンくずは、BreadcrumbList だけでなく、breadcrumb で全体を囲まないとダメみたい。
なので、修正しました。

また、schema.org で汎用的に付けられそうな箇所が、他にもあったので拡張して付与しました。

特に schema.org 2.0 で追加された mainEntityOfPage を Google がちゃんと認識してることを確認できたので、これが使えるのは大きい。

テーマとしての汎用性を持たせるために、 Artcle を付けられずにいたけど、 Article でなくとも、ほぼ全てで付けられる mainEntityOfPage が使えるので、投稿本文に付与して「これがメインのコンテンツだよ」と検索エンジンに伝えることができるようになりました（まぁ、もともとメインの部分は HTML5 の article で囲ってるので、意味あるか分からんけど）。

さらに、デフォルトのテンプレートじゃ無理だけど、プログラムさえ書き換えれば、コメントにも付けられそうだったので、 UserComments と、その配下のプロパティ ( creator, commentTime, commentText, replyToUrl ) も付けました。 WordPress のテーマで UserComments まで、しっかり付けてるテーマって、なかなか無いんじゃないですかね？

それ以外、もともと付いてるものも含めて、WpTHK の schema.org のページ を詳しく書き換えたので、検索エンジンから、どんな風に見えてるか知りたい方は、そちらを参照してください。

・・・

あとは、小さなバグ４件ほど、直しました。

おまけ：
デフォルトじゃないけどニコニコ動画などもレスポンシブにできるようにした (詳細後述)

構造化データ（schema.org）拡張と修正

  1. パンくずを itemprop="breadcrumb" で囲むように修正
  2. 投稿本文に以下を付与
    • itemprop="mainEntityOfPage"
  3. コメント欄に以下を付与
    • itemtype="http://schema.org/UserComments"
    • itemprop="creator name"
    • itemprop="commentTime"
    • itemprop="commentText"
    • itemprop="replyToUrl"
  4. 広告に以下を付与
    • itemtype="https://schema.org/WPAdBlock"
    • itemprop="headline name"
    • itemprop="about"
  5. 記事の投稿者名に以下を付与
    • itemprop="editor author creator copyrightHolder"
  6. ヘッダーに以下を付与
    • itemtype="https://schema.org/WPHeader"
    • itemprop="name"
  7. フッターに以下を付与
    • itemtype="https://schema.org/WPFooter"
    • itemprop="copyrightHolder name"
  8. あまり意味ないけど検索結果ページに以下を付与
    • itemprop="SearchResultsPage"

バグの修正

  1. 検索結果のハイライト表示ができないカスタマイズの組み合わせがあったバグの修正
  2. CSS の読み込み順が異なり、実際のサイト表示とカスタマイズプレビューの見た目が合わない可能性があったので修正
  3. 子テーマの CSS に何も追記してない状態で子テーマ CSS 圧縮をすると 404 Not Found になっちゃうので、一応修正
  4. Embed のブログカードで、下に大きな余白ができてしまうバグの修正

機能追加じゃないけど、なんとなくやってみたこと

  1. ニコニコ動画なども、レスポンシブに簡単に対応できるようにしてみた（詳細は後述）

Embed のブログカードの下余白の修正サンプル

WpTHK 3.00 リリース（設定次第で 2.x 系より確実に速いです）

ニコニコ動画のレスポンシブ

以下のように、取得した script や iframe のタグを

<div class="i-video"></div>

で囲ってください。

<div class="i-video">
<script type="text/javascript" src="http://ext.nicovideo.jp/thumb_watch/sm～
</div>

今後の話

ver3.00 リリースの時にも書きましたが、

不具合の修正や WordPress の仕様変更対応以外では、
当分の間は機能追加等はしません。

今度こそｗ 当分リリースはお休みです。

WpTHK

Posted by るな