表示ページテンプレートのSEOおよびOpen Graph設定の構成
対応バージョン:Liferay DXP/Portal 7.3以降
表示ページテンプレートとは、特定のURLに個々のコンテンツアイテムを表示するためのカスタムレイアウトのことです。 これらのレイアウトはフラグメントとウィジェットの両方を使用しており、Webコンテンツの記事、ドキュメント、ブログ記事など、さまざまな用途向けに作成できます。 各テンプレートには、手動または動的に入力できる独自のSEOおよびOpen Graph設定があります。
表示ページテンプレートの SEO および Open Graph 設定を構成するには、
-
サイトメニュー (
を開き、 デザイン → ページテンプレートに移動し、 ページテンプレートの表示 タブをクリックします。注記SEOとOpen Graphは、他の種類のページ(コンテンツページなど)にも設定できます。 そのためには、 サイトビルダー → ページ に移動し、設定したいページの横にある アクション (
) をクリックし、 設定 をクリックします。 次の手順をスキップして、チュートリアルを通常どおり続行してください。
-
目的のテンプレートの アクション (
) をクリックし、 編集 を選択します。 テンプレートを編集するときは、アプリケーション バーの オプション (
) をクリックし、 設定 (
) をクリックします。 -
SEO または Open Graph タブに移動して、必要な設定を入力します。
![[SEO]タブと[Open Graph]タブに目的の構成を入力します。](https://resources.learn.liferay.com/images/dxp/latest/en/sites/displaying-content/using-display-page-templates/configuring-seo-and-open-graph-settings-for-display-page-templates/images/02.png)
-
をクリックして保存します。
重要SEOタブとOpen Graphタブの間を移動すると、保存されていない変更内容は失われます。
SEOとOpen Graphの設定を行う際、値を直接入力したり、フィールドマッピングを使用して値を動的に追加したりできます。 利用可能なマッピングオプションは、テンプレートのコンテンツタイプとサブタイプによって異なります。 フィールドをマッピングするには、フィールドセレクター ( (
)をクリックし、使用可能なフィールドから選択します。 Liferay DXP 7.4 U1 および Portal 7.4 GA5 以降では、このように追加されたフィールドは、フィールド参照 ID とフィールドラベル (${fieldReferenceID:Field Label} の 2 つの部分を持つ ${} のプレースホルダーとして表されます。
以前のバージョンでは、マッピングプレースホルダーにはフィールド参照 ID のみが含まれます (例: ${title}、 ${authorName}、 ${Text84981642})。
Liferay は、管理側での明確化のためにフィールド ラベル値を提供します。カスタム Web コンテンツやドキュメント構造内のフィールド参照 ID は人間が読みやすいものではないためです (例: ${Text84981642:Contributors})。 このラベルはエンドユーザーには表示されず、マッピングにも影響しないため、ユーザーは自由に編集できます。 マッピングは、プレースホルダーのフィールド参照IDのみに依存します。
Liferayは、可能な場合はマッピングされたフィールドの翻訳を提供します。 ただし、マッピングされたフィールド以外の場所に入力されたテキストは翻訳されません。
SEO設定リファレンス
検索エンジン最適化(SEO)とは、検索エンジンの検索結果ページ(SERP)におけるページのランキングを向上させるために用いられる手法のことです。 表示ページテンプレートを使用すると、SEO対策のためにコンテンツの表示ページを設定できます。
HTMLタイトル
HTML タイトル フィールドは、表示ページの <title> タグを定義します。 このタイトルは、検索エンジンがページのランキングを決定する際に使用され、検索結果におけるページの見出しとして機能します。 デフォルトでは、表示ページテンプレートはこのフィールドを ${title} にマッピングします。 この値を直接編集し、フィールドセレクタを使用して追加のマッピングを含めることができます(例: ${title} - ${authorName:Author Name})。
HTMLタイトル の推奨文字数は60文字未満です。
SEOタイトルとOpen Graphタイトルは同時に更新するのがベストプラクティスです。

説明
説明フィールドは、表示ページの記述タグを定義します。 <meta> 検索エンジンはこの説明文を使用してページのランキングを決定し、検索結果にはページのプレビューとして表示されます。 デフォルトでは、表示ページテンプレートはこのフィールドを ${description} にマッピングします。 この値を直接編集し、フィールドセレクタを使用して追加のマッピングを含めることができます(例: ${description} - ${authorName:Author Name})。
ページの説明文の推奨文字数は155文字未満です。
SEOとOpen Graphの説明文は同時に更新するのがベストプラクティスです。

ロボット
Robots フィールドは、表示ページの <meta name="robots"> タグを設定します。 このタグは、検索エンジンがページをクロールしてインデックスを作成する方法を制御します。 ページがインデックスされないようにするには、 noindex のような値を指定したり、検索エンジンがページ上のリンクをたどらないようにするには、 nofollow のような値を指定したりできます。 Robots meta tag、data-nosnippet、および X-Robots-Tag 仕様 で、robots meta tag についてさらに詳しく学びましょう。
これらの値を指定すると、HTMLコード内でrobotsフィールドは次のように表示されます。
<meta name="robots" content="noindex, nofollow">
言語フラグを使用して、このフィールドをローカライズすることもできます。

Robotsフィールドは、コンテンツが自身のフレンドリーURLでアクセスされた場合に適用されます。 Liferay は、表示ページ テンプレートの /e/ リンクを介してアクセスされるコンテンツのフィールドを無視します。これは、ページから特定のテンプレートにリンクしたときに作成される URL です。 これらのリクエストには、このフィールドをインデックスするように設定した場合でも、常に noindex、nofollowが含まれます。 それは、デフォルトのものを含め、リンク名が示すテンプレートをすべて保持します。
サイトマップ
sitemap.xml ファイルに表示ページを含めるかどうかを決定し、その優先度と変更頻度フィールドを設定します。 これらは、検索エンジンに対して、表示ページをクロールしてインデックスを作成するかどうか、他のサイトページと比較してどの程度の優先順位を付けるべきか、そしてどのくらいの頻度で更新されるかを指示するものです。
Liferay DXP 2024.Q2+/Portal GA120+ XML サイトマップの [子ページ URL を含める] ボックスで [子ページ URL を含める] をオン/オフすることで、XML マップ上の子ページのインデックス作成を有効/無効にします。 詳細については、 XML サイトマップの設定 をお読みください。

Open Graph設定リファレンス
対応バージョン:Liferay DXP/Portal 7.3以降
Open Graph は、Facebook、Slack、Twitter など、それをサポートするアプリケーション コンテキストで共有されるときにサイト コンテンツのプレビューを標準化するインターネット プロトコルです。 これは、 <meta> タグとして構造化データをページ ヘッダーに埋め込むことによって実現されます。これは、 RDFa と同様です。
Liferay DXP を使用すると、ページの Open Graph <meta> タグを動的に構成する表示ページ テンプレートを作成できます。 ここで定義された値は、 サイト レベルで定義されたデフォルト値を上書きします。
Open Graph <meta> タグは、認証されていないユーザーのページ ヘッダーにのみ含まれます。 ユーザーがログインしている場合は、それらは含まれません。
タイトル
Title フィールドは、表示ページの og:title プロパティを定義します。これは、リッチ プレビューでコンテンツに表示されるタイトルを定義します。 デフォルトでは、このフィールドは ${title} にマッピングされます。 この値を直接編集し、フィールドセレクタを使用して追加のマッピングを含めることができます(例: ${title} - ${authorName:Author Name})。
SEOタイトルとOpen Graphタイトルは同時に更新するのがベストプラクティスです。

説明
説明フィールドは、リッチプレビューでコンテンツに表示される説明を決定する表示ページの og:description プロパティを定義します。 デフォルトでは、このフィールドは ${description} にマッピングされます。 この値を編集し、フィールドセレクタを使用して追加のマッピングを含めることができます(例: ${description} - ${authorName:著者名})。
SEOとOpen Graphの説明文は同時に更新するのがベストプラクティスです。

画像
Image フィールドは、表示ページの og:image プロパティを定義し、リッチ プレビューでコンテンツに表示される画像を設定します。 DXPは、基本的な画像タグに加えて、選択した画像の表示方法を決定する多くの構造化プロパティを自動的に追加します。 Image フィールドは、次の <meta> タグを定義します。
<meta property="og:image" content="http://example.com/ogp.jpg" />
<meta property="og:image:secure_url" content="https://secure.example.com/ogp.jpg" />
<meta property="og:image:type" content="image/jpeg" />
<meta property="og:image:width" content="400" />
<meta property="og:image:height" content="300" />
デフォルトでは、このフィールドは表示ページテンプレートではマッピングされていません。 これは、別の画像フィールドを選択しない限り、テンプレートはサイトレベルで設定された画像セットをデフォルトで使用することを意味します。

画像代替説明
画像代替説明フィールドは、表示ページの og:image:alt プロパティを定義します。これは、表示コンテンツの og:image プロパティに対してスクリーンリーダーが読み上げる代替テキストを決定します。
<meta property="og:image:alt" content="This is an example." />
デフォルトでは、このフィールドは表示ページテンプレートではマッピングされていません。 これは、別のテキストフィールドを選択しない限り、テンプレートはサイトレベルで設定されたaltテキストをデフォルトで使用することを意味します。
