Quoi de plus distrayant pour un webdesigner… que de designer ! C’est l’été, on a un peu moins de pression… ou on a envie de se changer les idées. Alors pour faire travailler notre inspiration, quoi de plus rapide et sympa que de s’amuser à faire des thèmes iGoogle ?
C’est donc ce que j’ai décidé de faire à mes heures perdues :
Thème iGoogle Spring Touch
Thème iGoogle Along the Pond
Un de ces thèmes vous plait ? Pour l’ajouter sur votre iGoogle, allez dans la rubrique [changer de thème], puis s’il n’apparait plus dans les thèmes récents, cliquez sur le lien [plus d'options] et entrez son nom dans le champ de recherche situé à droite.
Les thèmes iGoogle peuvent se personnaliser depuis un moment déjà , il n’y a rien de compliqué, quelques images et un fichier xml tout simple à créer et le tour est joué ! (Il faut bien sûr avoir configuré son accueil iGoogle pour pouvoir tester son nouveau thème ensuite)
Pour une vue d’ensemble sur la création d’un thème iGoogle, faites un tour sur la page :
http://code.google.com/intl/fr/apis/themes/docs/dev_guide.html
Récapitulons, pour créer un thème iGoogle, voici 2 possibilités :
1 La méthode Google :
- Télécharger le zip contenant les 2 fichiers template (.psd et .xml) disponible sur la page iGoogle Themes API : http://code.google.com/intl/fr/apis/themes/index.html
- Effectuez votre design à partir du fichier .psd
- Modifiez les attributs du fichier xml suivant votre design
2 La méthode igThemer :
Voilà un outil super pratique pour ceux qui ne veulent pas mettre les mains dans le code.
- Rendez-vous sur le site de Hawidu et notamment sur la fameuse page de l’outil igThemer et là , laissez-vous guider.
- Le design de votre thème iGoogle étant prêt, vous n’avez plus qu’à sélectionner les attributs correspondants ! (attention à ne pas faire de [Enter] dans les champs, cela vous validerait vos sélections et vous arriveriez sur la page suivante, sans tous vos styles enregistrés)
- En bas de page, cliquez sur le bouton « make» , vous accédez à une page vous proposant 2 choix : Afficher le fichier xml (Theme URL) et/ou Visualiser le thème dans iGoogle (View Theme in iGoogle)
- Sélectionner « Afficher le fichier xml» et enregistrez-le au même niveau que les images de votre thème.
Préparez vos fichiers pour Google et testez votre thème
- Uploadez votre dossier contenant le fichier xml et les images sur votre serveur
- Connectez-vous à votre iGoogle et ajoutez ?skin=[URL du thème] après http://www.google.fr/ig
Exemple :
http://www.google.fr/ig?skin=http://www.letstudio.fr/igoogle/springtouch/springtouch.xml
Votre thème est créé et tout est prêt
Une fois votre thème complet créé, il ne vous reste plus qu’à soumettre ce dernier à iGoogle Themes Directory, rendez-vous sur :
la page Submit a Theme
Généralement il faut environ 48 à 72h à Google pour vérifier que votre thème est complet et correspond au programme légal de iGoogle :
Program Policy de Google
Et si vous avez une modification à faire, il suffit de soumettre à nouveau votre thème avec la même url, par contre il paraît que le délai est alors de 2 à 3 semaines.
Tags : design, google, thèmes igoogle
Suite à une erreur technique les 2 commentaires de ce post ont disparu.
Un visiteur nous informait que Stylish pouvait aussi faire l’affaire.
Stylish est un add-on de Firefox (ou des navigateurs basés sur le même moteur). Il n’est en rien comparable à igThemer qui lui est utilisable en ligne, mais il peut être intéressant de le découvrir.
J’adore vos googlicots ! Ils égayent mon bureau windows pendant mes dures journées de labeur.
Merci beaucoup.
Bonjour, j’aurai besoin d’un coup de pouce pour l’upload de mon fichier xml vers le serveur. En fait je n’ai pas bien comprit sur quel serveur il faut aller. Pouvez vous m’aider ? merci d’avance
Bonjour j’ai suivi ton tuto.
Lorsque que je met : http://www.google.com/ig?skin= suivi du lien de mon xml que j’ai hebergé sur internet, cela ne s’affiche pas.
Il reste sur le Igogole classique.
Pourrait tu m’aider?
Bonjour Datchad,
Désolée de ne pas vous avoir répondu avant, j’étais en congé maternité.
Quel est exactement votre souci ?
Bonjour Dimitri,
J’ai également testé l’url http://www.google.com/ig?skin= suivie du lien de mon xml, et j’obtiens le même résultat que toi : cela ne s’affiche pas.
J’ai relu le guide du développeur de google disponible à l’adresse « http://code.google.com/intl/fr-FR/apis/themes/docs/dev_guide.html» et j’y trouve les mêmes indications que celles notées dans mon article.
Je n’ai donc pas à l’heure actuelle la réponse à ton problème. Je te tiendrais au courant si j’ai une piste. Si tu trouves entre temps, je serais curieuse de connaître quel était le problème.
A bientôt.
Dimitri,
J’ai testé l’url avec un autre fichier xml, les images ont bien été affichées.
Tu dois avoir une erreur de code (tes liens) dans ton fichier xml.