Rasanya akan sangat menyenangkan untuk mengetahui perangkat mobile apa yang digunakan oleh visitor yang berkunjung ke website kita. Dengan begitu kita bisa meningkatkan performa dan dukungan pada perangkat mobile tersebut ataupun bisa dijadikan sebagai data statistik pengujung nantinya.
Untuk membuat supaya website kita mampu mengetahui tipe dari perangkat mobile yang dipakai, yang kita butuhkan adalah script sederhana. Dengan bantuan navigator.userAgent. Buatlah 2 fungsi yaitu fungsi detectMobileDevice() dan fungsi setCookie().Dalam contoh yang digunakan ini, ketika mendeteksi perangkat mobile yang digunakan, maka javascript akan mengarahkan Anda ke halaman tertentu. Anda bisa memodifikasinya sesuai dengan keinginan Anda nantinya.
function detectMobileDevice() {
var message = "This web site has an app for ";
var learn = "Click OK to learn more";
var iPadAppId = "";
var wp7AppId = "c52573e0-08c5-4e33-abfa-992021f0630f";
var androidAppId = "";
var iPhoneAppId = "";
var webOsId = "";
if (document.cookie.indexOf("mobile_app_notification=false") < 0) {
//This is not a mobile browser....
if (navigator.userAgent.match(/Opera/i)
|| navigator.userAgent.match(/Dolphin/i)) return;
if ((navigator.userAgent.match(/Windows Phone/i))
|| (navigator.userAgent.match(/ZuneWP7/i))) {
setCookie();
if (wp7AppId != "" && confirm(message + "Windows Phone! " + learn))
window.location = "zune://navigate/?phoneAppID=" + wp7AppId;
} else if (navigator.userAgent.match(/android/i)) {
setCookie();
if (androidAppId != "" && confirm(message + "Android phone! "
+ learn))
window.location = "market://details?id=" + androidAppId;
} else if (navigator.userAgent.match(/iPad/i)) {
setCookie();
if (iPadAppId != "" && confirm(message + "iPad! " + learn))
window.location = "http://itunes.apple.com/WebObjects/
MZStore.woa/wa/viewSoftware?id=" + iPadAppId;
} else if ((navigator.userAgent.match(/iPhone/i)) ||
(navigator.userAgent.match(/iPod/i))) {
setCookie();
if (iPhoneAppId != "" && confirm(message +
"iPhone and iPod Touch!" + learn))
window.location = "http://itunes.apple.com/WebObjects/
MZStore.woa/wa/viewSoftware?id=" + iPhoneAppId;
} else if (navigator.userAgent.match(/webOS/i)) {
setCookie();
if (webOsId != "" && confirm(message + "webOS phone! " + learn))
window.location = "http://developer.palm.com/appredirect/?
packageid=" + webOsId;
}
}
} |
Dalam contoh ini setCookie diatur selama 30 hari, jadi ketika visitor mengunjungi website Anda, tidak perlu mendeteksinya tiap kali kunjungan, tapi cukup per 30 hari saja kalau sudah pernah mengunjungi sebelumnya. Anda bisa mengubah setCookie ini sesuai keinginan Anda apakah per minggu atau per hari.
function setCookie() {
var date = new Date();
// 30 = 30 hari cookie akan terpasang
date.setTime(date.getTime() + (30 * 24 * 60 * 60 * 1000));
var expires = "; expires=" + date.toGMTString();
document.cookie = "mobile_app_notification=false" + expires;
} |
Nah, ketika Anda ingin menggunakan fungsi ini cukup gunakan perintah ini di javascript, maka akan mampu mendeteksi perangkat apa yang digunakan oleh visitor.
Related Posts:
0 Response to "Deteksi Perangkat Mobile Dengan Javascript Sederhana"
Posting Komentar