The Master of Swift App Coding

Swiftプログラミングでのアプリ作成方法やWordPressのテクニック解説

【多言語サイト】hreflangタグの設定の仕方【WordPressヘッダー】

投稿日:

hreflangタグは記事ごとに入れないとダメって本当?
hreflangタグの内容は?
こんな疑問に答えます。
別サイトで多言語サイトを運営中、海外在住経験のある僕が解説していきます。

はじめに

今回は、hreflangタグの設定の仕方というテーマで書いてきます。

WordPressを複数インストールして、多言語サイトを作った場合、hreflangタグを自分で設定する必要があります。

ヘッダー内に、数行のコードを書けばいいだけです。
AFFINGERを使っていれば、各記事からヘッダーへの書き込みができるので簡単です。

あとは、各記事に言語間のリンクを貼る。
Search Console の地域ターゲティングを設定する。

この辺の作業を解説していきます。

WordPressを複数インストール型のメリットはこちらの記事に書きました。

関連記事WordPress複数使用で多言語サイトを作るメリット【プラグインなし】

 

hreflangタグを記述する

Googleの公式の解説を参考にしながら、ヘッダーに加えるコードを作成していきます。

ページのローカライズ版について Google に知らせる

トップページにhreflangタグを記述する

<link rel="alternate" hreflang="ja" href="https://xxxxxxxxx.com">
<link rel="alternate" hreflang="en" href="https://xxxxxxxxx.com/en">

各記事にhreflangタグを記述する

<link rel="alternate" hreflang="ja" href="http://xxxxxxxxxxx.com/post-903/">
<link rel="alternate" hreflang="en" href="http://xxxxxxxxxxx.com/en/post-903/">

どちらの記事にも書いて、相互リンクしないと意味ないようです。

hreflangタグを記述する場所

原則、<head> 内に含める必要があるとのことです。

AFFINGERを使っている人は、各記事の「headに出力するコード」の部分に書けばいいだけなので、非常に楽ですね。
トップページは、AFFINGER管理ページの上級者設定から行えます。

それ以外にも、わざわざコードを編集しなくてもカスタムフィールドを使えば、WordPress内で処理できるそうです。

記事やページごとにhead内にタグを追加するカスタマイズ方法
https://www.wapoo-custom.com/custom_manual/head-tag-custum/

hreflangタグ以外の方法を却下した理由

・HTTP ヘッダー
・サイトマップ

これらを編集する必要もあるようです。

でも、どれか1つでいいなら、確実にヘッダーにhreflangタグ入れるのが楽だと思いました。

プラグインで記述する方法もあるようですが、これだけのためにプラグインを使う必要はない気がします。

 

各記事に言語切り替えリンクを貼る

とりあえず、冒頭の文章の後、目次の前に入れてみました。

サイドバーに言語切り替えリンク入れたい

できれば、サイドバーに言語切り替えリンクを表示させたいですよね。
しかし、記事ごとにURLが変わるため、そんな簡単にはできそうにないです。

 

Search Consoleの地域ターゲティング

これも忘れずに設定します。

メインサイトの部分(日本語)

メインサイトは日本語設定です。
これは普通に登録するだけです。

サブディレクトリ(/en/の部分)(英語)

インターナショナルターゲティング>言語

hreflangの状況が表示されます。

インターナショナルターゲティング>国

ターゲットの地域を選ぶこともできます。
(ここで選んでも選ばなくても、Googleは上のhreflangタグなどの要素で地域を判断するようです。)

 

まとめ

今回は、hreflangタグの設定の仕方を書きました。

hreflangタグの内容自体はシンプルで簡単ですね。
面倒なのは、毎回記事のヘッダーに書かなければいけないこと。
毎回記事内にリンクを貼らないといけないことですね。

今のところ、慣れるしかないかな、と思ってます。

Ad-336px-stinger8

Ad-336px-stinger8

-WordPress, 多言語サイト

Copyright© The Master of Swift App Coding , 2018 All Rights Reserved.