iPhone France Forum
Bienvenue sur iPhone France Forum !
Le Forum iPhone, iPhone 3G et iPod Touch d'Apple.

Rejoignez vous aussi une grande communauté de passionnés !
Enregistrez vous pour profiter des avantages membres.

iPhone France Forum

iPhone, iPhone 3G, iPhone 2, iPhone 3GS, iPhone 4, iPod Touch, iPad et iPad 2 d'Apple : Déblocage, Applications, Jeux, News, Test, Trucs et Astuces, Customisation, AppStore, SDK.
AccueilPortailS'enregistrerConnexion

[TUTO] Ajouter un WebClip personnalisé (Raccourci Web sur l'écran d'accueil)

Voir le sujet précédent Voir le sujet suivant Aller en bas
Auteur Message
crash.8
Modérateur
Modérateur


Points iPhone : 4239

Masculin
Nombre de messages : 2003
Age : 33
Localisation : Tarn
Emploi/Loisirs : Apprenti ingénieur informaticien
Humeur : Celle du jour :-)
Date d'inscription : 16/04/2008

MessageSujet: [TUTO] Ajouter un WebClip personnalisé (Raccourci Web sur l'écran d'accueil) Dim 28 Sep - 21:05

Comment faire un WebClip personnalisé


Il n' y a pas que les applications et les modules d'Apple que l'on peut mettre sur l'écran d'accueil, il y a aussi les WebClips depuis la version 1.1.3. Les WebClips sont tout bêtement des raccourcis de vos pages Webs. Par défaut Safari définie une image pour le WebClip, c'est l'image du site comme on le voit depuis le net :

exemple de WebClip par défaut

Mais certains sites possèdent directement leur propre icône pour les WebClips :

exemple de WebClip


Mais comme on veut toujours tout contrôler, et surtout ses icônes sur l'écran d'accueil, voici comment mettre sa propre icône pour le WebClip.

Il faut avoir :
  • un iPhone ou iPod Touch
  • un bloc note (sur l'ordinateur, pas du papier Very Happy )
  • Posséder un site dont on a les droits pour ajouter des pages Web et images


Dans notre exemple, nous allons faire un WebClip du forum iPhoneFrance. Le design des pages que l'on va faire sera des plus simple pour ne pas compliquer la procédure.

Etape 1 : Avoir une image

Vous avez plusieurs moyens pour avoir une image :
  • Vous êtes à l'aise avec Photoshop, alors amusez vous
  • Vous avez déjà l'image, ça c'est plus facile
  • Vous demandez à une autre personne

Je ne ferais pas de tuto pour faire une icône, je ne sais pas les faire. Mais je peux vous dire que la taille doit être de 60x60. Dans notre exemple, je vais prendre cette icône pour le forum :

icône pour le forum


Donnez lui le nom : iPhoneFrance.png

Etape 2 : Préparation de la page de redirection

Comme on ne peut pas modifier le site de iPhoneFrance, nous allons faire une page de redirection vers le forum, et c'est sur cette page que l'on va appliquer l'image pour le WebClip. Copier le code ci-dessous dans un bloc note, puis enregistrez le sous le nom : iPhoneFrance.html

<html>
<head>
<title>iPhoneFr</title>
<SCRIPT LANGUAGE=JAVASCRIPT TYPE="TEXT/JAVASCRIPT">
if(document.referrer == ''){
window.location="http://iphonefranceforum.com"
}
</SCRIPT>
<link rel="apple-touch-icon" href="iPhoneFrance.png"/>
</head>
<body>
</body>
</html>


L'expression en rouge correspondant au nom de l'image pour le WebClip, le lien en Bleu c'est le lien vers lequel on redirige, et en Vert, c'est le nom par défaut de notre WebClip.

Cette page à 2 états donc le comportement est différent :
  • 1. Si on lance cette page depuis une autre page, elle s'affiche mais lance pas la redirection.
  • 2. Si on lance directement cette page, elle redirige vers le lien indiqué.

L'état 1 permet de pouvoir entrer la page en WebClip, et l'état 2 permet de lancer la redirection vers le site souhaité.

Etape 3 : La page d'accueil

Comme indiqué à la fin de l'étape 2, on doit avoir une page qui lance la page de redirection pour pourvoir la mettre en WebClip. Voici cette page que vous enregistrez sous le nom WebClip.html :

<html>
<head>
<title>WebClip</title>
</head>
<body>
<a href="iPhoneFrance.html">iPhone France Forum</a><br>
</body>
</html>


La partie en rouge correspondant au nom de la page possédant l'image et la redirection pour un WebClip.

Etape 4 : Le mettre sur notre site

Cette partie est propre à votre hébergeur, vous devez avoir plusieurs moyens d'ajouter ces fichiers (FTP, direct site de l'hébergeur, ...). Si vous avez déjà un site, vous devez savoir comment les mettre.

Dans mon exemple, je vais mettre les 3 fichiers (iPhoneFrance.png, iPhoneFrance.html et WebClip.html) dans un répertoire : WebClip. Les 3 fichiers doivent être dans le même répertoire, sinon la façon dont on a mis les liens ne fonctionnera pas.

Exemple d'hébergement des fichiers


Etape 5 : Ajouter le WebClip sur l'écran d'accueil

Maintenant la dernière étape, lorsque l'on met des fichiers sur un site : celui-ci possède une adresse Web. Tapez cette adresse sur le Safari de votre iPhone ( Sur mon site, c'est http://crash.8.chez-alice.fr/WebClip/WebClip.html ) :


Cliquez sur le lien « Forum iPhone France ».
Puis appuyez sur le « + » et sur « Ajouter à l'écran d'accueil ».


Maintenant on doit donner le nom qui s'affichera sur la page d'accueil : On choisit « iPhoneFr ». Vous avez remarqué que notre icône est affiché, si c'est pas le cas : vérifiez le nom du ficher, son emplacement, et le nom marqué dans la page de redirection.


Voilà c'est fini, vous avez un WebClip personnalisé pour votre Forum favori. Cliquez dessus pour tester si le lien de redirection fonctionne.


Félicitation, vous pouvez maintenant faire vos propres WebClips personnalisés.
_________________

Revenir en haut Aller en bas
Voir le profil de l'utilisateur
Tristar
Administrateur
Administrateur


Points iPhone : 114261

Masculin
Nombre de messages : 3612
Age : 36
Localisation : France
Emploi/Loisirs : iPhone
Humeur : Stressé
Date d'inscription : 17/04/2008

MessageSujet: Re: [TUTO] Ajouter un WebClip personnalisé (Raccourci Web sur l'écran d'accueil) Lun 29 Sep - 0:38

Très beau TUTO crash, tout en technicité et simplicité en même temps !
on te reconnait bien la Wink
en tout cas c'est bien utile en effet.
_________________


Revenir en haut Aller en bas
Voir le profil de l'utilisateur http://iphone-france.keuf.net
niclaglisse
Modérateur
Modérateur


Points iPhone : 4766

Masculin
Nombre de messages : 1068
Age : 38
Localisation : Orange
Emploi/Loisirs : manager
Humeur : cool
Date d'inscription : 03/05/2008

MessageSujet: Re: [TUTO] Ajouter un WebClip personnalisé (Raccourci Web sur l'écran d'accueil) Lun 29 Sep - 7:54

Merci Crash!

Trés sympas ce Tuto, ça va en occuper plus d'un (dont moi)..Wink
_________________



PAS D'AIDE PAR MP !!
Revenir en haut Aller en bas
Voir le profil de l'utilisateur
crash.8
Modérateur
Modérateur


Points iPhone : 4239

Masculin
Nombre de messages : 2003
Age : 33
Localisation : Tarn
Emploi/Loisirs : Apprenti ingénieur informaticien
Humeur : Celle du jour :-)
Date d'inscription : 16/04/2008

MessageSujet: Re: [TUTO] Ajouter un WebClip personnalisé (Raccourci Web sur l'écran d'accueil) Lun 29 Sep - 20:13

niclaglisse a écrit:
Merci Crash!

Trés sympas ce Tuto, ça va en occuper plus d'un (dont moi)..Wink

Ah oui, tu as fais des icônes spécial pour d'autres sites ? Fait nous partager si tu veux.
_________________

Revenir en haut Aller en bas
Voir le profil de l'utilisateur
niclaglisse
Modérateur
Modérateur


Points iPhone : 4766

Masculin
Nombre de messages : 1068
Age : 38
Localisation : Orange
Emploi/Loisirs : manager
Humeur : cool
Date d'inscription : 03/05/2008

MessageSujet: Re: [TUTO] Ajouter un WebClip personnalisé (Raccourci Web sur l'écran d'accueil) Lun 29 Sep - 22:08

Dés que je récupére mon pc perso, je m'y mets! je vois déjà mon icone "OM" Rolling Eyes
_________________



PAS D'AIDE PAR MP !!
Revenir en haut Aller en bas
Voir le profil de l'utilisateur
toadjaune
iPod
iPod


Points iPhone : 1711

Nombre de messages : 1
Date d'inscription : 05/04/2012

MessageSujet: Re: [TUTO] Ajouter un WebClip personnalisé (Raccourci Web sur l'écran d'accueil) Jeu 5 Avr - 13:42

Bonjour à tous.

Je voudrais juste savoir quels sont les formats d'image supportés.
Merci d'avance !
Revenir en haut Aller en bas
Voir le profil de l'utilisateur
Contenu sponsorisé




MessageSujet: Re: [TUTO] Ajouter un WebClip personnalisé (Raccourci Web sur l'écran d'accueil) Aujourd'hui à 1:06

Revenir en haut Aller en bas

[TUTO] Ajouter un WebClip personnalisé (Raccourci Web sur l'écran d'accueil)

Voir le sujet précédent Voir le sujet suivant Revenir en haut
Page 1 sur 1

Permission de ce forum: Vous ne pouvez pas répondre aux sujets dans ce forum
iPhone France Forum :: Divers iPhone France Forum :: Trucs et Astuces iPhone France -
Copyright © 2009/2010 • iPhone France Forum • Tous droits réservés.
iPhone, et le logo Apple sont des marques du groupe Apple Inc.
Ce site n'est pas affilié à Apple Inc.


annuaire gratuit créer un site


  Créer un forum | © phpBB | Forum gratuit d'entraide | Contact | Signaler un abus | Forum gratuit