
2/84

Tutoriel pour la création d'un Google Sites

TechnoConseil www.technoconseil.fr 2

Sommaire

Tutoriel pour la création dun !oo"le Sites ............................................................................................. #

Création du co$pte !$ail ...................................................................................................................... %

Création du site ....................................................................................................................................... &

'ara$(tres du site ................................................................................................................................ )2

*ise en pa"e du site +), ........................................................................................................................ )-

Couleurs et 'olices ................................................................................................................................ )%

Confi"urer le $oteur de recherche ....................................................................................................... )

*ise en pa"e du site +2, ........................................................................................................................ )&

*odifier la pa"e daccueil ..................................................................................................................... 2/

*odifier les para$(tres de la pa"e daccueil ....................................................................................... 2-

Créer les pa"es +annuaire0 chiffres clés0 histori1ue ..., ......................................................................... 2

*odifier la 3arre latérale +), ................................................................................................................. 2&

Insérer une liste des sous4pa"es ........................................................................................................... #2

Créer les pa"es +Les Clients0 Les ho$$es0 5ctualités, .......................................................................... #%

*odifier la 3arre latérale +2, ................................................................................................................. #

*odifier le $od(le de pa"e +5ctualités, ............................................................................................... -/

6tiliser la fonction $ini 3lo" dannonces .............................................................................................. -)

57outer une !oo"le *aps 8 la pa"e 5nnuaire ...................................................................................... --

57outer un "raphi1ue d9na$i1ue ......................................................................................................... -

57outer une présentation !oo"le .......................................................................................................... %2

57outer un diapora$a 'icasa ................................................................................................................ %%

57outer une :idéo ;ouTu3e ................................................................................................................... %&

*odifier le $od(le de pa"e +Les Ho$$es, .......................................................................................... -

6tiliser la fonction Classeur ...................................................................................................................

Créer une 2


3/84


TechnoConseil www.technoconseil.fr #


Pré-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 disposez

d'une palette d'outils 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 compte

Gmail. 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 :[email protected]) mais dans ce cas vous ne disposerez pas de tous les servicesproposés par Google.


4/84


TechnoConseil www.technoconseil.fr -

Voici 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 d'entreprises Google Apps, voir les exemplessur www.perseide.fr.


5/84


TechnoConseil www.technoconseil.fr %

Création du compte Gmail

La 1ère étape de ce tutoriel consiste à lancer une recherche dans Google pour trouver le

service Gmail...

Une fois le résultat de la recherche affiché, vous pouvez sélectionner le lien vers le service Gmail...


6/84


TechnoConseil www.technoconseil.fr

Choisissez l'option Créer un compte...

Remplissez le formulaire d'inscription et continuez...


7/84



Étape 2 de l'inscription...

Une fois que vous avez reçu le code d'inscription via SMS, saisissez le dans le formulaire d'inscription

et validez...


8/84


TechnoConseil www.technoconseil.fr >

Votre compte Gmail est créé ;o) Vous pouvez maintenant accéder à votre compte et aux différents

services Google.


9/84


TechnoConseil www.technoconseil.fr &

Création du site

Lorsque vous ouvrez votre page d'accueil Gmail, différents menus sont affichés en haut de la page à

droite, il s'agit des services Google auxquels vous avez accès. Les menus plus et encore plus vous

permettent d'afficher l'ensemble des services disponibles. Choisissez le menu Sites, si vous avez

plusieurs 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 vous

identifier, saisissez vos informations et continuez...


10/84


TechnoConseil www.technoconseil.fr )/

Vous êtes maintenant connecté au service Google Sites (l'URL affichée n'est

plus mail.google.com mais sites.google.com). Vous pouvez revenir sur le service Gmail quand vous le

souhaitez en cliquant sur le menu Gmail en haut à droite de la page. Pour créer votre site cliquez sur

le bouton Créer un site...

Pour commencer et mieux comprendre Google Sites choisissez un Modèle vierge, renseignez le Nom

de votre site (mon site perso... pour notre exemple), lorsque vous saisirez le nom de votre

site L'adresse de votre site sera créée automatiquement donc ne vous ne vous occupez pas de

cette information. Choisissez un modèle de site Simple...


11/84


TechnoConseil www.technoconseil.fr ))

Pour un site Public choisissez l'option Tout le monde peut consulter ce site, renseignez le captcha et

cliquez sur le bouton Créer un site... Votre site est maintenant créé.


12/84


TechnoConseil www.technoconseil.fr )2

Paramètres du site

Maintenant que le site est créé, vous allez pouvoir le customiser à votre guise, par exemple si vous ne

souhaitez 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 d'actions en

haut à 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 l'option Afficher le nom du site en haut des pages. Vous devez garder un Nom de site

pour pouvoir l'identifier dans votre liste de sites (lorsque vous en aurez plusieurs cette information


13/84


TechnoConseil www.technoconseil.fr )#

sera indispensable) et pour améliorer l'indexation dans les moteurs de recherche (Google, Yahoo et

MSN)

Enregistrez les modifications avant de sortir de la page et de Revenir au site.


14/84


TechnoConseil www.technoconseil.fr )-

Mise en page du site (1)

Vous allez fixer la largeur de votre site à 955 pixels pour qu'il soit toujours affiché de la même manière

quel que soit le type d'écran utilisé. Vous éviterez ainsi que votre site soit complètement "cassé" sur

un écran haute résolution. Cliquez sur les menus Mise en page du site et Modifier la mise en page

du sitede l'interface de gestion (administration) du site. Renseignez les valeurs suivantes Largeur dusite 955px, Hauteur de l'en-tête 160 pixels (l'image 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.


15/84


TechnoConseil www.technoconseil.fr )%

Couleurs et Polices

Une fois la largeur de votre site ajustée, vous allez importer l'image d'en-tête de votre site (dans notre

exemple l'image fait 955 pixels de largeur et 159 pixels de hauteur). Cliquez sur le menu Couleurs et

polices, dans le menu déroulant choisissez l'option En-tête de site > image d'arrière plan des en-

têtes de sites... Cliquez sur le bouton Choisissez un fichier pour ouvrir la boite de dialogue etchoisir l'image se trouvant sur votre ordinateur...

Une fois l'image choisie, sélectionnez les options suivantes : Juxtaposition Aucun, Positionhorizontale Au centre, Position verticale Haut...


16/84


TechnoConseil www.technoconseil.fr )

Enregistrez les modifications avant de Revenir au site.

Votre image est maintenant affichée en en-tête de votre site.


17/84



Configurer le moteur de recherche

Une fonction de Google Sites permet de modifier les paramètres du moteur de recherche intégré, il est

aussi possible de le désactiver. Lorsque vous êtes sur la page d'accueil de votre site cliquez sur le

menu Plus d'actions > 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 s'afficher.

L'onglet Général permet d'activer / désactiver la recherche et de choisir si vous voulez étendre la

recherche au World Wide Web ou non. L'onglet Avancé permet d'ajouter un autre site de votre

domaine à la recherche, dans notre exemple nous allons juste modifier le libellé du bouton

"Rechercher". Donc dans l'onglet Avancé vous allez cliquer sur le bouton Ajouter un moteur dans la

fenêtre suivante vous ne modifiez pas l'option Type, vous nommez votre nouveau moteur de

recherche, 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 notre

exemple) et cliquez sur le bouton Ajouter un site, cliquez sur OK...

Il faut ensuite retourner dans l'onglet Général, désactiver l'option Moteur de recherche : Ce site et

modifier 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.


18/84


TechnoConseil www.technoconseil.fr )>

Votre nouveau moteur de recherche avec le bouton GO est maintenant affiché sur la page d'accueil.


19/84


TechnoConseil www.technoconseil.fr )&

Mise en page du site (2)

Dans Google Sites vous pouvez modifier le positionnement de la barre latérale ou la désactiver pour

qu'elle 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 d'accueil de votre site, cliquer

sur le menu Plus d'actions > 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 la

mise en page du site. Ensuite cochez l'option Barre latérale : sur la droite puis cliquez sur OK.

La barre latérale est maintenant affichée à droite


20/84


TechnoConseil www.technoconseil.fr 2/

Modifier la page d'accueil

Pour modifier votre page d'accueil, cliquez sur le bouton Modifier la page...

Une fois en mode modification, sélectionnez le menu Mise en page pour choisir un des modèles

proposés par Google Sites, choisissez le modèle Barre latérale gauche (ce modèle permet d'avoir 4

zones 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 peut

aussi être modifié et/ou masqué, nous le ferons plus tard dans notre exemple. Dans le corps de votre


21/84


TechnoConseil www.technoconseil.fr 2)

page saisissez votre texte...

Pour insérer une image dans le texte, sélectionnez le menu Insérer > Image...


22/84



Choisissez un fichier à importer, cliquez sur l'image importée et faites OK...

Pour intégrer l'image dans le texte, cliquez sur l'image et activez l'option Texte intégré...

Voici votre page après avoir effectué les opérations ci-dessus, n'oubliez pas d'enregistrer vos


23/84


TechnoConseil www.technoconseil.fr 2#

modifications.


24/84


TechnoConseil www.technoconseil.fr 2-

Modifier les paramètres de la page d'accueil

Google Sites propose par défaut toute une série d'options, pour les connaitre cliquez sur les

menus Plus d'actions > Paramètres de la page :

Afficher le titre de la page : le titre est le nom que vous donnez à votre page lorsque que vous la

créez pour la 1ère fois (vous pouvez le modifier ensuite), c'est l'information qui est affichée dans labarre latérale et dans l'onglet de votre navigateur (il s'agit de la balise title). Vous pouvez donc décider

d'afficher ou non cette information.

Afficher des liens vers les sous-pages : cette option permet d'afficher le Fil d'Ariane des sous-

pages liées à la page que vous êtes en train de modifier, ce Fil d'Ariane s'affiche 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 et

les afficher en pied de page (seules les personnes que vous aurez habilitées à modifier la page

pourront écrire des commentaires).

URL de la page : vous pouvez modifier l'URL de votre page (à utiliser avec modération surtout si vousavez déjà partagé cette page avec d'autres sites ou si cette page est indexée dans les moteurs de

recherche).

Modèle de page en cours d'utilisation : voir exemple d'utilisation. Pour notre exemple vous

allez désactiver les 4 premières fonctions et enregistrer les modifications...


25/84


TechnoConseil www.technoconseil.fr 2%

Ensuite vous allez renommer le titre de la page, cliquez sur Modifier la page...

Renommer Accueil en Le Groupe et enregistrer les modifications.


26/84



Créer les pages (annuaire chiffres clés histori!ue """)

Dans cet exercice vous allez créer 4 pages. Ces 4 pages sont en fait 4 sous-pages de la page

d'accueil (renommée Le Groupe dans l'exercice 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 du

groupe et placez la page sous la page Le Groupe (page d'accueil). Ensuite, cliquez sur lebouton Créer une page...


27/84



Cré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 le

bouton Créer une page...


28/84


TechnoConseil www.technoconseil.fr 2>

Pour la page Historique, répétez l'exercice précédent...

Ensuite vous allez créer la page Gouvernance pour obtenir le résultat suivant.


29/84


TechnoConseil www.technoconseil.fr 2&

Modifier la #arre latérale (1)

Par défaut, toutes les nouvelles pages (et sous-pages) que vous créez dans votre Google Sites (voir

exercice précédent) sont affichées dans la barre latérale dans l'ordre alphabétique du titre de la page.

Dans cet exercice vous allez pouvoir modifier l'ordre 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 l'exercice Créer les pages (Les clients, Les hommes,

Actualité) et ajoutées à la barre latérale dans l'exercice 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 du

menu Navigation...


30/84


TechnoConseil www.technoconseil.fr #/

Décochez l'option Organiser automatiquement ma navigation et cliquez sur OK...

Maintenant vous pouvez réorganiser votre barre latérale, supprimer les pages Annuaire du

groupe, Chiffres clés, Historique et Gouvernance.


31/84


TechnoConseil www.technoconseil.fr #)

Enregistrer les modifications et revenez au site.


32/84


TechnoConseil www.technoconseil.fr #2

$nsérer une liste des sous%pages

Google Sites permet d'afficher un sous-menu de type barre latérale sur chacune de vos pages, cette

fonction 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 d'accueil, mettez votre curseur dans la

zone 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...)...


33/84


TechnoConseil www.technoconseil.fr ##

Sélectionner la page Accueil (ou Le Groupe) et cliquer sur OK...

Choisissez la profondeur de l'arborescence à afficher, dans notre exemple nous ne souhaitons

afficher qu'un seul niveau de sous-pages, Afficher les niveaux1. Laissez la largeur vide pour unajustement à 100%, sélectionnez l'apparence et enregistrez vos modifications.

Enregistrer les modifications faites sur votre page...


34/84


TechnoConseil www.technoconseil.fr #-

Remarque : vous pouvez modifier votre sous-menu en cliquant sur la zone liste de pages "Le

Groupe" et le menu Propriétés.

Votre sous-menu s'affiche maintenant sur votre page d'accueil.


35/84


TechnoConseil www.technoconseil.fr #%

Créer les pages (&es Clients &es hommes ctualités)

Dans l'exercice Créer les pages (annuaire, chiffres clés, historique ...) vous avez vu comment créer

les sous-pages de la page d'Accueil, dans cette exercice vous allez créer 3 pages de 1er niveau (elles

sont au même niveau que la page d'accueil). 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 au

premier 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 au

premier niveau, cliquez sur le bouton Créer une page...


36/84



Créez de la même manière que les 2 pages précédentes la page Actualités.


37/84



Modifier la #arre latérale (2)

Dans l'exercice Modifier la barre latérale (1) nous avons vu comment modifier le comportement par

défaut de la barre latérale, dans cette exercice nous allons voir comment ajouter de nouvelles pages à

la barre latérale. Dans l'exercice 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...


38/84


TechnoConseil www.technoconseil.fr #>

Cliquez sur le bouton Ajouter une page de la zone Navigation et sélectionnez les pages à ajouter.

Vous ne pouvez ajouter qu'une seule page à la fois donc dans notre exemple vous devrez

recommencer l'opération 3 fois pour ajouter les pages : Les client, Les hommes, Actualité.

Une fois les pages ajoutées, cliquez sur le bouton OK...


39/84


TechnoConseil www.technoconseil.fr #&

Enregistrez les modifications et revenez au site...

Vos pages sont maintenant affichées dans la barre latérale.


40/84


TechnoConseil www.technoconseil.fr -/

Modifier le modèle de page (ctualités)

Dans l'exercice Créer les pages (Les clients, Les hommes, Actualités) vous avez créez la page

Actualité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 d'annonces (les fonctions

mini-blog sont vues en détail dans l'exercice 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 Modifier

le modèle de page...


41/84

Tutoriel

TechnoConseil

Votre page Actualités affiche mai

aux internautes de s'abonner au

tiliser la fonction mi

La fonction mini-blog d'annonce

blog, le dernier message publier

avec leurs outils préférés (ex : F

aurez autorisés, pourront partici

commentaires. Dans l'exercice p

dans cet exercice vous aller utilimessage vous devez êtreconne

sur nouveau message...

pour la création d'un Google Site

www.technoconseil.fr

intenant un bouton Nouveau message et un bo

flux d'actualité de votre page.

i #log d'annonces

ous permet de gérer une partie de votre Google

est affiché en haut de la page et les internautes

edReader, Google Reader, Firefox ...). Les utilis

er à la rédaction de vos messages d'actualités e

récédent vous avez vu comment modifier une pa

er les fonctions mini-blog de Google Sites. Pourté sur votre site (voir Se connecter sur son site).

-)

ton permettant

Sites comme un

euvent vous suivre

ateurs, que vous y

ajouter des

ge en mini-blog,

pouvoir ajouter unCliquez


42/84


TechnoConseil www.technoconseil.fr -2

Saisissez le titre et le corps de votre message (vous pouvez ajouter des images, des vidéos, des

documents ...)

Pour tester le l'abonnement au flux RSS, cliquez sur le lien s'abonner pour recevoir les messages...


43/84


TechnoConseil www.technoconseil.fr -#

Par défaut Google vous propose d'utiliser iGoogle ou Google Reader mais vous pouvez utiliser d'autre

outil tel que FeedReader ou même directement Firefox(dans ce cas copiez et coller le lien se

terminant 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 s'affichera dans Google Reader,

vous pouvez ainsi valider le contenu tel qu'il sera vu par vos abonnés.


44/84


TechnoConseil www.technoconseil.fr --

outer une Google Maps * la page nnuaire

Votre compte Gmail vous permet d'accéder à de multiples services, Google Maps est un de ces

services. Google Maps vous permet de créer vos propres cartes, dans notre exemple vous aller

insérer dans votre Google Sites une carte représentant la position géographique des filiales de votre

société. Cliquez sur les menus plus et Maps (si le menu Maps n'est pas affiché cliquez sur lemenu encore plus)...

Une fois que la page d'accueil de Google Maps est affichée (si Google vous demande d'activer ce

service, faites le) créez votre carte personnelle en utilisant les menus mes cartes > créer une

nouvelle carte (voir le tutoriel fourni par Google).


45/84


TechnoConseil www.technoconseil.fr -%

Une fois que votre carte personnelle est prête, copiez l'URL de votre Google Maps. Retournez sur

Google Sites pour insérer la carte dans la page Annuaire du groupe. Cliquez sur le bouton Modifier la

page, placer votre curseur dans la zone centrale de votre page, cliquez sur les

menus Insérer puis Carte...

Collez l'URL dans la section collez un lien Google Maps ici.


46/84



Modifiez les paramètres suivants :

Cochez l'option Inclure une bordure autour de la carte Google,

Décochez l'option Inclure un titre,

Renseignez la Hauteur 500 pixels,

Laissez la largeur vide, Enregistrez les modifications.

Votre carte est maintenant affichée dans votre site.


47/84



outer un graphi!ue d+nami!ue

Dans ce chapitre nous allons voir comment insérer un graphique dynamique dans la page Chiffres

clés de votre site. La source de données pour le graphique dynamique provient d'une feuille de

calcul Google Spreadsheet. Commencez en sélectionnant le menu Documents.

Créez une nouvelle feuille de calcul, menus Create new > Spreadsheet...


48/84


TechnoConseil www.technoconseil.fr ->

Saisissez 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 de

calcul se nomme Motion Chart 2)...

Vous pouvez tester le graphique dynamique directement dans Google Documents afin d'évaluer le

résultat avant de l'insérer dans votre site.

Dans votre feuille de calcul cliquez sur les menus Insert > Gadget...


49/84

Tutoriel

TechnoConseil

Choisissez le gadget nommé Mo

Paramétrez le gadget et jouez le

modifications. Copiez l'URL de

link to share > allow anyone w

pouvoir insérer le graphique dyn

pour la création d'un Google Site

www.technoconseil.fr

tion Chart et ajoutez le à la feuille de calcul (Add

(bouton Play ). Si le résultat vous convie

otre feuille de calcul, voici les différentes étapes

ith the link to view (copiez le lien) > save and c

mique dans votre site...

-&

to spreadsheet)...

nt, enregistrez les

: share > get the

lose. Vous allez


50/84


TechnoConseil www.technoconseil.fr %/

Retournez dans Google Sites, positionnez vous sur la page Chiffres Clés et cliquez sur le

bouton Modifier la page. Cliquez sur les menus Insérer > Autres gadgets...

Recherchez le gadget motion chart et sélectionnez le...


51/84


TechnoConseil www.technoconseil.fr %)

Collez l'URL de votre feuille de calcul dans la zone URL de la source des données, modifiez

la largeur 100 pour cent, la hauteur 350 pixels, cochezl'option Ajouter un barre de

défilement..., cochez l'option Ajouter une bordure..., décochez Afficher le titre..., cliquez sur OK.

Le graphique dynamique est maintenant affiché dans la page Chiffres clés.


52/84


TechnoConseil www.technoconseil.fr %2

outer une présentation Google

Dans ce chapitre nous allons voir comment insérer une présentation Google Documents dans votre

site. Ouvrez Google Documents en cliquant sur le menuDocuments. Créez une nouvelle présentation

en cliquant sur les menus Create new > Presentation (vous pouvez aussi importer une présentation

Powerpoint 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...


53/84


TechnoConseil www.technoconseil.fr %#

Retournez dans Google Sites, positionnez-vous sur la page Historique de votre site et cliquez sur le

bouton Modifier la page. Cliquez sur les menus Insérer > Présentation...

Sélectionnez la présentation Historique...


54/84


TechnoConseil www.technoconseil.fr %-

Modifiez les paramètres suivants : cochez l'option Inclure une bordure..., décochez l'option Inclure un

titre, Taille Moyenne (555 px), cliquez sur le boutonEnregistrer...

La présentation Google Documents est maintenant affichée sur la page Historique de votre site.


55/84


TechnoConseil www.technoconseil.fr %%

outer un diaporama Picasa

Dans 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 d'activer le service,

faites-le !


56/84



Importez vos images dans Picasa Web (vous pouvez télécharger Picasa et l'installer sur votre

ordinateur afin de bénéficier des fonctionnalités avancées de gestion des images et de

synchronisation 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...


57/84



Copier l'URL de votre album (Lien vers cet album)...

Retournez dans Google Sites, positionnez-vous sur la page Les Clients et cliquez sur le

bouton Modifier la page. Cliquez sur les menus Insérer > Diaporama Picasa Album Web...


58/84


TechnoConseil www.technoconseil.fr %>

Collez l'URL 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.


59/84


TechnoConseil www.technoconseil.fr %&

outer une ,idéo -ouTu#e

Dans ce chapitre nous allons voir comment mettre en ligne votre vidéo YouTube sur votre Google

Sites. Sélectionnez les menus plus > YouTube...

Si cela n'est pas fait, activez votre compte YouTube. Lorsque votre compte est actif,

sélectionnez Ajouter une vidéo et suivez les instructions de YouTube...


60/84


TechnoConseil www.technoconseil.fr /

Une fois que votre vidéo est ajoutée à YouTube, vous pouvez la visualiser dans l'historique avant de

la mettre en ligne sur votre site.

Allez sur le lecteur personnalisable de YouTube, renseignez le nom du lecteur (lecteur 1 dans notre

exemple), choisissez le thème, la mise en page, lecontenu à afficher, générez le code du lecteur

et copiez le code dans votre presse papier (Ctrl C)...


61/84



Retournez 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 cliquez

sur le menu HTML ...


62/84



Collez le code de votre lecteur YouTube et cliquez sur le bouton Mettre à jour...

Enregistrez les modifications...


63/84



Votre vidéo YouTube s'affiche maintenant sur la page Actualités de votre site.


64/84



Modifier le modèle de page (&es .ommes)

Dans ce chapitre nous allons voir comment modifier le modèle de la page Les hommes, l'objectif étant

d'utiliser 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 vous

partagiez 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...


65/84



Votre page est maintenant prête pour réaliser l'exercice suivant de ce tutoriel.


66/84



tiliser la fonction Classeur

Dans ce chapitre nous allons voir comment utiliser 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 vous partagiez les répertoires de votre ordinateur. Dans l'exercice

pré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 des

fichiers externes, par exemple des Google Documents. Dans le 2ème cas il suffit de coller l'URL du

fichier dans la zone le Web et renseigner le texte à afficher.


67/84



Une fois que vous avez ajouté vos fichiers, vous pouvez les classer dans les dossiers créés

précédemment en sélectionnant le(s) fichier(s) à classer et en cliquant sur le menu placer dans puis

en cliquant sur le nom du dossier de destination (Les ressources humaines dans notre exemple).

Répétez l'opération autant de fois qu'il sera nécessaire.

Les fichiers sont maintenant classés dans les dossiers.


68/84



Créer une /0 a,ec Google Groups

Google Groups est un service prévu pour gérer des forums, aussi appelé groupes de discussions ou

encore newsgroup. Un forum peut être utilisé pour gérer une FAQ (Foire Aux Questions en

français), voir un exemple de FAQ. Dans ce chapitre nous allons voir rapidement comment créer un

forum 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...


69/84



Pour créer un groupe de discussion, indiquez le nom de votre groupe (Foire aux questions dans

notre exemple), créez l'adresse e-mail de votre groupe (foire-aux-

[email protected] dans notre exemple), décrivez votre groupe, choisissez un niveau

d'accès (Public dans notre cas)...

Saisissez le Captcha et cliquez sur le bouton Créer mon groupe.


70/84


TechnoConseil www.technoconseil.fr /

Une fois que votre forum est créé vous pouvez lancer une nouvelle discussion, par

exemple Comment puis-je suivre ma commande ? Vous pouvez afficher les messages de votre FAQ

sur 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 pour

visualiser le contenu du fichier XML et choisir le flux que vous afficherez sur votre site. Une fois que

vous avez fait votre choix copier l'URL du flux.


71/84



Si vous avez un doute, vous pouvez tester le flux dans Google Reader...

Ajouter un abonnement, coller l'URL puis cliquez sur Ajouter, vous pouvez maintenant visualiser

votre flux dans Google Reader.


72/84



Pour 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 (Autres

gadgets)...


73/84



Recherchez un lecteur de flux (feed reader en anglais, vous pouvez chercher le mot reader).

Sélectionnez le gadget Generic Feed reader...

Collez l'URL de votre flux dans la zone Feed Entry, cochez les options Show Dates et Show

Summaries, mettez Number of Entries à 5, largeur100%, hauteur 200 pixels, cochez ajouter une

barre de défilement..., ajouter une bordure..., décochez afficher le titre du gadget et cliquez sur OK.


74/84



Les derniers messages de votre forum sont maintenant affichés sur la page FAQ de votre site.


75/84



Créer un #log et afficher les messages sur le site

Blogger est le service de blog de Google. Un blog peut être utilisé pour publier tous types

d'information, les billets ou articles les plus récents sont toujours affichés en premier. Dans ce chapitre

nous allons voir rapidement comment créer un blog et comment afficher les derniers messages dudit

blog 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), ensuite

cliquez sur le bouton créer un blog...


76/84



Saisissez vos informations, lisez et acceptez les conditions d'utilisation et continuez...

Renseignez le titre de votre blog, créez l'URL de votre blog et continuez...


77/84



Choisissez un modèle de blog et continuez...

Créez un nouveau message, affichez le blog et cliquez sur le lien Messages(Atom) et copiez

l'URL affichée dans votre navigateur, il s'agit de l'URL du fluxAtom (vous pouvez coller cette URL

dans un lecteur de flux pour valider le contenu avant de l'afficher sur votre site)...


78/84



Retourner 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 Feed

Reader...


79/84



Collez l'URL de votre flux Atom dans la zone Feed Entry, cochez les options Show Dates et Show

Summaries, mettez Number of Entries à 5, largeur100%, hauteur 200 pixels, cochez ajouter une

barre 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.


80/84


TechnoConseil www.technoconseil.fr >/

Se connecter sur son site

Pour modifier un Google Sites il faut être connecté (authentifié, identifié) avec un identifiant et un mot

de passe. Le lien pour vous connecter est disponible en bas de chaque page de votre site, cliquez sur

le lien Connexion...

Une fois la page de connexion affichée, saisissez votre identifiant ou E-mail, dans notre exemple vous

devez saisir votre adresse Gmail (il n'est pas nécessaire de saisir @gmail.com) puis renseignez

votre mot de passe. Cliquez sur le bouton Connexion...


81/84


TechnoConseil www.technoconseil.fr >)

Vous ê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.


82/84


TechnoConseil www.technoconseil.fr >2

Gestion des images

Google Sites permet de modifier le positionnement et la taille par défaut de vos images. Dans notre

exemple, après avoir inséré une nouvelle image, nous souhaitons modifier la position et la taille de

l'image. Lorsque vous cliquez sur une image un menu est affiché (au dessus ou en dessous de

l'image)...

Pour insérer l'image dans le texte, il faut activer le texte intégré (Texte intégré : activer)...


83/84


TechnoConseil www.technoconseil.fr >#

Pour modifier l'alignement de l'image, cliquez sur aligner G, C ou D (gauche, centre ou droite), dans

notre exemple nous choisissons d'aligner l'image à droite(D)...

Pour agrandir ou réduire l'image, il faut choisir la taille S, L, G ou Originale (small, large, très large ou

taille originale), dans notre exemple nous choisissons la taille large (L).


84/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 pourdialoguer 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

tutoriel pour la creation d'un site web google sites

Documents