こんにちは、ひろゆきです。
今日は、PC・スマホでテーマを切り替える際にCodeIgniterで行ったことを、メモがてら残します。今回初めてCodeIgniterを使ったのですが、ビックリするくらいあっさりできてしまいました。
1. ユーザーエージェントの定義
デフォルトで用意されている「application/config/user_agents.php」の$mobilesに、スマホサイトとして表示させたいユーザーエージェント名を配列のキーに記述します。
ざっくりとした例ですが、以下のような形式です。
$mobiles = array(
'iphone' => "Apple iPhone",
'ipad' => "iPad",
'ipod' => "Apple iPod Touch",
'mobile' => "Generic Mobile",
'smartphone' => "Generic Mobile",
);2. 使用テーマ判定用の共通関数作成
次に、テーマの切り替え判定を行う関数を「core/MY_Controller.php」に作成します。
/**
* テーマ切り替え用関数
*
* @param string サブフォルダ/ビューファイル名
* @return string テーマディレクトリ
*/
public function get_theme($view) {
$this->load->library('user_agent');
// スマホ判定
if ($this->agent->is_mobile()) {
return 'sp/' . $view;
}
return 'pc/' . $view;
}3. コントローラーでビュー読み込み
次に、使用するコントローラ内で「2」で作成した関数と合わせて、以下のようにビューを読み込む。
$data = array(); // ビューに渡したい要素を詰め込む
・
・
・
$this->load->view($this->get_theme('article/detail'), $data);4. テーマ別にビューファイル作成
「3」の例でいくと、viewsディレクトリの下に「pc」と「sp」ディレクトリを作成したあと、それぞれに「article」ディレクトリを作成し、「detail.php」をビューファイルとして設置します。
サンプルとして動かすなら、以下のような感じでしょうか。
PC版：views/pc/article/detail.php
<html>
<head></head>
<body>
PC版を表示しています。
</body>
</html>SP版：views/sp/article/detail.php
<html>
<head></head>
<body>
SP版を表示しています。
</body>
</html>あとはPC・スマホの各ブラウザからそれぞれアクセスしてみると、それぞれのテーマが表示されるかと思います。
さいごに
いかがでしたでしょうか？
僕は普段WordPressばかり触っていたので、こういったことをあらためて実装してみると凄く新鮮な気分になれました。
それでは、また。
【最強PHPerになる！】
※ CakePHPの「Tree」Behaviorをカスタマイズして実装する方法
※ phpenv + php-buildでPHPを複数バージョン利用する方法
※ PHPer必見！最強PHPerになれると噂の「新言語Hack」を試してみよう！
※ CakePHPでBitbucketのAPIを利用する方法
※ PHPでjQueryチックにWebサイトをクローリングする方法
LIGはWebサイト制作を支援しています。ご興味のある方は事業ぺージをぜひご覧ください。
