Les images de vos articles Joomla

La 1ère chose à savoir c'est comment fonctionne l'insertion d'images dans un article Joomla. Au moment d'insérer une image dans votre article, Joomla vous demande de "Parcourir le serveur" afin de la faire apparaitre. Il est donc important d'avoir transférer au préalable vos images sur le serveur via votre client FTP (Filezilla par exemple). Ce dernier vous permet d'accéder aux dossiers de votre site web et tout particulièrement le dossier images. Par défaut, en cliquant sur "Parcourir le serveur", vous vous retrouverez dans le dossier "stories" qui lui-même se trouve dans le dossier "images" à la racine de votre site. Je vous conseille donc de placer vos images dans le dossier "nomdevotresite/images/stories".

Il existe un autre moyen de transférer vos images dans le dossier "images" de votre site web. En effet, vous pouvez passer par CKEditor (éditeur qui s'installe comme une extension) en cliquant sur "Parcourir" en bas de la fenêtre qui apparait lorsque vous cliquez sur "Parcourir le serveur" (voir image ci-dessous). De cette manière, vous pourrez envoyer une image se trouvant sur votre ordinateur vers votre serveur. Seul bémol à cette solution, vous ne pouvez transférer qu'une seule image à la fois donc je vous conseille de passer par Filezilla si vous avez plusieurs images à transférer.

Si vous ne souhaitez pas que toutes vos images soient en vrac dans le dossier "stories", alors vous avez la possibilité de créer de nouveaux dossiers afin de mieux vous organiser. Je me base sur Filezilla mais je pense que pour les autres clients FTP, le principe reste le même. Le mieux est de se placer dans le dossier "nomdevotresite/images", de faire un clic droit et de choisir "Créer un dossier". Par exemple, un nouveau dossier "logos" qui contiendrait toutes les images représentant un logo. Dernière chose, il est également possible de créer un nouveau dossier en passant par FCK editor, il suffit de cliquer en bas de la fenêtre d'importation sur "Create New Folder".

Si vous avez opté pour le mode d'organisation mentionné précédemment, alors il peut s'avérer utile de modifier la destination du bouton "Parcourir le serveur". En effet, par défaut, vous arrivez dans le dossier "stories", ce qui n'est plus pertinent si vous avez créé vos nouveaux dossiers dans "images". Pour ce faire, vous devez vous rendre dans "Composants > CKEditor" puis cliquer sur l'onglet "File Browser Settings". Une fois dans cet onglet, le paramètre à modifier s'appelle "Images path" dans le cadre "Ressource Types Configuration", écrivez à la place de "images/stories" "images" tout court (voir image ci-dessous).

Maintenant que vous savez transférer vos images vers votre serveur, je vais vous expliquer comment les faire apparaitre dans vos articles. Vous allez voir que cela est très simple. Je vous rappelle que j'utilise FCK editor qui est beaucoup plus performant que TinyMCE, l'éditeur par défaut dans Joomla. Je vous conseille donc grandement de l'installer.

Une fois sur la page d'édition d'un article, placez votre curseur à l'endroit où vous voulez placer l'image puis cliquez sur cet icône . Ensuite, cliquez sur "Parcourir le serveur" puis servez-vous de l'explorateur pour trouver l'image à insérer, une fois que vous l'avez repérée cliquez dessus pour l'insérer.

Maintenant que votre image est insérée dans l'article, il est possible entre autre d'en ajuster la taille et la disposition par rapport à votre texte. Pour accéder à ces paramètres, il suffit de cliquer sur l'image puis sur l'icône

Juste en dessous de l'adresse de l'image, vous pouvez écrire un texte alternatif, ensuite vous avez la largeur et la longueur, puis les paramètres pour appliquer une bordure et enfin, l'alignement qui vous permet de placer comme vous le souhaitez votre image par rapport au texte.

Pour finir ce tutoriel, je vais expliquer comment insérer un lien dans une image. Il suffit de cliquer sur l'icône et de copier/coller l'adresse de votre lien dans le champ "URL" (voir image ci-contre).

Dans l'onglet "Destination", vous pouvez déterminer si en cliquant sur l'image, une nouvelle fenêtre (ou onglet) s'ouvre ou si l'internaute reste sur la même page. Il est également possible de faire apparaître le contenu du lien dans un popup. Enfin en cliquant sur "Parcourir le serveur", vous pouvez faire un lien vers une autre image, de plus grande taille par exemple.