【Wordpress SEO対策】ブログの構造化データ(ページマークアップ) を簡単作成(コピペ可)

Google様が推奨する構造化。
こちらのページでは、ブログの記事ページとトップページの構造化データ(マークアップ)を自動掲載する、JSON-LDのコードを載せています。

Google構造化テストツールで作動確認はしていますので
利用環境に合わせて一部手直ししてfunctions.phpにコピペしてもらえば作動する ( はずww )

マークアップ付パンくずと併せて設定すれば [ Schema Markup ] は完了です^^v

構造化データって何?

不要な方はササっと読み飛ばして下さい^^;;
超簡単に意訳させて頂くと。。。

WEBページは、作る人書く人によって構造が違ってしまう。
だから、クローラーがより正確に理解できるよう、構造化データ (共通ルール)に則ってページの内容を伝えてね。

そうすると、

検索結果に正確な情報が載せられる
検索した人も分かりやすくなる
結果的にからSEOに繋がる

更に、見やすいリッチスニペットにしてあげるから、よりクリック率が高まりますよ。

分かりやすくしてくれたら、将来的には検索有利にさせてあげてもいいかもね~
と、そういうお話ですね^^;

構造化ってどうするの?

構造化を簡単に言ってしまえば

タグ付け
[header] [nav][article][aside][section]…etc で、そこに書かれているのが何か分かるようにタグ付けしてね
マークアップ
「このページはブログ記事だよ」「これがページタイトルね」「この人が書いたよ」「ページのurlは」…etc、といった内容を、htmlタグとは別に、決められた方式でマークアップしましょう

という話。

このページは、2. のマークアップのご案内です^^

マークアップとは

HTMLに直接記述する【Microdata】【RDFa】
JavaScriptを使ってページ内にまとめて挿入する【JSON-LD】

の2種類の方式があり、それぞれメリットデメリットがあります。
この辺りは多くの方が説明しておられますので、ここでは割愛^^;;

ここは、ページのマークアップなので管理しやすい【JSON-LD】を使用しています。

以下に掲載するのは【ブログサイトの記事ページとトップページ】用です。

パンくずは別にマークアップします。パンくずはこちら »
また、コーポレートサイトなど、サイトタイプによって必要な掲載内容が異なりますので、ご注意くださいm(__)m

構造化用コード

コードはfunctions.phpにコピペして頂ければOK ですが、、
ご利用の際は、環境に合わせ書き換えた上で、必ず Google構造化テストツールなどで問題がないかご確認下さいね

2023-03-05 PHPバージョンアップの為?? コードが反応しなくなっていたので、その部分と細かいもろもろ修正しました。
記事(single)とフロントページのみ設置されるようにしています。これで ( たぶん ) 大丈夫^^;; (SchemaテストではOKでした^^v )

<?php
/* 
 * 構造化 JSON-LD
 */

function my_jsonld() { 
    if(  is_single() || is_home() || is_front_page() ){ 
    	$custom_logo_id = get_theme_mod( 'custom_logo' );
        $image = wp_get_attachment_image_src( $custom_logo_id , 'full' );
        $ld_logo = $image[0]; 
?> 
<script type="application/ld+json" id="my_jsonld">
{
<?php if( is_single() ){ ?>
	"@context": "https://schema.org",
	"@type": "Article",
	"headline": "<?php echo get_the_title(); ?>", //ページタイトル
	"datePublished" : "<?php echo get_the_time('Y-m-d'); ?>", //公開日
	"dateModified": "<?php echo get_the_modified_time('Y-m-d'); ?>", //更新日
	"description": "<?php echo desc_schema(); ?>", //抜粋。ページdescriptionがあればそちらを
	"image": {
		"@type": "ImageObject",
		"url": "<?php the_post_thumbnail_url( 'large' ); ?>" //アイキャッチ画像 
	},
	"author": {
		"@type": "Person",
		"name": "ブログを書いてる人の名前"
	},  
	"publisher": {
		"@type": "Organization",
		"name": "<?php bloginfo( 'name' ); ?>", //サイト名
		"logo": {
			"@type": "ImageObject",
			"url": "<?php echo $ld_logo; ?>", //ロゴ画像 url直書きでもOK
			"width": 320,
			"height": 69
		}
	},
	"mainEntityOfPage": "<?php echo get_the_permalink(); ?>" //canonical url 
<?php } else { ?>
	"@context": "https://schema.org/",
	"@type": "WebSite",
	"name": "<?php bloginfo( 'name' ); ?>", //サイト名
	"url": "<?php echo home_url(); ?>", //サイトアドレス
	"description": "トップページ用サイト説明",
	"mainEntityOfPage": {
		"@type": "WebPage",
		"@id": "<?php echo home_url(); ?>" //canonical url 
	},
	"potentialAction": {
		"@type": "SearchAction",
		"target": "{search_term_string}",
		"query-input": "required name=search_term_string"
	}
<?php } ?>
}
</script>
<?php
} }
add_action( 'wp_footer', 'my_jsonld' );

コード変更が必要な箇所など

基本的に書き換えが必要な部分は、「水色の部分」「ロゴ画像関係」だけです。

黄色部分(ロゴ画像関係)は、theme-supportのカスタムロゴを利用した場合に、ロゴ画像URLを呼び出すコードです。画像URLを直接書き込む場合などは、削除してください。

【WordPress SEO対策】ブログの構造化データ(ページマークアップ) を簡単作成(コピペ可)