Site internet CDF57 Manuel Rédacteur Sommaire Avant-propos...2 Organisation du site...3 L'administration...4 Les pages isolées...5 La barre d'outils d'édition...6 Autres raccourcis typographiques...7 Les panneaux Pages et Medias...7 Les contenus structurés...11 Les articles...11 Les Formations...13 Les sessions de formation...14 Les clients...15 Les medias...17 Fiche pratique...18 Editer Accueil et Mentions légales...18 Editer tous les autres contenus...18 Raccourcis typographiques...18 Liens...18 vers un site externe...18 vers une page du site...18 Media (Images et documents)...18 Pygmeeweb Sites agiles et efficaces contact@pygmeeweb.com
Avant-propos Vous voici rédacteur du site du Centre Départemental de Formation Moselle de la FNMNS, site internet que nous sommes fier d'avoir développé avec vous. Maintenant, il reste à le faire vivre, ce qui est la plus grosse part du travail. Il faut maintenant faire connaître le site comme celui d'une structure de formation professionnelle. D'où l'utilité d'un contenu soigné, apte à captiver vos visiteurs, qu'il s'agisse de clients potentiels où des moteurs de recherche. Votre rôle dans votre fonction de rédacteur sera principalement de fournir des contenus, les aspects techniques liés à l'insertion et la mise à jour dans le site étant simplifiés au maximum. Si vous suivez les prescriptions de ce manuel, votre visibilité sur la "toile" n'en sera qu'améliorée. Afin de garantir un meilleur confort d'utilisation, nous vous conseillons fortement d'utiliser un navigateur moderne tel que Google chrome ou Mozilla Firefox. Site internet CDF57 - Manuel Rédacteur - version 06/12/10 - page 2/18
Organisation du site L'organisation du site a été pensée pour refléter votre métier et vous permettre de gérer votre site de la manière la plus proche de votre organisation dans le monde réel. Vue hiérarchique des contenus Titre Commentaire Accueil Page "isolée" Qui sommes nous Type contenu = Article Calendrier formations Généré automatiquement des Nos clients Centre formation Type contenu = Client de Type contenu = Article Contactez nous! Généré automatiquement Formations Sauvetage Type contenu formation = Catégorie BNSSA Type contenu = Formation etc... Type contenu = Formation Secourisme Type contenu formation = Catégorie PSC1 initial Type contenu = Formation etc. Mentions légales Type contenu = Formation Page "isolée" Dans le tableau ci-dessus vous avez une vue synthétique des contenus du site et du type de contenu dont il s'agit. Voyons maintenant comment gérer chaque type de contenus. Site internet CDF57 - Manuel Rédacteur - version 06/12/10 - page 3/18
L'administration Afin de gérer vos contenus, vous disposez d'une interface d'administration, aussi appelée le Back-end dans le langage barbare des informaticiens. Se rendre sur l'administration du site (http://fnmns-cdf57.fr/admin.php) Un fois authentifié, vous arrivez sur la page d'accueil de l'administration. Cette page vous présente l'activité du site, ainsi que les statistiques de fréquentation. Elle comprend également une barre d'outil dans sa partie supérieure. Dans l'ordre, on y trouve : Un menu Contenu qui vous permet de gérer vos articles, formations, etc. Un menu Outils qui vous permet de gérer les média (images, documents) et d'accéder aux rapports d'activité du site. Un lien vers la partie publique du site (Aller au site). Un bouton de déconnexion. Site internet CDF57 - Manuel Rédacteur - version 06/12/10 - page 4/18
Les pages isolées Deux de nos pages sont des pages dites isolées. Elles ne sont pas rattachées à un type de contenu particulier comme les articles ou les formations. Il s'agit de l'accueil et de la page Mentions légales. La nature particulière de ces pages tient au fait que : l'accueil à une présentation particulière : 1 encart d'introduction, 1 encart pour les prochaines formations et un encart pour les clients. la page mentions légales elle ne fait référence à aucun type de contenu (articles, formation ou client) Pour éditer l'encart d'introduction de l'accueil ou la page mentions légales, il faut : cliquer sur le lien "allez au site" en tant que rédacteur authentifié, vous pouvez voir sur l'article d'accueil un crayon qui vous permet d'éditer cet article Site internet CDF57 - Manuel Rédacteur - version 06/12/10 - page 5/18
Lors de l'édition d'un article vous disposez de deux "champs" : le titre et le corps du texte. Dans l'exemple ci-dessus, vous pouvez voir que nous avons mis le titre dans le corps du texte, ceci afin de mieux maîtriser la mise en page. NB : Vous pouvez agrandir cette boîte de dialogue en saisissant son coin inférieur droit. Détaillons le fonctionnement de cette zone. La barre d'outils d'édition Vous pouvez voir dans la partie supérieure du corps du texte, une barre d'outils. Les boutons de type 1 correspondent aux titres, H2 étant le plus important et H4... le moins important. Notez bien que ces boutons ne fonctionnent pas tout à fait comme ceux que l'on trouve dans les traitement de texte, il ne font qu'ajouter des "raccourcis typographiques" qui un fois interprétés rendrons l'effet escompté. Ex : un titre est rendu comme suit dans l'éditeur ## Mon titre H2 Mon texte... ### Mon titre H3 Mon texte... #### Mon titre H4 Mon texte... NB : Toujours utiliser les titre dans l'ordre H2, puis H3, puis H4 car il reflètent l'ordre d'importance des différents chapitres ou paragraphes. Les boutons de types 2 correspondent au gras et à l'italique, et donnent respectivement : **Texte en gras** _Texte en italique_ ***Texte en gras italique*** Les boutons de type 3 correspondent aux liste à puce : - élément de liste 1 Site internet CDF57 - Manuel Rédacteur - version 06/12/10 - page 6/18
- élément de liste 2 Enfin, le bouton de type 4 correspond aux liens. Deux petites boîtes de dialogue vous demanderons l'adresse (URL) et le titre du lien. Le résultat dans l'éditeur ressemble à cela : [Texte du lien](http://adresse-du-site.fr "Titre du lien") Autres raccourcis typographiques Nous pouvons en plus de ces mises en formes typographiques ajouter des images et des liens vers d'autres pages du site. Les panneaux Pages et Medias De chaque côté de votre écran, vous trouvez un onglet. A gauche celui des 'PAGES' et à droite, celui des 'MEDIA'. En cliquant sur l'onglet 'PAGES', vous ouvrez celui-ci. Vous pouvez alors faire glisser une page dans votre texte pour créer un lien vers cette page. Site internet CDF57 - Manuel Rédacteur - version 06/12/10 - page 7/18
Vous trouvez alors dans votre éditeur le code qui va générer un lien : [Contact](page:6) Vous pouvez par exemple le transformer en : [Contactez nous!](page:6 "Lien vers le formulaire de contact") NB : la dernière partie en gras n'est pas obligatoire, mais peut aider à expliquer vers où mène le lien. Vous pouvez faire de même avec le panneau MEDIA situé à droite de votre écran. La vous obtenez un code de type : Ce code seul affichera votre image d'une manière assez basique. Nous devons lui donner un peu plus de "style". Première chose, ajouter un texte alternatif à cette image. A l'origine ce texte est conçu pour les lecteurs ne restituant pas les images (lecteur braille par exemple). Ceci doit permettre l accessibilité du site, c'est à dire accessible au plus grand nombre sans présager du mode d'accès. Deuxième chose, les moteurs de recherche tiennent compte de tous les mots rencontrés sur les site, que ce soit dans les titres, les textes, les nom d'image et donc aussi dans les texte alternatifs des images. Dans la pratique, il est bon de compléter ce lien comme suit : Là on a placé deux mots clés et cela ne peut être que bénéfique vis à vis des moteurs de recherche. Site internet CDF57 - Manuel Rédacteur - version 06/12/10 - page 8/18
Nous pouvons également indiquer une taille d'affichage pour notre image. Cela permet de rétrécir des images qui seraient trop grandes, car si notre image fait 1024x800 pixels elle risque d'écraser un peu notre texte. Pour cela, il suffit d'ajouter : Ce qui signifie que notre image sera redimensionnée à 150 pixels de large et que sa hauteur sera calculée automatiquement. Site internet CDF57 - Manuel Rédacteur - version 06/12/10 - page 9/18
Là notre image est bien redimensionnée, il ne reste plus qu'à lui donner un style afin qu'elle s intègre au texte correctement. Notre code devenant : Notez bien la syntaxe avec un point devant.imgleft Pour coller votre photo sur la droite du texte il suffit de faire : Site internet CDF57 - Manuel Rédacteur - version 06/12/10 - page 10/18
Voilà. Vous maîtrisez maintenant 90% de ce qu'il y a à savoir pour éditer votre site. Les contenus structurés Le précédent chapitre évoquait les contenus "isolés" car non rattachés à une structure, a un modèle comme disent les informaticiens. Le reste de notre contenu est donc rattaché à un modèle, en fait plusieurs : les articles, les formations, les sessions de formations et les clients. Ajouter et modifier ces contenus se fait à partir de l'administration. Les articles Qui sommes-nous et Centre de formation sont à l'heure actuelle les seules pages construites sur ce modèle. Ce type de page se retrouve dans le menu. Ajoutons un nouvel article depuis l'interface d'administration. Dans le menu Contenu choisir Article Site internet CDF57 - Manuel Rédacteur - version 06/12/10 - page 11/18
Vous arrivez sur la liste des articles existant. Pour en créer un nouveau : cliquez sur Ajouter. Pour éditer un article existant : cliquez sur le titre de l'article. Créons un nouvel article Ajouter 1. Titre de l'article qui apparaîtra dans le menu de gauche. Pas de mise en forme possible (gras, italique,...) 2. Activation de l'article. Si votre article est en cours de rédaction et que vous ne souhaitez pas qu'il apparaisse sur le site, décochez cette case. 3. Introduction de l'article. Comme pour les pages isolées, vous pouvez ici utiliser les raccourcis typographiques pour styler votre texte. 4. Prévisualisation de l'introduction. Ne reflète pas tout à fait la mise en Site internet CDF57 - Manuel Rédacteur - version 06/12/10 - page 12/18
5. 6. 7. 8. 9. page finale sur le site mais donne de bonne indications tout de même. Description ou corps de l'article Prévisualisation du corps de l'article Boutons d'enregistrement Panneau des PAGES du site Panneau des Medias Une fois votre article terminé vous pouvez choisir entre les quatre boutons d'enregistrement. Enregistrer et retourner à la liste donne ceci : Notre article apparaît maintenant dans le menu de gauche. Les Formations Le modèle des formations est un peu plus complexe. Il comprend, d'une part, la description complète des formations avec des document associés et, d'autre part, le calendrier des formations. Voyons tout d'abord les formations à proprement parler. Toutes les formation sont rattachées à une catégorie de formations. Accessible par le menu Contenu Catégories de Formations Pour ajouter ou modifier une formation : menu Contenu Formations Site internet CDF57 - Manuel Rédacteur - version 06/12/10 - page 13/18
1. Nom de la formation. En toutes lettres 2. Activation de la formation. Si vous décochez cette formation, sa description et toutes les sessions du calendrier son desactivées et non visibles sur le site. Notez qu'elles ne sont pas supprimées et peuvent être réactivées. 3. Abréviation de la formation 4. Catégorie de la formation 5. Introduction 6. Prévisualisation de l'introduction 7. Description 8. Prévisualisation de la description 9. Boutons d'enregistrement Toutes les formations apparaissent dans le menu de gauche, sous la catégorie dont elles font partie. Les sessions de formation Deuxième partie du modèle des formations : le calendrier des session de formation. Site internet CDF57 - Manuel Rédacteur - version 06/12/10 - page 14/18
Catégories de formations Formations Sessions de Formation Contacts de formations Nos différentes listes d'objets sont rattachées comme l'indique ce schéma. Les contacts de formation sont une liste de contact pouvant être attachés à une session de formation. Voyons la gestion des sessions de formation qui constituent notre calendrier. Depuis le menu Contenu Sessions de formation 1. Formation pour laquelle on créé une session 2. Activation. Si décochée, cette session ne sera pas visible sur le site 3. Description de la session. Indiquez les spécificité de la session, sachant que toutes les caractéristique de la fiche formation sont reprises. 4. Prévisualisation de la Description 5. Lieu de la session ex : Centre de Formation CDF 57 6. Ville de la session 7. Nombre de places disponibles 8. Date et heure de début de session 9. Date et heure de fin de session 10. Contact pour cette session Site internet CDF57 - Manuel Rédacteur - version 06/12/10 - page 15/18
Les clients Menu Contenu Clients 1. 2. 3. 4. 5. 6. 7. 8. Nom du client Actif, si décoché, le client n'est pas visible sur le site Site web du client (http://www.toto.com) Mis en page d'accueil. Si coché, le client apparaît sur la page d'accueil. Sinon seulement dans la liste qui figure sur la page nos clients. Logo du client Description des prestations effectuées par le CDF57 pour le compte du client Prévisualisation Boutons d'enregistrement. Trier les éléments structurés Tous les éléments structurés (articles, formations, session, ) apparaissent à un moment ou à un autre sous forme de list. Les articles sont par exemple listés dans la parties haute du menu de gauche. Si nous voulons changer l'ordre de ces articles, il suffit de leur appliquer un tri. Depuis le menu Contenu Articles Une fois sur la liste des Articles cliquez sur Triez Site internet CDF57 - Manuel Rédacteur - version 06/12/10 - page 16/18
Réordonnez les éléments de votre liste comme vous le souhaitez puis cliquez sur Enregistrer les modifications. Pour les formations dans le menu de gauche il ne faut pas oublier que nous avons une représentation de Catégories de Formation qui comprennent elles même des formations. Donc selon l'élément à changer de place, il faut savoir à quel type il appartient. Formation premier secours est une catégorie et PSC1 et une formation. NB : Le calendrier est lui classé par date. Les medias En dehors des clients pour lesquels on attribue spécifiquement une image lors de la création, les contenus peuvent se voir adjoindre n'importe quel type de média provenant du panneau MEDIA. La gestion de ces médias se fait via le menu OutilS Medias Dans l'écran de gestion des médias, vous pouvez gérer des dossiers et des document images ou doc, pdf. Les noms de fichiers doivent répondre aux normes suivantes : seulement des minuscules ou des chiffres pas d'autres caractères que le tiret ( ) ou l'underscore (_) les extension en minuscule (jpg, doc, pdf) Tout fichier ne répondant pas à ces normes est automatiquement renommé lors du chargement sur le serveur. De même, la taille maximum des images est limitée automatiquement lors de l'envoi sur le serveur à 800x600 pixels. Site internet CDF57 - Manuel Rédacteur - version 06/12/10 - page 17/18
Fiche pratique Editer Accueil et Mentions légales Lien "Aller sur le site" puis cliquer sur le crayon Editer tous les autres contenus Menu Contenu Articles, Formations, Clients Raccourcis typographiques ## Titre H2 ### Titre H3 #### Titre H4 **Du texte en gras** _Du texte en italique_ Liens vers un site externe [Le site de la FNMNS](http://www.fnmns.org/ "Lien vers le site de la FNMNS") La partie en gras n'est pas obligatoire. vers une page du site Faire glisser la page depuis le panneau latéral Pages [Contactez nous!](page:6 "Lien vers le formulaire de contact") Media (Images et documents) Images et documents sont gérés à partis du menu Outils Medias Faire glisser un media depuis le panneau latéral MEDIA vers votre champ d'édition..imgRight pour placer le media sur la droite du texte Site de préproduction (disparaîtra lors de la mise en production) : http://fnmns57.pygmeeweb.com Administration de préproduction : http://fnmns57.pygmeeweb.com/admin.php Site de production : http://fnmns-cdf57.fr Administration de production : http://fnmns-cdf57.fr/admin.php Contact de support : support@pygmeeweb.com - +33 675 372 044 (David) Site internet CDF57 - Manuel Rédacteur - version 06/12/10 - page 18/18