K2EDITEUR. Edition des éléments Agence Digitale tous droits de reproduction interdits sans autorisation

Transcription

1 K2EDITEUR Edition des éléments 2014 Agence Digitale tous droits de reproduction interdits sans autorisation Page n 1/24 Page n 1/8

2 AVANT-PROPOS UNE DOUBLE OBLIGATION : FAVORISER LA LISIBILITE ET LA COMPREHENSION DE VOS CONTENUS POUR LES INTERNAUTES ET FACILITER LEUR INDEXATION PAR LES MOTEURS DE RECHERCHE Qu'il s'agisse de pertinence au niveau de la lisibilité des contenus, ou de leur structuration pour favoriser le référencement, la démarche est la même : proposer une organisation logique de vos articles afin de faciliter une lecture transversale de vos contenus, tout en indiquant aux moteurs de recherche un plan détaillé de leur structure. VOTRE MISSION : UTILISER AU MIEUX LES FONCTIONNALITES DE L'EDITEUR K2 POUR VOUS CONCENTRER SUR LA STRUCTURATION DE VOS CONTENUS L'éditeur K2 va vous permettre d'intégrer en toute simplicité des contenus (éléments) sur le site internet de la commune. Vous n'aurez pas besoin de vous pencher sur les questions de mise en forme, dans la mesure où celle-ci est gérée par un jeu de feuilles de styles qui va permettre d'automatiser le formatage de vos contenus en fonction de leurs attributs : titres, sous-titres, liens, interlignage, etc... tout les éléments de styles consitutifs de la charte graphique du site internet sont préformatés de sorte à ce que vous n'ayez plus qu'à vous concentrer sur la rédaction et le plan de vos contenus. Remarque : seuls les styles HTML de base (graisse, italiqué, soulignage...) sont autorisés de manière à garantir une cohérence graphique sur l'ensemble du site Agence Digitale tous droits de reproduction interdits sans autorisation Page n 2/24 Page n 2/8

3 Accès aux éléments K2 Cliquez sur l'icône «Eléments» pour accéder à la liste des éléments K2. Vous pouvez aussi cliquer directement sur l'icône «Ajouter un nouvel élément» pour accéder directement à la page de création d'un élément Agence Digitale tous droits de reproduction interdits sans autorisation Page n 3/24 Page n 3/8

4 RECHERCHE ET CREATION D'UN ELEMENT Recherche : Pour rechercher un élément, indiquez dans le champs «Filtrer» le nom ou une partie du nom de l'élément recherché. Pour faciliter la recherche vous pouvez aussi vous aider des sélecteurs de tri : «Catégorie, état, utilisateur...» Création : Pour créer un nouvel élément, cliquez simplement sur le bouton vert nouveau 2014 Agence Digitale tous droits de reproduction interdits sans autorisation Page n 4/24 Page n 4/8

5 CREATION D'UN ELEMENT K2 Titre et catégorie : Indiquez le titre de l'élément Sélectionnez sa catégorie Publié : «oui» ou «non» pour que l'élément soit mis en ligne sur le site dès son enregistrement. Le contenu : Depuis l'éditeur de K2, vous pouvez mettre en forme vos textes, avec différents styles tels que 'la graisse, l'italique, l'alignement 2014 Agence Digitale tous droits de reproduction interdits sans autorisation Page n 5/24 Page n 5/8

6 Intégrer du texte depuis un logiciel tiers : Lorsque vous copiez du texte depuis un logiciel tiers tel que word, il se peut que celui-ci colle aussi du code non conforme avec les langages web. Outre les erreurs que peuvent produire ses codes, ils modifieront aussi les styles de l'interface grapghique du site (interligne, taille des polices, couleurs ) Pour éviter d'intégrer ce code il vous faudra lors d'un copier coller, utiliser la fonction «effacer la mise en forme» disponible dans le menu «format» de l'éditeur. Titres et paragraphes Différents styles de titres sont à votre disposition pour vos contenus. Pour cela on utilise en web des balises heading (H1, H2, H3, Hn...). Le H1 est réservé au titre du site et le H2 au titre des articles. Pour les sous-titres, vous pouvez utiliser les balises H3, H4, H5. en respectant leur hiérarchie. L'éditeur dispose d'un bouton pour intégrer facilement ces balises sans avoir à vous soucier du code HTML. Sélectionnez votre titre et cliquez sur le menu «Paragraphe» puis choisissez le style à appliquer Agence Digitale tous droits de reproduction interdits sans autorisation Page n 6/24 Page n 6/8

7 L'image d'introduction Vous pouvez utiliser une image d'introduction pour vos éléments, celle-ci sera automatiquement disposée en haut de votre contenu et s'adaptera à la largeur de votre écran. Depuis l'éditeur, allez dans l'onglet Image, choisissez d'uploader l'image directement depuis votre ordinateur ou si elle est déjà disponible sur le serveur, cliquez sur «parcourir le serveur». Depuis le bouton «parcourir le serveur» vous avec accès à l'arborescence des images stockées sur le serveur, vous pouvez également créer des dossier et importer de nouvelles images Agence Digitale tous droits de reproduction interdits sans autorisation Page n 7/24 Page n 7/8

8 Géolocalisation d'un élément Vous avez la possibilité d'ajouter un marqueur GPS à vos éléments afin de les localiser sur une carte Google Maps Agence Digitale tous droits de reproduction interdits sans autorisation Page n 8/24 Page n 8/8

9 Localisation et récupération des coordonnées GPS sur Google Maps Pour placer un repère sur Google Maps, il suffit d'un clic maintenu sur l'endroit voulu pour voir apparaître un cercle autour de notre curseur comme sur l'image. Puis il suffit de récupérer les coordonnées sur le coin supérieur gauche de la fenêtre Agence Digitale tous droits de reproduction interdits sans autorisation Page n 9/24 Page n 9/8

10 Intégration des coordonnées dans l'élément Il ne reste plus qu'à copier les données GPS dans les champs et à enregistrer l'élément pour générer la carte Gmaps. Ajout d'images dans le corps d'un élément K2 Pour l'ajout d'images d'illustration dans un élément, positionnez le curseur à l'endroit où vous voulez intégrer votre image dans l'éditeur, puis cliquez sur le bouton «Image» en bas de l éditeur de texte. Une nouvelle fenêtre s'ouvre Agence Digitale tous droits de reproduction interdits sans autorisation Page n 10/24 Page n 10/8

11 Il vous suffit de parcourir les répertoires correspondants à la catégorie parente de votre élément en cliquant sur les dossiers. Cliquez ensuite sur l'image de votre choix pour la préparer à l'insertion puis cliquez sur le bouton «inséré» en haut de la fenêtre. Upload d'une nouvelle image Pour uploader une image qui n'est pas présente sur le serveur, il faut cliquer sur le bouton parcourir qui va vous servir à naviguer dans les dossiers de votre ordinateur. Après avoir sélectionné le fichier à uploader, il suffit de cliquer sur «Démarrer l'envoi» pour lancer l'upload. Votre image uploadée sera disponible dans le répertoire où vous vous trouvez, il suffira de cliquer sur celle-ci et de valider en cliquant sur «Insérer». NOTE IMPORTANTE : Contrairement aux images principales de K2, les images que vous intégrerez de cette manière dans le corps des éléments devront impérativement être redimensionnées pour pouvoir s'afficher correctement sur votre template. (max 740 px de large) Page n 11/24 Page n 11/8 Réponse à la consultation 2014 Agence Digitale tous droits de reproduction interdits sans autorisation

12 Ajout d'une galerie photo dans vos éléments K2 avec Flickr Obtenir l'url de vos albums Flickr pour les intégrer dans un élément Pour afficher le contenu de votre album Flickr sur votre site, vous devez vous rendre sur le site flickr.com et accéder à la liste de vos albums Flickr en cliquant sur le lien 'Albums' Ensuite vous pouvez cliquer sur l'album que vous souhaitez faire apparaître. Une fois cette action effectuée, il vous faut copier l'intégralité du lien Flickr dans la barre d'adresse en haut de votre navigateur : L'url que vous copiez depuis la barre d'adresse doit être du type : en fonction de l'utilisateur/sets/change en fonction de l'album Si cela n'est pas le cas, c'est que vous n'avez pas accédé à l'album en cliquant sur le lien 'Album' de Flickr Agence Digitale tous droits de reproduction interdits sans autorisation Page n 12/24 Page n 12/8

13 Insertion du lien copié dans un élément Dans l'administration de Joomla, choisissez l'article dans lequel vous souhaitez voir apparaître votre album Flickr et cliquez sur le bouton Flickr juste en dessous de votre éditeur : Insertion du lien copié dans un élément Une nouvelle fenêtre apparaît à votre écran où vous pouvez coller le lien Flickr que vous venez de copier : Vous pouvez également modifier le nombre d'images à afficher dans votre album ainsi que la taille des images normales et agrandies. Il ne vous reste plus qu'à cliquer sur le bouton «insérer la balise Flickr» et enregistrer l'élément pour générer votre album photo Agence Digitale tous droits de reproduction interdits sans autorisation Page n 13/24 Page n 13/8

14 Insertion de pièces jointes Pour insérer des pièces jointes à la fin de vos éléments K2, il suffit ce cliquer sur l'onglet «Pièces jointes» en haut de l éditeur de texte. D'un clic sur «Ajouter un champ de pièce jointe» un formulaire va s'ouvrir en dessous pour le paramétrage de la pièce jointe. En cliquant sur le bouton «Parcourir», naviguez parmi les répertoires de votre ordinateur pour sélectionner le fichier désiré et validez en cliquant sur «Ouvrir». Puis remplissez les champs disponibles (le titre en particulier, sinon le nom de votre fichier fera office de titre). Si vous souhaitez chercher un fichier déjà uploadé sur le serveur, vous pourrez le retrouver en cliquant sur «ou sélectionnez un fichier sur le serveur» 2014 Agence Digitale tous droits de reproduction interdits sans autorisation Page n 14/24 Page n 14/8

15 Pour l'ajout de plusieurs pièces jointes, il suffit de cliquer autant de fois sur le bouton «Ajouter un champ de pièce jointe», et de paramétrer chaque pièce jointe. N'oubliez pas d'enregistrer l élément en cliquant sur le bouton «Enregistrer» en haut de la fenêtre. Votre pièce jointe sera liée à votre élément en fin de page Agence Digitale tous droits de reproduction interdits sans autorisation Page n 15/24 Page n 15/8