Page légère pour smartphone
-
- Participation 6
- Messages : 1770
- Enregistré le : 13 mai 2007, 16:47
- Localisation : 29880 Plouguerneau
- Contact :
Page légère pour smartphone
Bonjour à tous.
A Noël dernier, je me suis offert mon 1er smartphone.
Et devinez quelle a été l'une des premières choses que j'ai faite ?
Créer une page très légère de mon site que vous pouvez voir ici.
Ainsi, quand je suis absent, je peux facilement vérifier si tout est OK.
Cette page intéresse peut-être quelques uns parmi vous.
Il vous suffit de copier le code source, de remplacer les date et mesures par les tags correspondants de Wswin et d'en faire un custom.
Le mienne est en php et je ne peux donc vous la donner "finie"...
Bizarrement, j'ai dû faire ma page deux fois plus grande (en largeur et hauteur) que l'écran du smartphone pour qu'elle occupe tout celui-ci.
En fonction de la taille de votre écran, vous pouvez facilement adapter les dimensions en modifiant la taille des div...
Si vous vouliez quelques détails, n'hésitez pas à poster.
A Noël dernier, je me suis offert mon 1er smartphone.
Et devinez quelle a été l'une des premières choses que j'ai faite ?
Créer une page très légère de mon site que vous pouvez voir ici.
Ainsi, quand je suis absent, je peux facilement vérifier si tout est OK.
Cette page intéresse peut-être quelques uns parmi vous.
Il vous suffit de copier le code source, de remplacer les date et mesures par les tags correspondants de Wswin et d'en faire un custom.
Le mienne est en php et je ne peux donc vous la donner "finie"...
Bizarrement, j'ai dû faire ma page deux fois plus grande (en largeur et hauteur) que l'écran du smartphone pour qu'elle occupe tout celui-ci.
En fonction de la taille de votre écran, vous pouvez facilement adapter les dimensions en modifiant la taille des div...
Si vous vouliez quelques détails, n'hésitez pas à poster.
- clement104
- participation 3
- Messages : 222
- Enregistré le : 30 juil. 2007, 13:22
- Localisation : Mélin, Belgique
- Contact :
Re: Page légère pour smartphone
Bonjour
Je sais c'est du déterrage de topic mais je me suis dit pourquoi ne pas en faire profiter les autres....
Maintenant que vous avez une version mobile, pourquoi ne pas proposer une redirection lorsque l'on navigue sur votre site avec un appareil mobile??
Voici un petit script
Ce script lit si le cookie choixversion est enregistré.
--Si oui, il dirige vers la version mobile ou normale
--Si non, il détecte la largeur de l'écran.
----Si >750px on va vers la version normale
----Si <750px on nous demande si on veut la version normale ou mobile
------Si on choisit OK: on est envoyé vers la version mobile et le cookie est enregistré sur mobile pour 1h
------Si on choisit Annuler: on est envoyé vers la version normale et la durée de vie du cookie est de 1h également.
A adapter selon vos besoins.
Je sais c'est du déterrage de topic mais je me suis dit pourquoi ne pas en faire profiter les autres....
Maintenant que vous avez une version mobile, pourquoi ne pas proposer une redirection lorsque l'on navigue sur votre site avec un appareil mobile??
Voici un petit script
Code : Tout sélectionner
<script type="text/javascript">
<!--
var dateExp = "Sat, 08-Jan-2095 08:00:00 GMT";
function createCookie(name,value,heure) {
if (heure) {
var date = new Date();
date.setTime(date.getTime()+(heure*60*60*1000));
var expires = "; expires="+date.toGMTString();
}
else var expires = "; expires="+dateExp;
document.cookie = name+"="+value+expires+"; path=/";
}
function readCookie(name) {
var nameEQ = name + "=";
var ca = document.cookie.split(';');
for(var i=0;i < ca.length;i++) {
var c = ca[i];
while (c.charAt(0)==' ') c = c.substring(1,c.length);
if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length);
}
return null;
}
function eraseCookie(name) {
createCookie(name,"",-1);
}
var osys="";
// osys="ipad";
var choixversion = readCookie('choixversionmeteomel');
// alert(choixversionmeteomel);
if (navigator.userAgent.toLowerCase().indexOf("ipad") != -1) { osys = "ipad" ; }
if (navigator.userAgent.toLowerCase().indexOf("iphone") != -1) { osys = "iphone" ; }
if (navigator.userAgent.toLowerCase().indexOf("android") != -1) { osys = "android" ; }
if (choixversion == 'mobile' ){ document.location="http://www.meteomelin.be/mobile/"; }
if (choixversion == 'normale' ){}
if ( screen.width < 750 && ( choixversion != 'normale' && choixversion != 'mobile') ) {
var choix = confirm("Nous avons détecté que vous naviguez avec un appareil mobile. Souhaitez-vous être dirigé vers la version mobile?");
if (choix) {
createCookie('choixversionmeteomel','mobile',1);
document.location="http://www.meteomelin.be/mobile/";
} else {
createCookie('choixversionmeteomel','normale',1);
document.location="http://www.meteomelin.be/";
}
}
// -->
</script>
--Si oui, il dirige vers la version mobile ou normale
--Si non, il détecte la largeur de l'écran.
----Si >750px on va vers la version normale
----Si <750px on nous demande si on veut la version normale ou mobile
------Si on choisit OK: on est envoyé vers la version mobile et le cookie est enregistré sur mobile pour 1h
------Si on choisit Annuler: on est envoyé vers la version normale et la durée de vie du cookie est de 1h également.
A adapter selon vos besoins.
-
- Participation 6
- Messages : 1770
- Enregistré le : 13 mai 2007, 16:47
- Localisation : 29880 Plouguerneau
- Contact :
Re: Page légère pour smartphone
Salut et merci pour ce script.
Je testerai à mon retour...
Je testerai à mon retour...
- webmaster
- Site Admin
- Messages : 2611
- Enregistré le : 12 déc. 2006, 20:54
- Localisation : Rieux 51 FRANCE
- Contact :
Re: Page légère pour smartphone
Bonsoir,
un petit test sur le navigateur du visiteur permet aussi de diriger sur la version mobile du site.
un petit test sur le navigateur du visiteur permet aussi de diriger sur la version mobile du site.
Code : Tout sélectionner
$ua = $_SERVER['HTTP_USER_AGENT'];
if(preg_match("(iPhone|iPod|iPad|BlackBerry|Android|HTC|LG|MOT|Nokia|Palm|SAMSUNG|SonyEricsson|Mobile)",$ua))
{
header("Status: 301 Moved Permanently", false, 301);
header("Location: /mobile ");
}
Cordialement
Rieux
Rieux
-
- Participation 6
- Messages : 1770
- Enregistré le : 13 mai 2007, 16:47
- Localisation : 29880 Plouguerneau
- Contact :
Re: Page légère pour smartphone
Ce message m'avait échappé !
Si LE visiteur (qui sans doute sera moi) est automatiquement redirigé vers la page mobile, il ne pourra plus consulter le site complet...
Si LE visiteur (qui sans doute sera moi) est automatiquement redirigé vers la page mobile, il ne pourra plus consulter le site complet...
- webmaster
- Site Admin
- Messages : 2611
- Enregistré le : 12 déc. 2006, 20:54
- Localisation : Rieux 51 FRANCE
- Contact :
Re: Page légère pour smartphone
Bonjour,
Si, car un bon navigateur permet de forcer la version ordinateur !
Si, car un bon navigateur permet de forcer la version ordinateur !
Cordialement
Rieux
Rieux
-
- Participation 6
- Messages : 1770
- Enregistré le : 13 mai 2007, 16:47
- Localisation : 29880 Plouguerneau
- Contact :
Re: Page légère pour smartphone
D'accord !
Et où "colle" t-on ce code ?
Dans la page index.php ?
Ma page pour smartphone étant http://meteo-plouguerneau.fr/vignette_mobile.php, je suppose que je remplace "Location: /mobile " par "Location: /vignette_mobile.php"
Edit : j'ai testé et ça marche mais je n'ai pas la possibilité comme toi d'afficher le site PC...
Et où "colle" t-on ce code ?
Dans la page index.php ?
Ma page pour smartphone étant http://meteo-plouguerneau.fr/vignette_mobile.php, je suppose que je remplace "Location: /mobile " par "Location: /vignette_mobile.php"
Edit : j'ai testé et ça marche mais je n'ai pas la possibilité comme toi d'afficher le site PC...
- webmaster
- Site Admin
- Messages : 2611
- Enregistré le : 12 déc. 2006, 20:54
- Localisation : Rieux 51 FRANCE
- Contact :
Re: Page légère pour smartphone
Il faut placer ce code entre des balises PHP dans le head.
Le plus simple est de composer un head unique à l'ensemble de tes pages, et de l’insérer en PHP.
le / dans un chemin de fichier indique de remonter à la racine du site. Pour mon cas /mobile, envoie à la racine dans le répertoire mobile sans indication de fichier, c'est donc une page index qui est ouverte.
Donc pour ton lien, s'il est à la racine de ton site, c'est bon.
Le plus simple est de composer un head unique à l'ensemble de tes pages, et de l’insérer en PHP.
le / dans un chemin de fichier indique de remonter à la racine du site. Pour mon cas /mobile, envoie à la racine dans le répertoire mobile sans indication de fichier, c'est donc une page index qui est ouverte.
Donc pour ton lien, s'il est à la racine de ton site, c'est bon.
Cordialement
Rieux
Rieux
-
- Participation 6
- Messages : 1770
- Enregistré le : 13 mai 2007, 16:47
- Localisation : 29880 Plouguerneau
- Contact :
Re: Page légère pour smartphone
C'est ce que j'ai fait mais mon navigateur ne permet pas d'ouvrir le site PC !webmaster a écrit :Le plus simple est de composer un head unique à l'ensemble de tes pages, et de l’insérer en PHP.
Tant pis...
- Podavini
- Participation 0
- Messages : 3
- Enregistré le : 25 août 2008, 20:51
- Localisation : Saint Bonnet de bellac
- Contact :
Re: Page légère pour smartphone
Bonjour,
Je suis en train de créer une page légère pour mon smartphone et je bloque au niveau de l'icone météo.
Je n'y arrive pas malgrés des beaucoup essais.
un petit peu d'aide.
Ci joint l'url du lien : http://guydo.power-heberg.com/www/html/ ... stom7.html
Merci
Guy
Je suis en train de créer une page légère pour mon smartphone et je bloque au niveau de l'icone météo.
Je n'y arrive pas malgrés des beaucoup essais.
un petit peu d'aide.
Ci joint l'url du lien : http://guydo.power-heberg.com/www/html/ ... stom7.html
Merci
Guy
- webmaster
- Site Admin
- Messages : 2611
- Enregistré le : 12 déc. 2006, 20:54
- Localisation : Rieux 51 FRANCE
- Contact :
Re: Page légère pour smartphone
Bonjour,
De quelle icône parles-tu et où veux-tu la mettre ?
De quelle icône parles-tu et où veux-tu la mettre ?
Cordialement
Rieux
Rieux
-
- Participation 6
- Messages : 1770
- Enregistré le : 13 mai 2007, 16:47
- Localisation : 29880 Plouguerneau
- Contact :
Re: Page légère pour smartphone
Bonjour,
J'imagine qu'il s'agit de l'icône du "temps présent"...
Il s'agit d'un script php, réalisé avec l'aide de Ludovic.
Il faut bien sûr une sonde de radiation solaire, un pluvio avec une résolution de 0.2mm, et un pas de mesure de 1 minute.
Avec une VantagePro, pas de problème.
Quel est ton matériel ?
J'imagine qu'il s'agit de l'icône du "temps présent"...
Il s'agit d'un script php, réalisé avec l'aide de Ludovic.
Il faut bien sûr une sonde de radiation solaire, un pluvio avec une résolution de 0.2mm, et un pas de mesure de 1 minute.
Avec une VantagePro, pas de problème.
Quel est ton matériel ?