メタタグを動的に出し分け!軽量PHPスニペットでSEO対応をスマートに実現する方法
スポンサーリンク

こんにちは!静岡県浜松市でWEBデザイナーをしています小瀧です。
今回は、動的にメタタグを設定する軽量なPHPスニペットについてご紹介します。

SEOの基本である title meta name="description"、さらにはOGPの meta property="og:〜" などのタグは、ページごとに異なる内容にすることが必須です。
でも、WordPressのようなCMSを使っていないと、「どこでどう出し分けたらいいの?」と悩むこともありますよね。

そんなときに便利なのが、1ファイルだけで完結する簡潔なメタタグ管理のスニペットです!


目的:ページごとにタイトルやOGPを変える

静的HTML+PHPで構成された小規模サイトなどでは、テンプレートファイルを使い回しながらも、各ページに適したメタ情報を柔軟に設定する仕組みが求められます。

  • トップページ → 「会社の概要」
  • 会社概要 → 「◯◯株式会社とは?」
  • サービス紹介 → 「Web制作サービス | ◯◯株式会社」

このようなメタ情報をURLまたはファイル名で判別して出力する方法を構築していきます。


PHPスニペット:基本構造

以下のようなコードを head.php などに書き、HTMLの head 部分で読み込むことで、ページごとにメタタグを出し分けられます。

 <?php $page = basename($_SERVER['PHP_SELF'], '.php');
    $meta = ['index' => ['title' => '浜松のWeb制作会社 | サイト名', 'description' => '静岡県浜松市でWeb制作を行う「サイト名」の公式サイトです。',], 'about' => ['title' => '会社概要 | サイト名', 'description' => 'サイト名の会社概要ページ。私たちの理念や沿革を紹介します。',], 'service' => ['title' => 'サービス紹介 | サイト名', 'description' => 'Web制作、SEO対策などのサービスについて紹介しています。',]];
    $title = $meta[$page]['title'] ?? 'サイト名';
    $description = $meta[$page]['description'] ?? '浜松市のWeb制作ならおまかせください。'; ?> <title><?= htmlspecialchars($title) ?></title>
 <meta name="description" content="<?= htmlspecialchars($description) ?>">

これにより、ファイル名が about.php のときは about キーの情報が表示されるようになります。

汎用性を高めたい場合

URLのクエリやパス情報を使いたい場合は$_SERVER['REQUEST_URI'] で判別する方法もあります:

 <?php $request_uri = $_SERVER['REQUEST_URI'];
    if (strpos($request_uri, 'service') !== false) {
        $title = 'サービスページ';
    } ?>

条件を増やすことで、ディレクトリ構造に応じた細かい出し分けも可能になります。


スポンサーリンク

OGP・Twitterカードにも応用可能

このスニペットは、OGPのようなSNS用メタタグにもそのまま応用できます。

<meta property="og:title" content="<?= htmlspecialchars($title) ?>">
<meta property="og:description" content="<?= htmlspecialchars($description) ?>">
<meta property="og:type" content="website">
<meta property="og:url" content="https://example.com/<?= $page ?>.php">
<meta property="og:image" content="https://example.com/images/ogp-default.jpg">

Twitterカード用にも同様に設定できます。

<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:title" content="<?= htmlspecialchars($title) ?>">
<meta name="twitter:description" content="<?= htmlspecialchars($description) ?>">

これで、SNSシェア時もページごとに最適な情報が表示されるようになります。


補足:meta情報をJSONなどに分離してもOK

規模が大きくなる場合は、メタ情報だけを外部ファイル(たとえば meta.json)に分けて管理するとより柔軟です。

{
        "index": {
            "title": "トップページ",
            "description": "トップの説明"
        },
        "blog": {
            "title": "ブログ一覧",
            "description": "ブログ記事一覧"
        }
    }

読み込み方法

<?php
$meta_json = json_decode(file_get_contents('meta.json'), true);
$title = $meta_json[$page]['title'] ?? 'デフォルトタイトル';
?>

これで非エンジニアの編集も可能な仕組みになります。


まとめ

動的なメタタグ出し分けは、小規模サイトやカスタムCMSでも導入可能なSEO対策の第一歩。
今回ご紹介したPHPスニペットを使えば、わざわざ重たいCMSを使わなくても、ページごとに最適化されたメタタグ出力ができます。

  1. basenameで現在のページ名を取得し、条件で分岐
  2. title・description・OGP情報をPHPで動的に出力
  3. 外部ファイル化すれば柔軟で再利用性もアップ

「HTMLベースだけどSEOをちょっと強化したい」そんなときに、ぜひ取り入れてみてください!

 

satokotadesignキャンペーン実施中!

ぶっちゃけ無料相談会!ホームページ制作の悩み話してみませんか?
satokotadesign4周年記念キャンペーン

静岡県浜松市でホームページ制作ならsatokotadesign
静岡県浜松市でホームページ制作ならsatokotadesign

スポンサーリンク
おすすめの記事