【WordPress/Cocoon】How-toの構造化マークアップをカスタムフィールドで設定してみた

how-to検索結果表示 SEO・WEB
画像の出現は出来てないけど、how toの表示が出来ている
スポンサーリンク

初の自力で構造化マークアップの実装化

※2019/9/23に後日譚を追記しました

最近バカ毛さんのブログでFAQやHow-toの構造化マークアップをWordPressで実装化したという記事があったり、そこから運営堂の森野さんも実装してみたりということで、触発されて私もやってみました。

言ってしまったので。。。


という感じでいつもノリで言ってあとは乗ってしまうだけというスタイル。
とりあえず、すでにバカ毛さんが実装手順に関しては記事で紹介してるので、ほとんどそこからの応用でいける感じです。
(AMPStoriesの時もそうですが、いつも勉強になってます!)


【参考・関連記事など】
バカに毛が生えたブログ:
【休日検索雑談】Howto(ハウツー)の構造化をWordPressでやってみました
https://www.baka-ke.com/2019/09/16/howto-structured-data/

構造化データの仕組みについて
https://developers.google.com/search/docs/guides/intro-structured-data?hl=ja

Googleウェブマスター向け公式ブログ:
構造化データを使って、検索結果での表示をより良くしましょう
https://webmaster-ja.googleblog.com/2019/06/enriching-search-results-structured-data.html

schema.org
https://schema.org/

How-toの構造化を実装してみよう

実際の構造化の記述式に関しては、色々やり方がありますけど、一番早いのはすでに実装してるサイトの記述を見て、自分の記事に当てはめて書き換えをするのが楽だし、失敗はしづらいです。

実際の記述の仕方などは省略しますが、記述式を作ったら構造化データ テストツールで問題ないかチェックしておきましょう。

構造化テストでエラーがないか確認


記述式さえ作ればあとは実際の記事を作って、タグを入れ込むだけですね。

私のWordPressのテーマはCocoonというテーマを使っているので、同じテーマを使ってて構造化データを直接入れてる人がいないかググったり、ツイッターで助けて~と言ったら色々と教えて頂いたりして、実装にこぎつけました。

めちゃめちゃ助かりました、はるかさんありがとうございました


ということで、カスタムフィールドという機能で対応出来そうという事で、色々調べてやりました。
ここからは記述入れるまでの手順をざっくりといきます。

今回一番迷ったところがあり、カスタムフィールドを使う際には記事の投稿画面の右上にある表示オプションという部分から設定出来ると、いろんな記事で紹介されていました。

ただ、私の投稿画面を見ると、表示オプションの項目が無いという事態。

この辺りは色々触りまくって見つけたので、同じように表示オプションが投稿画面で見つからないという人も参考にしてみてはと。

 

投稿記事一覧の右上にある表示オプション

 

投稿画面表示オプションなし
投稿画面になると表示オプションが無くて焦るという


投稿画面表示
色々設定触ってみたりした結果単純に右上のアコーディオンが怪しいっぽい


表示オプション
カスタムフィールドの選択項目発見(分かるか)

 

カスタムフィールド表示
投稿画面下部にカスタムフィールドの設定箇所が追加

 

カスタムフィールド追加
設定画面下部にカスタムフィールド追加の箇所がある

 

カスタムフィールド追加②
名前を付けて、構造化の記述式を貼り付け、追加を押すと記事にスクリプトが設定されます

 
これで構造化マークアップのスクリプトは設定出来たので、あとは対応する内容で記事を書いていって公開すると完了です。

公開して実際に検索結果を見てみるとこんな感じ。

how-to検索結果表示
画像の出現は出来てないけど、How-toの表示が出来ている


一応どうにか検索結果にHow-toの形式での表示が見られました。

画像が上手く表示されなかったのが残念でしたけど、この辺りはどうやって修正できるか遊んでみたいと思います。

同じやり方で他の構造化マークアップもある程度の種類は対応出来る気がするので色々遊べそうですね。
他の方にも少しは参考にでもなればいいですが。
(やっぱりバカ毛さんのブログ見た方が一番早いですw)

実際に構造化設定した記事はこちら
https://bkcseo.okinawa/%e6%9c%aa%e5%88%86%e9%a1%9e/morninghowto/

キュレーションメディアへのオマージュ(笑)を込めて。

後日譚:サーチコンソールにHow-toのレポートが追加されました

記事公開から数日後、サーチコンソールを見るとちゃんとHow-toの構造化レポートが表示されました。

有効&警告ああるというのは実装の段階で分かってたので詳細は割愛

今回は実装前のテストで、警告があることも分かってたし、有効なのは検索結果の表示を見て確認していたので、レポートの内容自体は想定通りですね。

普通は企業サイトなどのFAQやらHow-to、その他のコンテンツでまとめて実装するので、想定外のエラーや警告が出てるページなどを見るときに活用する感じになります。

ちゃんとサーチコンソールにも出たということの後日譚になりました、でわでわ。


コメント

タイトルとURLをコピーしました