ヘッドタグ内容を共通化する(外部ファイルの取込)

外部ファイルを取り込んでヘッドタグ内容を共通化する方法です。ヘッドタグより前で文字列を定義してから、登録した文字列を外部ファイルにしたヘッドタグ内で使います。その外部ファイルをヘッドタグ内にインクルードします。

サーバーの写真

私はメニューやアフィリエイトでPHPを使って外部ファイルを取り込むようになってから、ファイルの管理が非常に楽になりました。ボディ(BODY)タグ内にPHPやSSIを使用して外部ファイルを取込む方法はよく使う手法で、一般的にホームページではよく使われています。

他方、ヘッドタグ内ではあまり外部ファイルを取り込んでいる例を見ません。これは、メタタグのdescriptionやkeywordsやタイトルタグの内容がページによって異なるからではないでしょうか。

私はメタタグ内のdescriptionやkeywordsやタイトルタグの内容がページによって異なっていても、ヘッドタグ内でPHPを使って外部ファイルを取り込んでヘッドタグの内容を別ファイルにして共通化してみました。次にその方法を説明します。

メタタグやタイトルタグより前で文字列を定義します

次のように ヘッドタグ楽天 の中で、メタタグのdescriptionやkeywordsやタイトルタグの内容を文字列に登録します。

<?php $des_c = "ページの説明文"; ?>
<?php $key_w = "キーワード群"; ?>
<?php $title = "ページのタイトル"; ?>

登録した文字列を外部ファイルにして、ヘッドタグ内で使います

次のように外部ファイルにしたヘッドタグ内の使いたい文字列の所で、登録した文字列を表示させます。もし、ボディタグ内でも使いたい場合は、更に表示させて使っても何らかまいません。タイトル($title)をH1タグ内で使ってページの見出しをタイトルと同じにすることもできます。

<?php echo $des_c; ?>
<?php echo $key_w; ?>
<?php echo $title; ?>

外部ファイルにしたタグを使った例

外部ファイルにしたヘッドタグの内容の例は次のようになります。このファイルの中に登録した文字列を展開します。

これは、私の場合の例です。この例ではXHTMLで書いています。

<meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS" />
<meta http-equiv="Content-Style-Type" content="text/css" />
<meta http-equiv="Content-Script-Type" content="text/javascript" />
<meta property="og:title" content="<?php echo $title; ?>" />
<meta property="og:image" content="http://ドメイン/***/***.jpg" />
<meta property="fb:app_id" content="123456789012345" />
<meta property="fb:admins" content="123451234567890" />
<?php
if ($des_c != ""){echo "<meta name=\"description\" content=\"$des_c\" />\n";}
if ($key_w != ""){echo "<meta name=\"keywords\" content=\"$key_w\" />\n";}
?>
<title><?php echo $title; ?></title>
<link rel="shortcut icon" href="http://ドメイン/favicon.ico" />
<link rel="icon" href="http://ドメイン/favicon.ico" />
<link rel="alternate" href="http://feeds.ドメイン/****" type="application/rss+xml" title="RSS" />

$title は必ず存在しますが、 $des_c と $key_w は、内容が無い場合があるので、その場合はメタタグそのものを生成しないように条件判断させています。

PHPページで、ヘッドタグ内への外部ファイルの取込み方法

結局、PHPページで、文字列の登録とヘッドタグ内への外部ファイルの取込み(include)方法は次のようにします。

例としてヘッドタグの内容を記述したファイル名を　head1.inc　とします。拡張子は何でもかまいませんが、インクルードされるファイルなのでincの方が良いでしょう。

<?php $des_c = "ページの説明文"; ?>
<?php $key_w = "キーワード群"; ?>
<?php $title = "ページのタイトル"; ?>
<head>
<?php include($_SERVER['DOCUMENT_ROOT'].'/***/head1.inc'); ?>
<link rel="stylesheet" href="../com/style.css" type="text/css" media="all" />
<?php include($_SERVER['DOCUMENT_ROOT'].'/***/head2.inc'); ?>
</head>

このように、コードがとても簡単になりました。ヘッドタグの内容を記述したファイルは多くの種類が必要ないので、このファイルの管理が楽になります。書き間違いやホームページビルダーによる勝手な変更も無くなります。

スタイルシートはこのように相対アドレスで読み込みます。これは、ホームページビルダーやExpression Web3 などのソフトでスタイルシートを有効にする為です。

スタイルシートの後に、Javascriptなどの残りのヘッドタグ内のスクリプトを外部ファイルにしたものを読み込んでいます。

ヘッドタグの内容を外部ファイルにするディメリット

ヘッドタグの内容を外部ファイルにすると良いことばかりではありません。次のように悪いこともありますので注意してください。

その為、私はエディターでしか操作しない、修理技術情報掲示板の過去ログファイルの表示にだけ、この方法を使っていました。しかし、現在は全てのページでこの方法を採用しています。

その理由は、現在ウェブページの作成にはマイクロソフトのExpression Web3 というソフトを使っていますので、タイトルタグを勝手に書き換えられたりしないからです。