Tutoriel pour la création d'un site web avec Google Sites
Upcoming SlideShare
Loading in...5
×
 

Like this? Share it with your network

Share

Tutoriel pour la création d'un site web avec Google Sites

on

  • 58,428 views

Créer un site web gratuitement avec Google Sites ...

Créer un site web gratuitement avec Google Sites

Tutoriels Google Sites, pour créer gratuitement un site Google, trucs et astuces, best practice et info technique pour Google Sites, Gmail, Google Agenda, YouTube, Picasa, Google Maps, Google Reader, Google Groups, Google Document...

Statistics

Views

Total Views
58,428
Views on SlideShare
55,417
Embed Views
3,011

Actions

Likes
13
Downloads
1,547
Comments
4

22 Embeds 3,011

http://www.scoop.it 1573
http://mj89sp3sau2k7lj1eg3k40hkeppguj6j-a-sites-opensocial.googleusercontent.com 1042
http://webculturecommunication.wordpress.com 174
http://www.cloud-buzz.com 64
http://technoconseil.fr 56
http://www.slideshare.net 22
http://www.pearltrees.com 19
https://tal2tot4uenli8d3lphbjvrrl237cfes-a-sites-opensocial.googleusercontent.com 14
http://127.0.0.1 10
http://ent.uvt.rnu.tn 8
https://mj89sp3sau2k7lj1eg3k40hkeppguj6j-a-sites-opensocial.googleusercontent.com 8
http://www.linkedin.com 7
http://www.entreprise-marketing.fr 3
http://familypm.free.fr 2
http://cgt.securitas.so.free.fr 2
url_unknown 1
http://127.0.0.1:5126 1
http://www.viadeo.com 1
http://huscftc.tumblr.com 1
http://www.freesafeip.com 1
http://www.alertize.com 1
http://translate.googleusercontent.com 1
More...

Accessibility

Categories

Upload Details

Uploaded via as Adobe PDF

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
  • Bonjour,

    Pour info, j'ai regroupé mes tuto pour débuter sur Google site sur :
    https://sites.google.com/site/flyerenligne/

    Si ça peut aider ;o)
    C'est un bon complément à cette page très bien faite de TechnoConseil

    Marc
    Are you sure you want to
    Your message goes here
    Processing…
  • @sfpierre

    On peut insérer un code google analytics dans la partie gestion du site
    Are you sure you want to
    Your message goes here
    Processing…
  • Bonjour, j'aimerai savoir comment on peut mesurer l'audience du site ? Je ne trouve l'info nulle part. N'ayant accès aux fichiers qui composent le site, on ne peut entrer un code google analytics, alors comment faire ? Merci !
    Are you sure you want to
    Your message goes here
    Processing…
  • Très bien, mais j'aimerai l'acheter pour mes cours sur Google
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

Tutoriel pour la création d'un site web avec Google Sites Document Transcript

  • 1. Tutoriel pour la création dun Google Sites Créer un site web gratuitement avec Google Sites Le site des tutoriels Google Sites, pour créer gratuitement un site Google, trucs et astuces, best practice et info technique pour GoogleSites, Gmail, Google Agenda, YouTube, Picasa, Google Maps, Google Reader, Google Groups, Google Document... Rejoignez-nous sur Facebook Rejoignez http://www.facebook.com/home.php?sk=group_229378610412541 TECHNOCONSEIL | www.technoconseil.fr | contac@technoconseil.f contac@technoconseil.fr
  • 2. Tutoriel pour la création dun Google SitesSommaireTutoriel pour la création dun Google Sites............................................................................................. 3Création du compte Gmail ...................................................................................................................... 5Création du site ....................................................................................................................................... 9Paramètres du site ................................................................................................................................ 12Mise en page du site (1) ........................................................................................................................ 14Couleurs et Polices ................................................................................................................................ 15Configurer le moteur de recherche ....................................................................................................... 17Mise en page du site (2) ........................................................................................................................ 19Modifier la page daccueil ..................................................................................................................... 20Modifier les paramètres de la page daccueil ....................................................................................... 24Créer les pages (annuaire, chiffres clés, historique ...) ......................................................................... 26Modifier la barre latérale (1) ................................................................................................................. 29Insérer une liste des sous-pages ........................................................................................................... 32Créer les pages (Les Clients, Les hommes, Actualités) .......................................................................... 35Modifier la barre latérale (2) ................................................................................................................. 37Modifier le modèle de page (Actualités) ............................................................................................... 40Utiliser la fonction mini blog dannonces .............................................................................................. 41Ajouter une Google Maps à la page Annuaire ...................................................................................... 44Ajouter un graphique dynamique ......................................................................................................... 47Ajouter une présentation Google.......................................................................................................... 52Ajouter un diaporama Picasa ................................................................................................................ 55Ajouter une vidéo YouTube ................................................................................................................... 59Modifier le modèle de page (Les Hommes) .......................................................................................... 64Utiliser la fonction Classeur ................................................................................................................... 66Créer une FAQ avec Google Groups ...................................................................................................... 68Créer un blog et afficher les messages sur le site ................................................................................. 75Se connecter sur son site....................................................................................................................... 80Gestion des images................................................................................................................................ 82TechnoConseil www.technoconseil.fr 2
  • 3. Tutoriel pour la création dun Google SitesTutoriel pour la création dun Google SitesPré-requis pour réaliser les exercices de ce tutoriel : Posséder un compte Google, Avoir activé le service Google Sites, Être connecté (authentifié) sur votre Google Sites pour effectuer les exercices.Lorsque que vous créez un compte Google*, plus connu sous le nom de compte Gmail, vous disposezdune palette doutils tels que : Gmail Google Agenda Google Document Google Talk Google Sites (...)Dans ce tutoriel nous vous montrons comment réaliser un site Google Sites** avec votre compteGmail. En suivant ce tutoriel pas à pas vous pourrez réaliser un site similaire à celui de notre exemple: http://sites.google.com/site/monsiteperso99/Voici les services dont vous disposez (au 30/12/2009) lorsque vous créez un compte Gmail :* Il est possible de créer un compte Google avec votre adresse personnelle (ex :prenom.nom@mondomaine.com) mais dans ce cas vous ne disposerez pas de tous les servicesproposés par Google.TechnoConseil www.technoconseil.fr 3
  • 4. Tutoriel pour la création dun Google SitesVoici les services dont vous disposez lorsque que vous créez un compte Google avec une adresseemail qui ne se termine pas par @gmail.com :** Google Sites fait aussi parti des services dentreprises Google Apps, voir les exemplessur www.perseide.fr.TechnoConseil www.technoconseil.fr 4
  • 5. Tutoriel pour la création dun Google SitesCréation du compte GmailLa 1ère étape de ce tutoriel consiste à lancer une recherche dans Google pour trouver leservice Gmail...Une fois le résultat de la recherche affiché, vous pouvez sélectionner le lien vers le service Gmail...TechnoConseil www.technoconseil.fr 5
  • 6. Tutoriel pour la création dun Google SitesChoisissez loption Créer un compte...Remplissez le formulaire dinscription et continuez...TechnoConseil www.technoconseil.fr 6
  • 7. Tutoriel pour la création dun Google SitesÉtape 2 de linscription...Une fois que vous avez reçu le code dinscription via SMS, saisissez le dans le formulaire dinscriptionet validez...TechnoConseil www.technoconseil.fr 7
  • 8. Tutoriel pour la création dun Google SitesVotre compte Gmail est créé ;o) Vous pouvez maintenant accéder à votre compte et aux différentsservices Google.TechnoConseil www.technoconseil.fr 8
  • 9. Tutoriel pour la création dun Google SitesCréation du siteLorsque vous ouvrez votre page daccueil Gmail, différents menus sont affichés en haut de la page àdroite, il sagit des services Google auxquels vous avez accès. Les menus plus et encore plus vouspermettent dafficher lensemble des services disponibles. Choisissez le menu Sites, si vous avezplusieurs compte Gmail, Google vous demandera de choisir le compte que vous souhaitez utiliser,choisissez le compte approprié et continuez.Si vous vous connectez pour la 1ère fois à Google Sites, Google vous demandera surement de vousidentifier, saisissez vos informations et continuez...TechnoConseil www.technoconseil.fr 9
  • 10. Tutoriel pour la création dun Google SitesVous êtes maintenant connecté au service Google Sites (lURL affichée nestplus mail.google.com mais sites.google.com). Vous pouvez revenir sur le service Gmail quand vous lesouhaitez en cliquant sur le menu Gmail en haut à droite de la page. Pour créer votre site cliquez surle bouton Créer un site...Pour commencer et mieux comprendre Google Sites choisissez un Modèle vierge, renseignez le Nomde votre site (mon site perso... pour notre exemple), lorsque vous saisirez le nom de votresite Ladresse de votre site sera créée automatiquement donc ne vous ne vous occupez pas decette information. Choisissez un modèle de site Simple...TechnoConseil www.technoconseil.fr 10
  • 11. Tutoriel pour la création dun Google SitesPour un site Public choisissez loption Tout le monde peut consulter ce site, renseignez le captcha etcliquez sur le bouton Créer un site... Votre site est maintenant créé.TechnoConseil www.technoconseil.fr 11
  • 12. Tutoriel pour la création dun Google SitesParamètres du siteMaintenant que le site est créé, vous allez pouvoir le customiser à votre guise, par exemple si vous nesouhaitez pas afficher le titre de votre site (mon site perso avec gmail dans notre exemple)mais plutôt une image et/ou un logo voici les étapes à suivre... Cliquez sur le menu Plus dactions enhaut à droite de la page Google Sites et sélectionnez le sous-menu Gérer le site...Un fois sur la page de gestion (administration) de votre site, cliquez sur le menu Général...Désactiver loption Afficher le nom du site en haut des pages. Vous devez garder un Nom de sitepour pouvoir lidentifier dans votre liste de sites (lorsque vous en aurez plusieurs cette informationTechnoConseil www.technoconseil.fr 12
  • 13. Tutoriel pour la création dun Google Sitessera indispensable) et pour améliorer lindexation dans les moteurs de recherche (Google, Yahoo etMSN)Enregistrez les modifications avant de sortir de la page et de Revenir au site.TechnoConseil www.technoconseil.fr 13
  • 14. Tutoriel pour la création dun Google SitesMise en page du site (1)Vous allez fixer la largeur de votre site à 955 pixels pour quil soit toujours affiché de la même manièrequel que soit le type décran utilisé. Vous éviterez ainsi que votre site soit complètement "cassé" surun écran haute résolution. Cliquez sur les menus Mise en page du site et Modifier la mise en pagedu sitede linterface de gestion (administration) du site. Renseignez les valeurs suivantes Largeur dusite 955px, Hauteur de len-tête 160 pixels (limage de notre exemple fait 159 pixels de hauteur),laisser la valeur par défaut de la Barre latérale à 150 pixels, cliquez sur OK...Enregistrer les modifications avant de Revenir au site.TechnoConseil www.technoconseil.fr 14
  • 15. Tutoriel pour la création dun Google SitesCouleurs et PolicesUne fois la largeur de votre site ajustée, vous allez importer limage den-tête de votre site (dans notreexemple limage fait 955 pixels de largeur et 159 pixels de hauteur). Cliquez sur le menu Couleurs etpolices, dans le menu déroulant choisissez loption En-tête de site > image darrière plan des en-têtes de sites... Cliquez sur le bouton Choisissez un fichier pour ouvrir la boite de dialogue etchoisir limage se trouvant sur votre ordinateur...Une fois limage choisie, sélectionnez les options suivantes : Juxtaposition Aucun, Positionhorizontale Au centre, Position verticale Haut...TechnoConseil www.technoconseil.fr 15
  • 16. Tutoriel pour la création dun Google SitesEnregistrez les modifications avant de Revenir au site.Votre image est maintenant affichée en en-tête de votre site.TechnoConseil www.technoconseil.fr 16
  • 17. Tutoriel pour la création dun Google SitesConfigurer le moteur de rechercheUne fonction de Google Sites permet de modifier les paramètres du moteur de recherche intégré, il estaussi possible de le désactiver. Lorsque vous êtes sur la page daccueil de votre site cliquez sur lemenu Plus dactions > Gérer le site, une fois que vous êtes sur la page de gestion (administration)du site cliquez sur le menu Mise en page du site et ensuite cliquez sur Configurer la recherche, laboite de dialogue Configurer la recherche sur le site doit safficher.Longlet Général permet dactiver / désactiver la recherche et de choisir si vous voulez étendre larecherche au World Wide Web ou non. Longlet Avancé permet dajouter un autre site de votredomaine à la recherche, dans notre exemple nous allons juste modifier le libellé du bouton"Rechercher". Donc dans longlet Avancé vous allez cliquer sur le bouton Ajouter un moteur dans lafenêtre suivante vous ne modifiez pas loption Type, vous nommez votre nouveau moteur derecherche, par exemple Nom : GO, et vous ajouter le site sur lequel vous êtes en train de travailler,soit Sites à inclure : sélectionnez votre site dans le menu déroulant (monsiteperso99 dans notreexemple) et cliquez sur le bouton Ajouter un site, cliquez sur OK...Il faut ensuite retourner dans longlet Général, désactiver loption Moteur de recherche : Ce site etmodifier la recherche par défaut pour afficher votre nouveau moteur, soit : Recherche par défaut: GO. Cliquez sur OK et Modifier la mise en page du site avant de Revenir au site.TechnoConseil www.technoconseil.fr 17
  • 18. Tutoriel pour la création dun Google SitesVotre nouveau moteur de recherche avec le bouton GO est maintenant affiché sur la page daccueil.TechnoConseil www.technoconseil.fr 18
  • 19. Tutoriel pour la création dun Google SitesMise en page du site (2)Dans Google Sites vous pouvez modifier le positionnement de la barre latérale ou la désactiver pourquelle ne soit plus affichée sur votre site. Dans notre exemple vous allez mettre la barre latérale àdroite de votre site. Pour cela vous devez, lorsque vous êtes sur la page daccueil de votre site, cliquersur le menu Plus dactions > Gérer le site, une fois que vous êtes sur la page de gestion(administration) du site cliquez sur le menu Mise en page du site et ensuite cliquez sur Modifier lamise en page du site. Ensuite cochez loption Barre latérale : sur la droite puis cliquez sur OK.La barre latérale est maintenant affichée à droiteTechnoConseil www.technoconseil.fr 19
  • 20. Tutoriel pour la création dun Google SitesModifier la page daccueilPour modifier votre page daccueil, cliquez sur le bouton Modifier la page...Une fois en mode modification, sélectionnez le menu Mise en page pour choisir un des modèlesproposés par Google Sites, choisissez le modèle Barre latérale gauche (ce modèle permet davoir 4zones distinctes nécessaires pour la suite de notre exemple).Dans la zone supérieure saisissez le titre de votre page, ce titre est indépendant du nom de la page(Accueil dans notre exemple), il ne sera pas affiché dans la barre latérale. Le nom de la page peutaussi être modifié et/ou masqué, nous le ferons plus tard dans notre exemple. Dans le corps de votreTechnoConseil www.technoconseil.fr 20
  • 21. Tutoriel pour la création dun Google Sitespage saisissez votre texte...Pour insérer une image dans le texte, sélectionnez le menu Insérer > Image...TechnoConseil www.technoconseil.fr 21
  • 22. Tutoriel pour la création dun Google SitesChoisissez un fichier à importer, cliquez sur limage importée et faites OK...Pour intégrer limage dans le texte, cliquez sur limage et activez loption Texte intégré...Voici votre page après avoir effectué les opérations ci-dessus, noubliez pas denregistrer vosTechnoConseil www.technoconseil.fr 22
  • 23. Tutoriel pour la création dun Google Sitesmodifications.TechnoConseil www.technoconseil.fr 23
  • 24. Tutoriel pour la création dun Google SitesModifier les paramètres de la page daccueilGoogle Sites propose par défaut toute une série doptions, pour les connaitre cliquez sur lesmenus Plus dactions > Paramètres de la page :Afficher le titre de la page : le titre est le nom que vous donnez à votre page lorsque que vous lacréez pour la 1ère fois (vous pouvez le modifier ensuite), cest linformation qui est affichée dans labarre latérale et dans longlet de votre navigateur (il sagit de la balise title). Vous pouvez donc déciderdafficher ou non cette information.Afficher des liens vers les sous-pages : cette option permet dafficher le Fil dAriane des sous-pages liées à la page que vous êtes en train de modifier, ce Fil dAriane saffiche en pied de page.Autoriser les pièces jointes : en activant cette fonction vous pouvez uploader des fichiers (Word,Excel, PDF, images ...) et les afficher en pied de page.Autoriser les commentaires : en activant cette fonction vous pouvez rédiger des commentaires etles afficher en pied de page (seules les personnes que vous aurez habilitées à modifier la pagepourront écrire des commentaires).URL de la page : vous pouvez modifier lURL de votre page (à utiliser avec modération surtout si vousavez déjà partagé cette page avec dautres sites ou si cette page est indexée dans les moteurs derecherche).Modèle de page en cours dutilisation : voir exemple dutilisation. Pour notre exemple vousallez désactiver les 4 premières fonctions et enregistrer les modifications...TechnoConseil www.technoconseil.fr 24
  • 25. Tutoriel pour la création dun Google SitesEnsuite vous allez renommer le titre de la page, cliquez sur Modifier la page...Renommer Accueil en Le Groupe et enregistrer les modifications.TechnoConseil www.technoconseil.fr 25
  • 26. Tutoriel pour la création dun Google SitesCréer les pages (annuaire, chiffres clés, historique ...)Dans cet exercice vous allez créer 4 pages. Ces 4 pages sont en fait 4 sous-pages de la pagedaccueil (renommée Le Groupe dans lexercice précédent). Cliquez sur le bouton Créer page...Créer la 1ère page : choisissez un modèle de page classique, saisissez le nom Annuaire dugroupe et placez la page sous la page Le Groupe (page daccueil). Ensuite, cliquez sur lebouton Créer une page...TechnoConseil www.technoconseil.fr 26
  • 27. Tutoriel pour la création dun Google SitesCréer la 2ème page : choisissez un modèle de page classique, saisissez le nom Chiffres clés,cliquez sur le lien Choisir un autre emplacement...Sélectionner la page Accueil (ou le Groupe). Ensuite, cliquez sur le bouton Sélectionner puis sur lebouton Créer une page...TechnoConseil www.technoconseil.fr 27
  • 28. Tutoriel pour la création dun Google SitesPour la page Historique, répétez lexercice précédent...Ensuite vous allez créer la page Gouvernance pour obtenir le résultat suivant.TechnoConseil www.technoconseil.fr 28
  • 29. Tutoriel pour la création dun Google SitesModifier la barre latérale (1)Par défaut, toutes les nouvelles pages (et sous-pages) que vous créez dans votre Google Sites (voirexercice précédent) sont affichées dans la barre latérale dans lordre alphabétique du titre de la page.Dans cet exercice vous allez pouvoir modifier lordre des pages manuellement et supprimer les sous-pages car, à terme, vous ne voulez afficher dans la barre latérale que les pages de 1er niveau. Lespages de 1er niveau sont créées dans lexercice Créer les pages (Les clients, Les hommes,Actualité) et ajoutées à la barre latérale dans lexercice Modifier la barre latérale (2).Pour réaliser cet exemple vous allez cliquez dans le menu Modifier la barre latérale...Dans la page Personnaliser la mise en page de votre site cliquez sur le bouton modifier dumenu Navigation...TechnoConseil www.technoconseil.fr 29
  • 30. Tutoriel pour la création dun Google SitesDécochez loption Organiser automatiquement ma navigation et cliquez sur OK...Maintenant vous pouvez réorganiser votre barre latérale, supprimer les pages Annuaire dugroupe, Chiffres clés, Historique et Gouvernance.TechnoConseil www.technoconseil.fr 30
  • 31. Tutoriel pour la création dun Google SitesEnregistrer les modifications et revenez au site.TechnoConseil www.technoconseil.fr 31
  • 32. Tutoriel pour la création dun Google SitesInsérer une liste des sous-pagesGoogle Sites permet dafficher un sous-menu de type barre latérale sur chacune de vos pages, cettefonction permet de bien répartir la navigation de votre site entre la barre latérales et vos sous-menu.Pour réaliser notre exemple, positionnez-vous sur la page daccueil, mettez votre curseur dans lazone vide à gauche de la page et cliquez sur les menus Insérer > Liste des sous-pages...Choisissez un titre à afficher pour votre sous-menu (Le Groupe dans notre exemple), choisissez leniveau supérieur de la série de pages à afficher (choisir une page...)...TechnoConseil www.technoconseil.fr 32
  • 33. Tutoriel pour la création dun Google SitesSélectionner la page Accueil (ou Le Groupe) et cliquer sur OK...Choisissez la profondeur de larborescence à afficher, dans notre exemple nous ne souhaitonsafficher quun seul niveau de sous-pages, Afficher les niveaux1. Laissez la largeur vide pour unajustement à 100%, sélectionnez lapparence et enregistrez vos modifications.Enregistrer les modifications faites sur votre page...TechnoConseil www.technoconseil.fr 33
  • 34. Tutoriel pour la création dun Google SitesRemarque : vous pouvez modifier votre sous-menu en cliquant sur la zone liste de pages "LeGroupe" et le menu Propriétés.Votre sous-menu saffiche maintenant sur votre page daccueil.TechnoConseil www.technoconseil.fr 34
  • 35. Tutoriel pour la création dun Google SitesCréer les pages (Les Clients, Les hommes, Actualités)Dans lexercice Créer les pages (annuaire, chiffres clés, historique ...) vous avez vu comment créerles sous-pages de la page dAccueil, dans cette exercice vous allez créer 3 pages de 1er niveau (ellessont au même niveau que la page daccueil). Cliquez sur le bouton Créer page...Choisissez un modèle de page classique, le nom de votre page est Les clients, placez la page aupremier niveau, cliquez sur le bouton Créer une page...Choisissez un modèle de page classique, le nom de votre page est Les hommes, placez la page aupremier niveau, cliquez sur le bouton Créer une page...TechnoConseil www.technoconseil.fr 35
  • 36. Tutoriel pour la création dun Google SitesCréez de la même manière que les 2 pages précédentes la page Actualités.TechnoConseil www.technoconseil.fr 36
  • 37. Tutoriel pour la création dun Google SitesModifier la barre latérale (2)Dans lexercice Modifier la barre latérale (1) nous avons vu comment modifier le comportement pardéfaut de la barre latérale, dans cette exercice nous allons voir comment ajouter de nouvelles pages àla barre latérale. Dans lexercice précédent vous avez créé les pages "Les clients", "Les hommes" et"Actualités", vous allez maintenant ajouter ces pages dans la barre latérale. Cliquez sur lemenu Modifier la barre latérale...Cliquez sur le menu modifier de la zone Navigation de votre barre latérale...TechnoConseil www.technoconseil.fr 37
  • 38. Tutoriel pour la création dun Google SitesCliquez sur le bouton Ajouter une page de la zone Navigation et sélectionnez les pages à ajouter.Vous ne pouvez ajouter quune seule page à la fois donc dans notre exemple vous devrezrecommencer lopération 3 fois pour ajouter les pages : Les client, Les hommes, Actualité.Une fois les pages ajoutées, cliquez sur le bouton OK...TechnoConseil www.technoconseil.fr 38
  • 39. Tutoriel pour la création dun Google SitesEnregistrez les modifications et revenez au site...Vos pages sont maintenant affichées dans la barre latérale.TechnoConseil www.technoconseil.fr 39
  • 40. Tutoriel pour la création dun Google SitesModifier le modèle de page (Actualités)Dans lexercice Créer les pages (Les clients, Les hommes, Actualités) vous avez créez la pageActualités. Lors de cette création vous avez choisi un modèle de page classique.Dans cet exercice vous allez transformer votre page Actualités en mini-blog dannonces (les fonctionsmini-blog sont vues en détail dans lexercice suivant). Positionnez vous sur la page Actualités etcliquez sur les menus Modifier la page > Modifier le modèle de page...Sélectionner un nouveau modèle de page à utiliser, cliquez sur Annonces et cliquez sur Modifierle modèle de page...TechnoConseil www.technoconseil.fr 40
  • 41. Tutoriel pour la création dun Google SitesVotre page Actualités affiche maintenant un bouton Nouveau message et un bouton permettantaux internautes de sabonner au flux dactualité de votre page.Utiliser la fonction mini blog dannoncesLa fonction mini-blog dannonce vous permet de gérer une partie de votre Google Sites comme un blogblog, le dernier message publier est affiché en haut de la page et les internautes peuvent vous suivreavec leurs outils préférés (ex : FeedReader Google Reader, Firefox ...). Les utilisateurs, que vous y FeedReader,aurez autorisés, pourront participer à la rédaction de vos messages dactualités et ajouter descommentaires. Dans lexercice précédent vous avez vu comment modifier une page en mini exercice mini-blog,dans cet exercice vous aller utiliser les fonctions mini log de Google Sites. Pour pouvoir ajouter un mini-blogmessage vous devez êtreconnecté sur votre site (voir Se connecter sur son site). Cliquez connecté ).sur nouveau message...TechnoConseil www.technoconseil.fr 41
  • 42. Tutoriel pour la création dun Google SitesSaisissez le titre et le corps de votre message (vous pouvez ajouter des images, des vidéos, desdocuments ...)Pour tester le labonnement au flux RSS, cliquez sur le lien sabonner pour recevoir les messages...TechnoConseil www.technoconseil.fr 42
  • 43. Tutoriel pour la création dun Google SitesPar défaut Google vous propose dutiliser iGoogle ou Google Reader mais vous pouvez utiliser dautreoutil tel que FeedReader ou même directement Firefox(dans ce cas copiez et coller le lien seterminant par posts.xml dans votre outil). Dans notre exemple nous allons utiliser Google Reader,cliquez sur le bouton Add to Google Reader, le nouvel abonnement saffichera dans Google Reader,vous pouvez ainsi valider le contenu tel quil sera vu par vos abonnés.TechnoConseil www.technoconseil.fr 43
  • 44. Tutoriel pour la création dun Google SitesAjouter une Google Maps à la page AnnuaireVotre compte Gmail vous permet daccéder à de multiples services, Google Maps est un de cesservices. Google Maps vous permet de créer vos propres cartes, dans notre exemple vous allerinsérer dans votre Google Sites une carte représentant la position géographique des filiales de votresociété. Cliquez sur les menus plus et Maps (si le menu Maps nest pas affiché cliquez sur lemenu encore plus)...Une fois que la page daccueil de Google Maps est affichée (si Google vous demande dactiver ceservice, faites le) créez votre carte personnelle en utilisant les menus mes cartes > créer unenouvelle carte (voir le tutoriel fourni par Google).TechnoConseil www.technoconseil.fr 44
  • 45. Tutoriel pour la création dun Google SitesUne fois que votre carte personnelle est prête, copiez lURL de votre Google Maps. Retournez surGoogle Sites pour insérer la carte dans la page Annuaire du groupe. Cliquez sur le bouton Modifier lapage, placer votre curseur dans la zone centrale de votre page, cliquez sur lesmenus Insérer puis Carte...Collez lURL dans la section collez un lien Google Maps ici.TechnoConseil www.technoconseil.fr 45
  • 46. Tutoriel pour la création dun Google SitesModifiez les paramètres suivants : Cochez loption Inclure une bordure autour de la carte Google, Décochez loption Inclure un titre, Renseignez la Hauteur 500 pixels, Laissez la largeur vide, Enregistrez les modifications.Votre carte est maintenant affichée dans votre site.TechnoConseil www.technoconseil.fr 46
  • 47. Tutoriel pour la création dun Google SitesAjouter un graphique dynamiqueDans ce chapitre nous allons voir comment insérer un graphique dynamique dans la page Chiffresclés de votre site. La source de données pour le graphique dynamique provient dune feuille decalcul Google Spreadsheet. Commencez en sélectionnant le menu Documents.Créez une nouvelle feuille de calcul, menus Create new > Spreadsheet...TechnoConseil www.technoconseil.fr 47
  • 48. Tutoriel pour la création dun Google SitesSaisissez les valeurs dans votre feuille de calcul, enregistrer les modifications (menus File > Save),renommer votre feuille de calcul si nécessaire (menusFile > Rename, dans notre exemple la feuille decalcul se nomme Motion Chart 2)...Vous pouvez tester le graphique dynamique directement dans Google Documents afin dévaluer lerésultat avant de linsérer dans votre site.Dans votre feuille de calcul cliquez sur les menus Insert > Gadget...TechnoConseil www.technoconseil.fr 48
  • 49. Tutoriel pour la création dun Google SitesChoisissez le gadget nommé Motion Chart et ajoutez le à la feuille de calcul (Add to spreadsheet Add spreadsheet)...Paramétrez le gadget et jouez le (bouton Play ). Si le résultat vous convient, enreg enregistrez lesmodifications. Copiez lURL de votre feuille de calcul, voici les différentes étapes : share > get thelink to share > allow anyone with the link to view (copiez le lien) > save and close Vous allez close.pouvoir insérer le graphique dynamique dans votre site...TechnoConseil www.technoconseil.fr 49
  • 50. Tutoriel pour la création dun Google SitesRetournez dans Google Sites, positionnez vous sur la page Chiffres Clés et cliquez sur lebouton Modifier la page. Cliquez sur les menus Insérer > Autres gadgets...Recherchez le gadget motion chart et sélectionnez le...TechnoConseil www.technoconseil.fr 50
  • 51. Tutoriel pour la création dun Google SitesCollez lURL de votre feuille de calcul dans la zone URL de la source des données, modifiezla largeur 100 pour cent, la hauteur 350 pixels, cochezloption Ajouter un barre dedéfilement..., cochez loption Ajouter une bordure..., décochez Afficher le titre..., cliquez sur OK.Le graphique dynamique est maintenant affiché dans la page Chiffres clés.TechnoConseil www.technoconseil.fr 51
  • 52. Tutoriel pour la création dun Google SitesAjouter une présentation GoogleDans ce chapitre nous allons voir comment insérer une présentation Google Documents dans votresite. Ouvrez Google Documents en cliquant sur le menuDocuments. Créez une nouvelle présentationen cliquant sur les menus Create new > Presentation (vous pouvez aussi importer une présentationPowerpoint existante en cliquant sur le bouton Upload).Voici à quoi ressemble la présentation de notre exemple (le titre de cette présentation est Historique),sauvegardez les modifications...TechnoConseil www.technoconseil.fr 52
  • 53. Tutoriel pour la création dun Google SitesRetournez dans Google Sites, positionnez-vous sur la page Historique de votre site et cliquez sur lebouton Modifier la page. Cliquez sur les menus Insérer > Présentation...Sélectionnez la présentation Historique...TechnoConseil www.technoconseil.fr 53
  • 54. Tutoriel pour la création dun Google SitesModifiez les paramètres suivants : cochez loption Inclure une bordure..., décochez loption Inclure untitre, Taille Moyenne (555 px), cliquez sur le boutonEnregistrer...La présentation Google Documents est maintenant affichée sur la page Historique de votre site.TechnoConseil www.technoconseil.fr 54
  • 55. Tutoriel pour la création dun Google SitesAjouter un diaporama PicasaDans ce chapitre nous allons voir comment insérer un diaporama Picasa dans un Google Sites.Sélectionnez les menus plus > et encore plus...Dans la page des services Google, sélectionnez Picasa. Si Google vous demande dactiver le service,faites-le !TechnoConseil www.technoconseil.fr 55
  • 56. Tutoriel pour la création dun Google SitesImportez vos images dans Picasa Web (vous pouvez télécharger Picasa et linstaller sur votreordinateur afin de bénéficier des fonctionnalités avancées de gestion des images et desynchronisation avec Picasa Web). Cliquez sur le bouton Transférer, créer le titre de votre album(Divers dans notre exemple), choisissez le mode de partage (Public ou Non répertorié)et continuez...Choisissez les fichiers à transférer et lancez le transfert...TechnoConseil www.technoconseil.fr 56
  • 57. Tutoriel pour la création dun Google SitesCopier lURL de votre album (Lien vers cet album)...Retournez dans Google Sites, positionnez-vous sur la page Les Clients et cliquez sur lebouton Modifier la page. Cliquez sur les menus Insérer > Diaporama Picasa Album Web...TechnoConseil www.technoconseil.fr 57
  • 58. Tutoriel pour la création dun Google SitesCollez lURL de votre album Web Picasa et paramétrez les options : Format du diaporama 400px, Cochez Lire automatiquement, Cochez Inclure une bordure..., Décochez Inclure un titre, Enregistrez les modifications.Le diaporama est maintenant affiché sur la page Les Clients de votre site.TechnoConseil www.technoconseil.fr 58
  • 59. Tutoriel pour la création dun Google SitesAjouter une vidéo YouTubeDans ce chapitre nous allons voir comment mettre en ligne votre vidéo YouTube sur votre GoogleSites. Sélectionnez les menus plus > YouTube...Si cela nest pas fait, activez votre compte YouTube. Lorsque votre compte est actif,sélectionnez Ajouter une vidéo et suivez les instructions de YouTube...TechnoConseil www.technoconseil.fr 59
  • 60. Tutoriel pour la création dun Google SitesUne fois que votre vidéo est ajoutée à YouTube, vous pouvez la visualiser dans lhistorique avant dela mettre en ligne sur votre site.Allez sur le lecteur personnalisable de YouTube, renseignez le nom du lecteur (lecteur 1 dans notreexemple), choisissez le thème, la mise en page, lecontenu à afficher, générez le code du lecteuret copiez le code dans votre presse papier (Ctrl C)...TechnoConseil www.technoconseil.fr 60
  • 61. Tutoriel pour la création dun Google SitesRetournez dans Google Sites, sélectionnez la page Actualités et créez un nouveau message...Renseignez le titre de votre message, positionnez votre curseur dans le corps du message et cliquezsur le menu HTML ...TechnoConseil www.technoconseil.fr 61
  • 62. Tutoriel pour la création dun Google SitesCollez le code de votre lecteur YouTube et cliquez sur le bouton Mettre à jour...Enregistrez les modifications...TechnoConseil www.technoconseil.fr 62
  • 63. Tutoriel pour la création dun Google SitesVotre vidéo YouTube saffiche maintenant sur la page Actualités de votre site.TechnoConseil www.technoconseil.fr 63
  • 64. Tutoriel pour la création dun Google SitesModifier le modèle de page (Les Hommes)Dans ce chapitre nous allons voir comment modifier le modèle de la page Les hommes, lobjectif étantdutiliser la fonction classeur de Google Sites. Cette fonction permet de partager des documents(Word, Excel, Powerpoint, PDF ...), des fichiers, des images, etc. comme vous le feriez si vouspartagiez les répertoires de votre ordinateur. Allez sur la page Les hommes et cliquez sur lesmenus Modifier la page > Modifier le modèle de page...Sélectionnez le modèle Classeur et cliquez sur le bouton Modifier le modèle de page...TechnoConseil www.technoconseil.fr 64
  • 65. Tutoriel pour la création dun Google SitesVotre page est maintenant prête pour réaliser lexercice suivant de ce tutoriel.TechnoConseil www.technoconseil.fr 65
  • 66. Tutoriel pour la création dun Google SitesUtiliser la fonction ClasseurDans ce chapitre nous allons voir comment utiliser la fonction classeur de Google Sites. Cette fonctionpermet de partager des documents (Word, Excel, Powerpoint, PDF ...), des fichiers, des images, etc.comme vous le feriez si vous partagiez les répertoires de votre ordinateur. Dans lexerciceprécédent vous avez modifié le modèle de la page Les hommes pour pouvoir utiliser lemode Classeur. Vous allez créer 3 nouveaux dossiers, la procédure est la suivante : Cliquez sur le bouton Placez dans, Nouveau dossier..., Entrez un nom pour le dossier (dans notre exemple les noms sont Les ressources humaines, Le savoir faire, Les méthodes de travail) Enregistrez les dossiers créés.Ajouter des fichiers. Vous avez la possibilité de charger les fichiers de votre ordinateur ou de lier desfichiers externes, par exemple des Google Documents. Dans le 2ème cas il suffit de coller lURL dufichier dans la zone le Web et renseigner le texte à afficher.TechnoConseil www.technoconseil.fr 66
  • 67. Tutoriel pour la création dun Google SitesUne fois que vous avez ajouté vos fichiers, vous pouvez les classer dans les dossiers créésprécédemment en sélectionnant le(s) fichier(s) à classer et en cliquant sur le menu placer dans puisen cliquant sur le nom du dossier de destination (Les ressources humaines dans notre exemple).Répétez lopération autant de fois quil sera nécessaire.Les fichiers sont maintenant classés dans les dossiers.TechnoConseil www.technoconseil.fr 67
  • 68. Tutoriel pour la création dun Google SitesCréer une FAQ avec Google GroupsGoogle Groups est un service prévu pour gérer des forums, aussi appelé groupes de discussions ouencore newsgroup. Un forum peut être utilisé pour gérer une FAQ (Foire Aux Questions enfrançais), voir un exemple de FAQ. Dans ce chapitre nous allons voir rapidement comment créer unforum et comment afficher les derniers messages dudit forum dans votre site. Sélectionnez lesmenus plus > et encore plus...Dans la liste des services Google choisissez Groups, activez votre compte si Google vous ledemande...TechnoConseil www.technoconseil.fr 68
  • 69. Tutoriel pour la création dun Google SitesPour créer un groupe de discussion, indiquez le nom de votre groupe (Foire aux questions dansnotre exemple), créez ladresse e-mail de votre groupe (foire-aux-questions@googlegroups.com dans notre exemple), décrivez votre groupe, choisissez un niveaudaccès (Public dans notre cas)...Saisissez le Captcha et cliquez sur le bouton Créer mon groupe.TechnoConseil www.technoconseil.fr 69
  • 70. Tutoriel pour la création dun Google SitesUne fois que votre forum est créé vous pouvez lancer une nouvelle discussion, parexemple Comment puis-je suivre ma commande ? Vous pouvez afficher les messages de votre FAQsur votre site, pour cela cliquez sur le bouton XML...Google Groups vous permet de récupérer plusieurs flux Atom ou RSS, cliquez sur les liens pourvisualiser le contenu du fichier XML et choisir le flux que vous afficherez sur votre site. Une fois quevous avez fait votre choix copier lURL du flux.TechnoConseil www.technoconseil.fr 70
  • 71. Tutoriel pour la création dun Google SitesSi vous avez un doute, vous pouvez tester le flux dans Google Reader...Ajouter un abonnement, coller lURL puis cliquez sur Ajouter, vous pouvez maintenant visualiservotre flux dans Google Reader.TechnoConseil www.technoconseil.fr 71
  • 72. Tutoriel pour la création dun Google SitesPour afficher les derniers messages du forum sur votre site, vous pouvez créer une nouvelle page(FAQ dans notre exemple)...Positionnez le curseur de votre souris au centre de la page FAQ puis insérez un gadget (Autresgadgets)...TechnoConseil www.technoconseil.fr 72
  • 73. Tutoriel pour la création dun Google SitesRecherchez un lecteur de flux (feed reader en anglais, vous pouvez chercher le mot reader).Sélectionnez le gadget Generic Feed reader...Collez lURL de votre flux dans la zone Feed Entry, cochez les options Show Dates et ShowSummaries, mettez Number of Entries à 5, largeur100%, hauteur 200 pixels, cochez ajouter unebarre de défilement..., ajouter une bordure..., décochez afficher le titre du gadget et cliquez sur OK.TechnoConseil www.technoconseil.fr 73
  • 74. Tutoriel pour la création dun Google SitesLes derniers messages de votre forum sont maintenant affichés sur la page FAQ de votre site.TechnoConseil www.technoconseil.fr 74
  • 75. Tutoriel pour la création dun Google SitesCréer un blog et afficher les messages sur le siteBlogger est le service de blog de Google. Un blog peut être utilisé pour publier tous typesdinformation, les billets ou articles les plus récents sont toujours affichés en premier. Dans ce chapitrenous allons voir rapidement comment créer un blog et comment afficher les derniers messages duditblog dans votre site. Sur Google Sites sélectionnez les menus plus > et encore plus pour arriver surla page des services Google, sélectionnez Blogger...Connectez-vous avec votre compte Google (votre adresse Gmail + votre mot de passe), ensuitecliquez sur le bouton créer un blog...TechnoConseil www.technoconseil.fr 75
  • 76. Tutoriel pour la création dun Google SitesSaisissez vos informations, lisez et acceptez les conditions dutilisation et continuez...Renseignez le titre de votre blog, créez lURL de votre blog et continuez...TechnoConseil www.technoconseil.fr 76
  • 77. Tutoriel pour la création dun Google SitesChoisissez un modèle de blog et continuez...Créez un nouveau message, affichez le blog et cliquez sur le lien Messages(Atom) et copiezlURL affichée dans votre navigateur, il sagit de lURL du fluxAtom (vous pouvez coller cette URLdans un lecteur de flux pour valider le contenu avant de lafficher sur votre site)...TechnoConseil www.technoconseil.fr 77
  • 78. Tutoriel pour la création dun Google SitesRetourner sur Google Sites, créez une nouvelle page que vous nommerez Notre Blog ou Mon Blog.Insérez un gadget (Autres Gadget) dans la page Mon Blog...Recherche un lecteur de flux (rechercher reader), puis sélectionnez le gadget nommé Generic FeedReader...TechnoConseil www.technoconseil.fr 78
  • 79. Tutoriel pour la création dun Google SitesCollez lURL de votre flux Atom dans la zone Feed Entry, cochez les options Show Dates et ShowSummaries, mettez Number of Entries à 5, largeur100%, hauteur 200 pixels, cochez ajouter unebarre de défilement..., ajouter une bordure..., décochez afficher le titre du gadget et cliquez sur OK.Les derniers articles de votre blog sont maintenant affichés sur la page Mon blog de votre site.TechnoConseil www.technoconseil.fr 79
  • 80. Tutoriel pour la création dun Google SitesSe connecter sur son sitePour modifier un Google Sites il faut être connecté (authentifié, identifié) avec un identifiant et un motde passe. Le lien pour vous connecter est disponible en bas de chaque page de votre site, cliquez surle lien Connexion...Une fois la page de connexion affichée, saisissez votre identifiant ou E-mail, dans notre exemple vousdevez saisir votre adresse Gmail (il nest pas nécessaire de saisir @gmail.com) puis renseignezvotre mot de passe. Cliquez sur le bouton Connexion...TechnoConseil www.technoconseil.fr 80
  • 81. Tutoriel pour la création dun Google SitesVous êtes maintenant connecté sur votre site, les différents services Google sont affichés en haut àgauche, les fonctions Google Sites à droite et dans les différents pages de votre site.TechnoConseil www.technoconseil.fr 81
  • 82. Tutoriel pour la création dun Google SitesGestion des imagesGoogle Sites permet de modifier le positionnement et la taille par défaut de vos images. Dans notreexemple, après avoir inséré une nouvelle image, nous souhaitons modifier la position et la taille delimage. Lorsque vous cliquez sur une image un menu est affiché (au dessus ou en dessous delimage)...Pour insérer limage dans le texte, il faut activer le texte intégré (Texte intégré : activer)...TechnoConseil www.technoconseil.fr 82
  • 83. Tutoriel pour la création dun Google SitesPour modifier lalignement de limage, cliquez sur aligner G, C ou D (gauche, centre ou droite), dansnotre exemple nous choisissons daligner limage à droite(D)...Pour agrandir ou réduire limage, il faut choisir la taille S, L, G ou Originale (small, large, très large outaille originale), dans notre exemple nous choisissons la taille large (L).TechnoConseil www.technoconseil.fr 83
  • 84. Créer un site web gratuitement avec Google Sites Les mises à jour de ce tutoriel sont disponibles sur Facebook ! Rejoignez-nous sur Facebook pour accéder aux mises à jour. Et pour dialoguer avec les autres membres du groupe. http://www.facebook.com/home.php?sk=group_229378610412541 Devenir Fan http://www.facebook.com/pages/Cr%C3%A9er-un-site-web-gratuitement- avec-Google-Sites/104982836258817 www.technoconseil.fr contact@technoconseil.frTechnoConseil www.technoconseil.fr 84