読者です 読者をやめる 読者になる 読者になる

N-takデザインブログ

WEBで培った作品や技術を公開しています。

ユーザーエージェントで自動で画面が遷移するjavascriptはこれでやったら超簡単!

ついに、スマホ版のアップまでこぎつけました。

まだプレオープンですけど、今後をお楽しみに☆

f:id:r4m0khksticiibypvp4k:20131011170814p:plain

 

 

で、そこでPCサイトに来ていただいてからスマートフォンサイトへ

クリックしてから移動していただくのも煩わしいかなってことで

自動で判別して移動してもらえる方法がないかと探したところ、

まぁたくさんあること。

 

検討した結果、phpなどでもよいのですが、導入にあたっては

javascriptのほうが初心者には良いかなと考えメモしておきます。

 

手順1

以下のをコピペでPCサイトのトップページのhead内に貼り付けてください。

 

if ((navigator.userAgent.indexOf('iPhone') > 0 && navigator.userAgent.indexOf('iPad') == -1) || navigator.userAgent.indexOf('iPod') > 0 || navigator.userAgent.indexOf('Android') > 0) {

 

    location.href = '/sp/';

 

}

 この場合、

iPhone,iPad,iPod,Androidだった場合は、今のアドレスに/sp/を加えなさい”

という構文になります。

 

手順2

ですので、今のlocationの下にspの名前のフォルダを設けそこにスマフォ用のindexを準備すればOK!!

 

フォルダの名前を変えるときは、location.href・・・のところの記述を修正すれば応用も出来ますね。

 

参考にしたサイトは下記のとおりです。

 

PC・スマホ・携帯からのアクセス毎にURLを自動的に変更する方法

 

ユーザーエージェントによってPCとスマートフォン(iPhone / Android)を振り分ける方法いろいろ(PHP / JavaScript / .htaccess等)

 

 

 以上です。

ご意見・ご感想お待ちしてます。