Aide pour l'editeur d'article sous info-lux
| Objectifs - info-lux |
Afin de vous permettre de personnaliser votre contenu, Joomla est livré avec un éditeur WYSIWYG (what you see is what you get) qui fonctionne un peu comme Microsoft Word mais avec moins de fonctionnalités.
Dans ce tutoriel, nous allons parcourir quelques-unes des caractéristiques de cet éditeur.
Nous allons tout d’abord créer un nouvel article, pour ce faire veuillez cliquer sur le bouton Ajouter un nouvel article dans votre panneau d’administration ou par le menu Contenu puis Gestion des articles et enfin cliquez sur le bouton Nouveau. Comme vous pouvez le constater, au dessus de la zone de saisie vous retrouvez des boutons familiers pour ceux qui ont déjà utilisé un traitement de texte comme Word. Ceux-ci vous permettrons de formater le contenu de votre articles sans avoir besoin de connaitre le code HTML.
Vous pouvez commencer par exemple, par ajouter un titre dans le contenu de votre article. Pour ce faire, veuillez insérer du texte, le sélectionner, puis choisir dans la deuxième liste déroulante qui s’appelle Format, l’option Heading 1 qui correspond au format du titre 1 défini dans le système.
Dans un deuxième temps, vous pouvez par exemple utiliser les fonctionnalités de type puce ou numérotation ou alors les types de format gras, italique ou souligné. Pour les curieux ou les personnes ayant des notions de l’HTML, il existe un bouton HTML vous permettant d’afficher dans une autre page, le contenu HTML de votre article. Ce code peut directement être modifié dans cette fenêtre et le bouton Update vous permet de valider vos modifications et de retourner à votre page d'édition.
Cet éditeur portant le nom de TinyMCE possède beaucoup de fonctionnalités qui ne vous seront pas toutes utiles mais dont certaines comme l'insertion d'un tableaux vous permettrons de créer des articles avec un très bon rendu final. Afin de parcourir l'ensemble des caractéristiques et d'acquérir des compétences, je vous laisse faire vos propres essais et triturer le contenu de votre article.
Ajouter un lien externe à un article
Parfois, nous avons besoin de créer un lien dans un article pointant sur un autre site. Joomla vous permet d’effectuer cette opération au travers de l’éditeur WYSIWIG que nous avons utilisé dans le tutoriel précédent.
Veuillez tout d’abord ouvrir un article existant, sélectionner le mot ou le texte qui contiendra le lien puis cliquer sur le bouton Insert/edit link affichant une icône ressemblant à un maillon de chaine. Une nouvelle page s’ouvre contenant dans l’onglet général les principales options qui sont :
- Link URL : c’est ici que vous allez insérer l’adresse du site Internet avec les caractères, ne pas oublier de rajouter au début de l’URL les caractères « http://www. »
- Target : détermine quelle sera la fenêtre qui s’ouvrira au moment de cliquer sur le lien. En effet, l’option Open in this window / frame remplacera l’entier du contenu de votre page par la page cible tandis que l’option
Open in new window (_blank) ouvrira une nouvelle fenêtre. Les autres options peuvent être utilisées si votre site contient des frames ce qui se fait de moins en moins
Pour supprimer le lien du texte, veuillez positionner votre curseur à l'intérieur de celui-ci et cliquer sur le bouton Unlink ressemblant cette fois à une chaîne brisée qui se trouve à droite du bouton précédent. Cette action supprimera définitivement le lien que vous avez inséré auparavant.
Ajouter une image à un article Joomla
Une image valant mille mots, vous serez amené un jour ou l’autre à vouloir ajouter des images à votre contenu. Joomla possède une fonctionnalité d’insertion d’images qui vous permettra de vous assister durant cette opération.
Veuillez tout d’abord ouvrir un article et positionner votre curseur à la fin de votre texte. Cliquez maintenant sur le boutonImage se trouvant en bas à droite de la zone de saisie. Une nouvelle page s’ouvre contenant dans la zone supérieure une arborescence de répertoires avec leurs documents de type image. Au dessous de cette zone, on retrouve les propriétés de l’image sélectionnée comme :
- URL de l’image : le contenu de ce champ est automatiquement inséré par Joomla et contient le chemin interne du fichier.
- Description de l’image : le texte inséré dans ce champ sera utilisé par les moteurs de recherche pour indexer vos pages mais également par les personnes malvoyantes. La description n’est pas obligatoire mais fortement conseillée.
- Image Title : comme pour la description, le titre de l’image n’est pas obligatoire. Le contenu de se champ sera visible lorsque vous passerez votre curseur au dessus de l’image. De plus, vous avez la possibilité d’afficher ce texte en dessous de l’image en cochant la case Légende qui se trouve juste à droite.
- Aligner : les options Gauche et Droite de cette liste déroulante sont utiles si vous désirez aligner votre image à gauche ou à droite par rapport au texte.
Toutes ces options peuvent pas la suite être éditées, il n’est donc pas nécessaire à ce niveau de tout remplir.
La troisième et dernière partie de cette page vous permet d’ajouter vos propres images à celles déjà existantes dans Joomla. Pour ce faire il suffit de cliquer sur le bouton Parcourir les fichiers, sélectionner vos images qui se trouvent sur votre ordinateur puis cliquer sur le bouton Lancer le transfert pour les envoyer sur le serveur hébergeant votre site. Si tout c’est bien passé, vous devriez voir s’afficher ces images dans la première partie de cette page.
Voila, pour insérer une image, il ne vous reste plus qu’à la sélectionner puis cliquer sur le bouton Insérer en haut à droite
Vous pouvez directement à l’intérieur du champ de saisie modifier la taille de l’image. Pour ce faire, il suffit de sélectionner l’image puis l’agrandir ou la rétrécir à l’aide des petits carrés se trouvant tout autour de l’image. Mais vous pouvez également changer les propriétés de l’image en sélectionnant à nouveau celle-ci et cliquer sur le bouton Insert/edit imagecontenant une icône ressemblant à un arbre. Dans l’onglet général on retrouve les paramètres URL, Description et Titledécrits ci-dessus et l’onglet Appearance contient les paramètres :
- Alignment : quel est l’alignement de l’image par rapport au texte
- Dimensions : pour modifier les dimensions de l’image, je vous conseille de garder l’option Constrain proportions permettant de garder les proportions de l’image
- Vertical space : si vous voulez ajouter de l’espace en haut et en bas de l’image
- Horizontal space : si vous voulez ajouter de l’espace à gauche et à droite de l’image
- Border : si vous voulez ajouter un bordure à l’image
Avant de quitter cette fenêtre, ne pas oublier de cliquer sur le boutonUpdate afin de valider vos modifications
Mis à jour ( Vendredi, 09 Octobre 2009 20:55 )
