HTMLでスマホ専用サイトを作る方法
PHPやJavaScriptや.htaccessなど様々な方法で、スマホ専用サイトサイトに移動するように
することができる。
ただ、自分がオンラインで調べた中で一番簡単だったのがjavascriptだった。
そもそもPHPや.htaccessだと何故か機能しなかったりする・・・・・・。
逆に、javascriptだと、ブラウザでjavaをオフにしていると機能しないんだけども・・・・
どれも難しい。笑
一応やり方だけ、
まずトップのindex.htmlがあるフォルダと同じフォルダにuserAgent.jsというファイルを作成し以下のソースを貼り保存する
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
|
(function(){ varua = navigator.userAgent.toUpperCase(); varurl = document.location.pathname; varspDir = '/sp/'; (ua.indexOf('IPHONE') != -1 || (ua.indexOf('ANDROID') != -1 && ua.indexOf('MOBILE') != -1))? isSP() : isPC(); functionisSP(){ if(url.match(spDir)){ returnfalse; }else{ location.href = spDir; } } functionisPC(){ if(!url.match(spDir)){ returnfalse; }else{ location.href = '/'; } }}()); |
次にサイトに以下のように入力する(index.htmlに貼り付けるだけ)
|
1
2
3
4
5
6
7
8
9
10
|
<head><metahttp-equiv="Content-Type"content="text/html; charset=utf-8"/><title>スマホ専用サイトに移動する方法</title><scripttype="text/javascript"src="userAgent.js"></script></head><body></body></html> |
重要なのは
<script type="text/javascript" src="userAgent.js"></script>
という一文のみ！！！
最後に、index.htmlと同じ場所にspというフォルダを作る。
そして、spというフォルダの中にモバイル専用のサイトを作りindex.htmlで保存すればいいだけ
これで終わり。