SEO対策のためにWordPressに構造化データを追加したい。
構造化データとは、 Webページの構造をGoogleに分かりやすく伝えるためコードのことです。
EATが重視される昨今、OrganizationやPersonといった構造化データを追記して、しっかりGoogleに伝えおくことをおすすめします。
本記事ではSWELLでの構造化データの設置方法に関して、具体的なコードを記載してわかりやすく解説します。
WordPressテーマの構造化データを調べる方法
まず記事の構造化データ(JSON-LD)は下記のGoogleのサービスで調べることができます。
ちなみに｢このツールは廃止されます。｣と警告がでるのですが、リッチリザルトテストでは構造化データの分析がしづらいので、また上記のサイトを利用しています。
WordPressの構造化データ(JSON-LD)
WordPressテーマ｢SWELL｣で作成したで構造化データの状態を調べてみましょう。
トップページ
- WebSite
- SiteNavigationElement（グローバルメニューを設定している場合）
記事ページ
- BreadcrumbList
- Article
と必要最低限の構造化データ(JSON-LD)の情報が組み込まれています。
しかし「Organization」「Person」など、ただもっとGoogleにしっかり伝えておきたい情報があります。
次項はその構造化データの情報を追加してみることにします。
構造化データの種類一覧
ちなみに構造化データの種類は下記のサイトにまとまっています。
SWELLで構造化データに関係する入力箇所
ユーザー ＞ プロフィールに入力する場所も重要です。
各種SNSの項目や構造化データ用URLに関連する企業や事業のURLを記載しておきましょう。
あとは著者紹介ページをブログパーツで作成。
そのブログパーツIDを入力して関連付けておくこともお勧めします。
SWELLで構造化データを追加する方法
では早速、Googleに伝えるための情報、構造化データ(JSON-LD)を作成してテーマに入れてみましょう。
下記のサイトを使うと構造化データの入力が捗ります。
設定できる構造化データは下記の10個です。
- Article
- Breadcrumb
- Event
- FAQ Page
- How-to
- Job Posting
- Local Business
- Organizetion
- Person
- Product
今回は「Organization（組織）」「Person（個人）」を作成してみましょう。
こちらが実際に使用したコードです。
Organizationの構造化データ例
<script type="application/ld+json">
{
"@context": "https://schema.org",
"@type": "Organization",
"name": "CGメソッド",
"alternateName": "CG-Method",
"url": "https://www.cg-method.com/",
"logo": "https://www.cg-method.com/wp-content/uploads/2020/08/CG_METHOD_NEPTUNE_White_LOGO.png",
"sameAs": [
"https://www.facebook.com/cg.meth0d/",
"https://twitter.com/cg_method",
"https://www.instagram.com/optimizer_life/?hl=ja",
"https://www.youtube.com/channel/UCqRExSeEm8n1w_oO0OzjXHA/",
"https://www.pinterest.jp/cg_method/",
"https://gist.github.com/cg-method",
"https://www.cg-method.com/"
]
}
</script>Personの構造化データ例
<script type="application/ld+json">
{
"@context": "https://schema.org/",
"@type": "Person",
"name": "suimin",
"url": "https://www.cg-method.com/",
"image": "https://www.cg-method.com/wp-content/uploads/2020/08/CG_METHOD_NEPTUNE_White_LOGO.png",
"sameAs": [
"https://www.facebook.com/cg.meth0d/",
"https://twitter.com/cg_method",
"https://www.instagram.com/optimizer_life/?hl=ja",
"https://www.youtube.com/channel/UCqRExSeEm8n1w_oO0OzjXHA/",
"https://www.pinterest.jp/cg_method/",
"https://gist.github.com/cg-method",
"https://www.cg-method.com/"
],
"jobTitle": "designer",
"worksFor": {
"@type": "Organization",
"name": "japan"
}
}
</script>では早速いれてみましょう。
全ページに構造化データを入れたい場合
全ページに構造化データを入れたい場合はSWELLのカスタマイズから高度な設定>headタグ終了直前に出力するコードにHTMLをコピペしましょう。
記事単位で入れる場合
記事編集画面を開く、一番下にカスタムHTMLのブロックを作成して、そこにHTMLのコードを入れてみましょう！
もう一度、構造化データ テストツールで調べてみましょう。
ちゃんと追加した構造化データが検出されました。
ちゃんと中身の構造化データも入ってます。
SWELLで既存の構造化データを修正する方法
SWELLのテーマから吐き出されている構造化データ(JSON-LD)は下記のPHPに格納されています。
/wp-content/themes/swell/classes/SWELL_THEME/Output/Javascript.php
※こちらのコードはテーマ側のコアファイル群なので上書きが難しいデータでした。しかしSWELL ver. 2.3.3アップデートで改善されました。
JSON-LDの上書きが方法
SWELL ver. 2.3.3 アップデートでJSON-LDの上書きが可能になりました。
例えばfunctions.phpに下記のコードを追加すると
add_filter( 'swell_json_ld_article_data', function( $data ) {
$data['publisher_name'] = 'CGメソッド';
return $data;
} );Articleのpublisherのnameがサイト名ではなく事業名に上書きできます。
まとめ
本記事ではSWELLでの構造化データを追加・上書きする方法について書きました。
著者情報などGoogleに必要な情報をしっかり伝えておきたい、と思っている方はデータ構造を入れておいたほうが良いと思います。
