ただふれたものについて書くブログ

あんまり正しくない話を適当に書くブログ

手っ取り早くスマートフォン対応をしたい場合

CakePHPですでにPC版などが存在していて、手っ取り早くスマートフォンサイトを作りたい場合、テーマ機能 + jQuery Mobile を使うと簡単です。

CakePHPにはテーマという機能があります。

参考: CakePHP Viewファイルのテーマ化 | WIDGET-INFO

やり方

たとえば、Controller::beforeFilter() などでユーザーエージェントを判定してController::$themeを設定します。

[app_controller.php]

<?php
class AppController extends Controller {
  public $view = 'Theme';

  public function beforeFilter() {
    $useragents = array(
      'iPhone', // Apple iPhone
      'iPod',   // Apple iPod touch
      'Android' // Android
    ); 
    $pattern = '/'.implode('|', $useragents).'/i';
    if ( preg_match($pattern, $_SERVER['HTTP_USER_AGENT']) ) {
      $this->theme = 'smartphone';  // view/themed/smartphone 以下のviewファイルを使うようになる
    }  
  }
}

(ユーザーエージェントの判定はざっくりです)

あとは、view/themed/smartphone 以下にlayoutsファイルと viewsファイルを作っていくだけです。

view/themed/smartphone に存在しない場合は自動的にいつも通りの viewsファイルを使うので、一部のページだけスマートフォンページ対応する場合も簡単です。

jQuery Mobile

jQuery Mobile自体の詳細は省きますが、jQuery Mobileでデフォルトのajaxの遷移をtrueにしておくと、CakePHP側で、RequestComponentsを使っていると、layoutsファイルが ajax.ctp を使ったりして、混乱する場合があります。手っ取り早く済ますにはajaxの遷移はfalseにしたほうが楽だと思います。

$.mobile.ajaxEnabled = false;