GESTION DE SITE Table des matières 1- Page d accueil de l interface de gestion de site...1 2- Table Menu...4 3- Éditeur de texte...5 4- Insérer une image dans une page...6 5- Créer un lien hypertexte vers un document...8 6- Créer un lien hypertexte vers un autre site...9 7- Créer un lien hypertexte sur une image... 10 8- Notes importantes concernant l insertion (copier) de texte... 11 9- Notes importantes concernant l insertion des images ou photos... 11
1- Page d accueil de l interface de gestion de site Cette section permet de voir toutes les pages du site et d en personnaliser le titre et l emplacement dans le site. De les mettre actives ou pas. Ici, il n est pas question du contenu de la page. 2
Il y a 2 types de pages. Les pages pré-formatées et les nonformatées dites aussi pages supplémentaires. En sélectionnant une page, nous pouvons y insérer du texte et des images. Ici, il est question du contenu de chaque page. Pour créer un lien hypertexte vers un document, il faut au préalable le transférer sur le serveur. L'option "Upload (documents)" du menu vous permet de le faire. Pour insérer une image dans une page, il faut au préalable la transférer sur le serveur. L'option "Upload (images)" du menu vous permet de le faire. 3
2- Table : Menu du site Cette section permet de voir toutes les pages du site et d en personnaliser le titre et l emplacement dans le site. De les mettre actives ou pas. Ici, il n est pas question du contenu de la page. Cliquez sur Libellé du menu (français) pour le classement en ordre alphabétique des pages et ainsi faciliter la recherche d une page en particulier. Pour activer une page ou apporter une modification, cliquer sur le crayon. Titre de la page. Positionnement de la page dans le menu auquel elle est associée. Il s agit de la photo associée à la page. Positionnement de la page sur le site. Choisir Oui ou Non pour activer la page. 4
3- Éditeur de texte Voici un exemple de l éditeur de texte. Cet icône permet de supprimer les codes HTML cachés qui n apparaissent pas dans la page. Cet icône permet de créer un lien hypertexte. vers un document : voir section no. 5 vers un autre site: voir section no. 6 à partir d une image : voir section no. 7 Cet icône permet d insérer des images. voir section no. 4 Tout comme le logiciel «Word de Microsoft». Vous pouvez : Changer la police de caractère ; Changer la grosseur des caractères ; Mettre du texte en caractère gras, en italique ou encore soulignés ; Justifier le texte à gauche, à droite, centrer le texte ; Faire des listes à puces ou numérotés ; Changer la couleur du fond ou du texte ; Insérer des images ; Créer des liens hypertextes sur les images que vous avez créé auparavant ; Créer des liens hypertextes vers d autres sites ; Créer des liens hypertextes vers des documents word, excel, powerpoint, pdf, etc... 5
4- Insérer une image dans une page Avant de vouloir insérer une image dans une page, il faut la transférer sur le serveur. L option «Upload (images)» du menu vous permet de le faire. Dans le menu, cliquer sur Upload (Autres images). L information ci-dessous apparaîtra. Il suffit donc de cliquer sur le bouton «Parcourir», de sélectionner l image à l emplacement où elle se trouve sur votre ordinateur et de cliquer sur le bouton «Envoyer!». Imaginons que nous venons de transférer une image portant le nom de «test.jpg». Voici le message qui apparaît : Avec la touche CTRL + C, sélectionner l adresse de l image transférée : Pour insérer l image dans l éditeur de texte, il suffit de cliquer sur l îcone nouvelle page s ouvrirait comme l exemple suivant. de l éditeur, une 6
Avec la touche CTRL + V, copier l adresse dans la case Image URL. Cliquer sur OK. L image sera disponible sur la page. 7
5- Créer un lien hypertexte vers un document Avant de pouvoir créer un lien hypertexte vers un document dans une page supplémentaire, il faut le transférer sur le serveur. L option «Upload (documents)» du menu vous permet de le faire. L image ci-haut vous montre la page «Upload (documents)». Il suffit donc de cliquer sur le bouton «Parcourir», d»aller sélectionner le document à l emplacement où il se trouve sur votre ordinateur et de cliquer sur le bouton «Envoyer!». Imaginons que nous venons de transférer un document portant le nom de «test.doc». Pour créer un lien sur du texte : il suffit de sélectionner le texte dans l éditeur (comme photo ici-bas) et cliquer sur l îcone l éditeur, une nouvelle page s ouvrirait comme la deuxième image plus bas. de La seule case obligatoire à remplir est «URL», vous devez y inscrire le lien vers le document que vous voulez atteindre, soit http://votrenomdedomaine.qc.ca/doc/test.doc En sélectionnant New windows ( blank), le document s ouvrira dans une nouvelle fenêtre. 8
6- Créer un lien hypertexte vers un autre site Pour créer un lien hypertexte sur du texte, il suffit de le sélectionner et de cliquer sur l îcone l éditeur, une nouvelle page s ouvrirait comme l exemple suivant. de La seule case obligatoire à remplir est «URL», vous devez y inscrire le lien que vous voulez atteindre lors d un clic sur le texte dans le site exemple : http://google.com En sélectionnant New windows ( blank), le document s ouvrira dans une nouvelle fenêtre. 9
7- Créer un lien hypertexte sur une image Il est possible de créer un lien hypertexte sur une image. Après avoir inséré une image dans la page (référence : section no.4), il suffit de sélectionner l image avec votre curseur et de cliquer sur l îcone de l éditeur et d y inscrire les informations selon que vous désirez faire le lien sur un document (sections no.5) ou faire un lien vers un autre site web (section no. 6). 10
8- Notes importantes concernant l insertion (copier) de texte Lorsque l on veut copier du texte à partir d une source quelconque vers l éditeur de texte d une page du site, il est fortement recommander de traiter (reformater) l information que l on veut copier avec le logiciel TextPad. 9- Notes importantes concernant l insertion des images ou photos Toutes les images que l on veut insérer dans le site devraient avoir les caractéristiques suivantes : Type de fichier : jpg ou gif 1- Pour les images à insérer dans une page Taille : moins de 40k Dimension : maximun de 450 pixels de largeur 2- Pour les images du menu de gauche (image associée à la page) Taille : moins de 20k La dimension doit correspondre à peu près à la largeur de la colonne du menu de gauche. 3- Pour les photos des membres du personnel Taille : moins de 30k Dimension : 150 pixels de largeur 4- Pour la photo du bureau dans la page Coordonnées. Taille : moins de 40k Dimension : 150 pixels de largeur Pour le traitement des images, nous vous recommandons d utiliser le logiciel : Office Picture Manager de la suite Microsoft. 11