携帯サイトのDOCTYPE宣言、切り替え(PHPをSSIにて利用)

携帯サイトのDOCTYPE宣言についてで各キャリアごとにDOCTYPE宣言が異なるという記事を書きました。


ひとつのhtmlで携帯サイトを作り、
各キャリアからアクセスがあった場合、DOCTYPE宣言を切り替えるにはどうしたら良いか。


切り替えのPHPを紹介しますので、SSIは必須ですが利用してみてください。
XHTMLベースの紹介になります。(厳密に切り替える必要はないかもしれませんが。。。)


SSIをHTMLで読み出す場合、.htaccess等に
以下を追加し、PHPと同じディレクトリに置きます。


AddHandler server-parsed html
AddType application/xhtml+xml .html
AddType application/xhtml+xml .xhtm .xhtml


ユーザーエージェントの切り替え方法は、
携帯ホームページを作ろう! -ちょっと詳しいモバイルサイトの作り方-参考にしています。




■こちらをそのままコピーするか、
以下ファイルをダウンロードするかになります。

doctype.txt[右クリック・ダウンロード]
(拡張子をphpに変更してください。)


完全フリーです。著作権もありません。改変もどんどんやっちゃってください。

2008年11月11日ちょい変更。preg_matchにて分岐することにしました。

<?php
$agent=$_SERVER['HTTP_USER_AGENT'];
if(preg_match("/DoCoMo/", $agent)) {
print("<?xml version=\"1.0\" encoding=\"Shift_JIS\"?>\n");
print
("<!DOCTYPE html PUBLIC \"-//i-mode group (ja)//DTD XHTML i-XHTML(Locale/Ver.=ja/2.3) 1.0//EN\" \"i-xhtml_4ja_10.dtd\">\n");
print ("<html xmlns=\"http://www.w3.org/1999/xhtml\" lang=\"ja\" xml:lang=\"ja\">\n");
print ("<head>\n");
print ("<meta http-equiv=\"Content-Type\" content=\"application/xhtml+xml; charset=Shift_JIS\" />");
} elseif(preg_match("/KDDI/", $agent)||preg_match("/UP.Browser/", $agent)) {
print("<?xml version=\"1.0\" encoding=\"Shift_JIS\"?>\n");
print ("<!DOCTYPE html PUBLIC \"-//OPENWAVE//DTD XHTML 1.0//EN\" \"http://www.openwave.com/DTD/xhtml-basic.dtd\">\n");
print ("<html xmlns=\"http://www.w3.org/1999/xhtml\" lang=\"ja\" xml:lang=\"ja\">\n");
print ("<head>\n");
print ("<meta http-equiv=\"Content-Type\" content=\"text/html; charset=Shift_JIS\" />");
} elseif(preg_match("/J\-PHONE|Vodafone|MOT\-[CV]980|SoftBank/", $agent)) {
print("<?xml version=\"1.0\" encoding=\"Shift_JIS\"?>\n");
print ("<!DOCTYPE html PUBLIC \"-//J-PHONE//DTD XHTML Basic 1.0 Plus//EN\" \"xhtml-basic10-plus.dtd\">\n");
print ("<html xmlns=\"http://www.w3.org/1999/xhtml\" lang=\"ja\" xml:lang=\"ja\">\n");
print ("<head>\n");
print ("<meta http-equiv=\"Content-Type\" content=\"text/html; charset=Shift_JIS\" />");
} else {
print("<?xml version=\"1.0\" encoding=\"Shift_JIS\"?>\n");
print
("<!DOCTYPE html PUBLIC \"-//WAPFORUM//DTD XHTML Mobile 1.0//EN\" \"http://www.wapforum.org/DTD/xhtml-mobile10.dtd\">\n");
print ("<html xmlns=\"http://www.w3.org/1999/xhtml\" xml:lang=\"ja\">\n");
print ("<head>\n");
print ("<meta http-equiv=\"Content-Type\" content=\"text/html; charset=Shift_JIS\" />");
}
?>




■読み出しこちらをになります。任意のフォルダで良いと思います。
PHPの場所はトップディレクトリから相対パスで指定してください。

<!--#include virtual="/php/doctype.php"-->




■htmlソースはこんな感じでしょうか。

<!--#include virtual="/php/doctype.php"-->
<meta name="keywords" content="キーワード1,キーワード2" />
<meta name="description" content="サイトの紹介文" />
<title>サイトのタイトル</title>
</head>
<body>
本文
</body>
</html>




少しでもXHTMLベースの携帯サイトが増えることを祈っています。
CHTMLベースは捨てましょう。


絵文字変換、画像縮小変換、全角半角変換などとそれぞれに処理が必要になってくるので、
わたしは「Movable Type(MT)」と「ケータイキット for Movable Type」を利用することをおススメします。

※最近流行の特定の会社へリンクしているスパムではありません。
ケータイキット for Movable Typeは携帯サイトの構築においてコストの面、機能的にも必要最低限用意されていて、自由度が高くわかりやすいからです。

  • 携帯サイトのDOCTYPE宣言、切り替え(PHPをSSIにて利用)をはてなブックマークに追加 はてなブックマーク数
  • 携帯サイトのDOCTYPE宣言、切り替え(PHPをSSIにて利用)をdel.icio.usに追加
  • 携帯サイトのDOCTYPE宣言、切り替え(PHPをSSIにて利用)をYahoo!ブックマークに追加 Yahoo!ブックマーク数
  • 携帯サイトのDOCTYPE宣言、切り替え(PHPをSSIにて利用)をPOOKMARK Airlinesに追加
  • 携帯サイトのDOCTYPE宣言、切り替え(PHPをSSIにて利用)をlivedoorクリップに追加 livedoorクリップ ブックマーク数
  • 携帯サイトのDOCTYPE宣言、切り替え(PHPをSSIにて利用)を@niftyクリップに追加
  • 携帯サイトのDOCTYPE宣言、切り替え(PHPをSSIにて利用)をnewsingへ投稿
  • 携帯サイトのDOCTYPE宣言、切り替え(PHPをSSIにて利用)をbuzzurlに追加 buzzurl ブックマーク数
  • 携帯サイトのDOCTYPE宣言、切り替え(PHPをSSIにて利用)をChoixへ追加
  • 携帯サイトのDOCTYPE宣言、切り替え(PHPをSSIにて利用)をFurlへ追加
  • 携帯サイトのDOCTYPE宣言、切り替え(PHPをSSIにて利用)をBlinklistへ追加
  • 携帯サイトのDOCTYPE宣言、切り替え(PHPをSSIにて利用)をReddit.comへ追加

トラックバック(0)

このブログ記事を参照しているブログ一覧: 携帯サイトのDOCTYPE宣言、切り替え(PHPをSSIにて利用)

このブログ記事に対するトラックバックURL: http://takot.sakura.ne.jp/mt/mt-tb.cgi/871

コメント(2)

shibaです。
先日は書き込みありがとうございました!

記事読みました。当ブログへのリンクありがとうございます。
ちょうど僕もSSIとPHPで作ろうかなぁと思っていたので、
ナイスタイミング!便利なスクリプトですね。
参考にさせていただきます。

それでは!

shibaさん

コメント有難うございます。

[Think IT]の執筆お疲れ様でした。
非常に参考になる内容でした。

携帯サイトがもっと盛り上がるよう頑張って行きましょう。

shibaさんを応援してます。

コメントする

Insert Emoddy tag

このブログ記事について

このページは、Kamitani79が2008年10月26日 15:09に書いたブログ記事です。

ひとつ前のブログ記事は「携帯サイト制作-WEBデザインの新しいルールを購入。かなりおすすめ!」です。

次のブログ記事は「見切りの早い女 すぐにあきらめる男」です。

最近のコンテンツはインデックスページで見られます。過去に書かれたものはアーカイブのページで見られます。