2012年01月30日

cakephp スマートフォンサイト振り分け

お願いします♪いいねとかつぶやいたりして下さい
 
2012/10/11 追記

例えば mypage だけは pc , sphone 共通で使いたいとき、
そのページにはPCサイトへは必要無い。
そういう場合は

<script>
//pcのみのviewを指定。 mypage が url にあれば、スマートフォンへボタンを出さない
			function is_pcOnly () {  
			  var media = [  
				'mypage'
				];  
			  var pattern = new RegExp(media.join('|'), 'i');
			  return pattern.test(location.pathname);  
			}
			
			  
			if (is_smartPhone() && !is_pcOnly()) {  
				$(document.body).prepend('<div align="center" class="change"><a href="/defaults/change/" class="btn btn-primary btn-large" style="padding:50px;font-size:50px;margin:15px;">スマートフォン版に切替</a></div>')  
			}
</script>


ってな感じでやると良い。
上記でURLにmypageが無い場合のみ、PCサイトへ移動ボタンを出す。



スマートフォンサイトを作った場合、
PCサイトも見れるようにしたい場合がある。

cakephp 1.3
そのときの方法。

流れとしては
・スマートフォン用に切り替えリンクをつける
・切り替えリンクが押されたらクッキーにその旨保存。
・切り替えクッキーがonの場合はスマートフォンでもPCサイトを表示。
・スマートフォンからPCサイトを見ている場合はいつでもスマートフォンサイトに戻れるように
javascriptで判断。そして、その旨リンクを貼り付け。


ktailibraly必須。

・app_controller.php
function beforeFilter()
{	
    if($this->Ktai->is_iphone() || $this->Ktai->is_android()){  
        if($this->Cookie->read('view') != 'pc'){
            $this->view = "Theme";
            $this->theme = "s";
        }  
}

function beforeRender()
{  
    if($this->Ktai->is_iphone() || $this->Ktai->is_android()){  
         if($this->Cookie->read('view') != 'pc'){
            $this->view = "Theme";
            $this->theme = "s";
        }
    }
} 


・PC用サイトのヘッダ jquery を添えて
<script type="text/javascript">

$(function(){

	
	function is_smartPhone () {
	  var media = [
		'iPhone',
		'iPad',
		'Android'
		/*その他、blackberry,windowsPhoneなど必要なものがあれば追加する*/
		/*Androidは'Android'という文字列だけで全てのAndroid端末を判別出来ないので注意*/
		];
	  var pattern = new RegExp(media.join('|'), 'i');
	  return pattern.test(navigator.userAgent);
	}
	
	if (is_smartPhone()) {
		$(document.body).prepend('<h1 style="height:50px;text-align:center;padding-top:15px;"><a href="/defaults/change/">スマートフォン用サイトへ</a></h1>');
/*
//twitterbootstrapの時は以下で。
$(document.body).prepend('<div align="center" class="change"><a href="/defaults/change/" class="btn btn-primary btn-large" style="padding:50px;font-size:50px;margin:15px;">スマートフォン版に切替</a></div>')  
*/
	}
	
});
</script>


・defaults_controller.php
function change()
{
    $res = $this->Cookie->read('view');
    if($res){
        $this->Cookie->delete('view');	
    } else {
        $this->Cookie->write('view','pc');
    }
    
    $this->redirect('/');
    
    $this->autoRender = false;
}


・スマートフォン用PC切り替えリンク
<div align="center">
        <a href="/defaults/change/">PCサイトへ</a>
        <br>
</div>



こんなかんじ。
関連するタグ: PHP cakephp
あなたにとって有用な記事でしたか?是非ブックマークしておくことをおすすめします。
 




ライブラリを配布しちゃったり
webデザイン
Fireworks
HTMLコーディング
CSS
Dreamweaver
携帯サイト
webプログラム
PHP
正規表現
cakephp
MYSQL
javascript
webマーケティング
adwords
analytics
windows7
ショートカットキー
おすすめ情報
サイト
facebook
ライブラリ
配布
アプリ
iphone
ipad
サーバー
さくらサーバー
全ての記事を読む




トップ - 最新の記事一覧 - お問い合わせ