Rédiger des articles

Créez un article

Il est temps de rédiger notre première critique de film. Pour cela, déroulez le menu Contenu, Gestion des articles. Cliquez sur Nouveau. Dans Titre, saisissez le titre de votre article, par exemple Gainsbourg (vie héroïque). Cochez l’option Page d’accueil : Oui. Dans la liste Section, choisissez Critiques de Film et dans Catégorie : 2010. Dans la zone principale de l’éditeur, saisissez votre texte normalement. Ne vous préoccupez pas pour l’instant de la présentation. Sachez toutefois que lorsque vous utilisez la touche Entrée, un nouveau paragraphe est automatiquement créé et un espace vide est laissé entre les deux paragraphes. Pour revenir à la ligne sans créer d’espace vide, utilisez la combinaison de touche Maj + Entrée. Une fois le texte saisi, vous pouvez en faire une prévisualisation en cliquant sur l’icône correspondante.

Utilisez les styles

Sauf s’il s’agit de ne souligner que quelques mots en les mettant, par exemple, en caractères italiques ou gras, nous vous conseillons d’utiliser systématiquement les styles de caractères, afin d’assurer une cohérence visuelle à tous vos articles. Le principe des Templates (styles) est en effet le suivant : quand vous changez les caractéristiques d’un style (taille et couleur des caractères, espacement des paragraphes…), tous les textes affectés de ce style sont immédiatement modifiés. Notez que ce principe est le même qu’avec les traitements de texte. Pour créer des titres et des sous-titres, sélectionnez celui-ci puis optez pour la liste déroulante Paragraphe. Choisissez par exemple Titre 1.

Insérez le lien vers une image d’un site…

Vous avez vu une image dans un autre site et souhaitez l’insérer dans votre article. À condition de disposer des droits nécessaires, la chose est extrêmement simple. Pour cela, rendez-vous sur la page Web où figure l’image et faites un clic droit sur cette dernière. Sous Firefox, sélectionnez la commande Copier l’adresse de l’image. Avec Internet Explorer, choisissez la commande Propriétés, sélectionnez l’intégralité du contenu de la ligne Adresse (URL) et copiez-la (Ctrl + C) dans le Presse- papier. Retournez à l’édition de votre article. Cliquez sur l’icône Insérer, Éditer une image (un arbre vert) située au milieu de la seconde ligne d’icônes. Dans la ligne URL de l’image, collez (Ctrl + V) l’adresse. Saisissez dans Description un petit texte explicatif, utile aux moteurs de recherche. L’image s’affiche. L’onglet Apparence vous permet de définir la taille de l’image mais également l’Alignement. Validez en cliquant sur Insérer.

…Ou incorporez l’image proprement dite

Avec le procédé décrit au paragraphe précédent, l’image n’est pas stockée sur votre site Web. Si vous voulez insérer une image dans votre site, vous devez commencer par l’ajouter à vos médias, l’uploader. Si vous pouvez effectuer cette opération via le Gestionnaire de médias (menu Site) vous pouvez également la lancer depuis la fenêtre d’édition d’un article. Cliquez pour cela sur l’icône Image située tout en bas de la page. Cliquez sur le dossier Films afin d’ouvrir ce dossier. Cliquez sur le bouton Parcourir et sélectionnez le fichier sur votre disque dur. Validez en cliquant sur Ouvrir puis sur Lancer le transfert. Le fichier sera alors copié sur le site et sera, dès lors, utilisable dans n’importe quelle page. Pour l’insérer dans cet article, cliquez sur l’image puis sur le bouton Insérer. Vous pouvez déplacer à tout moment l’image à l’aide d’un glisser-déplacer de la souris. Pour en modifier l’alignement, faites un clic droit sur l’image et choisissez la commande Insérer, Éditer une image. Vous affichez alors l’interface présente à l’étape précédente.

Améliorez la présentation

Si vous vous contentez d’utiliser les options d’alignement classiques (celles relatives au texte ou aux images), vous constaterez rapidement qu’il est difficile de positionner précisément des images sur une page. Ainsi, pour créer un bandeau contenant cinq images les unes à côté des autres, le travail n’est pas aussi aisé car, dès que la fenêtre sera un peu étroite, les images passeront à la ligne. Pour éviter cela, la plupart des concepteurs de sites Web utilisent la fonction Tableau qui permet de découper virtuellement une zone en cases, que l’on remplit avec du texte ou des images. Nous allons créer ici un tableau de deux lignes et deux colonnes que nous redimensionnerons ensuite. Placez-vous au début de l’article puis cliquez sur Insérer un tableau située en tête de la troisième ligne d’icônes. Dans Largeur, indiquez 100 % afin que le tableau occupe toute la largeur disponible. La valeur 0 dans Bordure permet de ne pas tracer de contour visible. Pour l’instant, saisissez 2 dans Bordure afin de matérialiser celle-ci, nous la supprimerons ensuite. Validez en cliquant sur Insérer.

Utilisez les cellules du tableau

Placez-vous dans la cellule située en haut à gauche. Saisissez, par exemple, Année de production. Dans la cellule située en haut à droite, saisissez 2009. De même saisissez, à la seconde ligne, Réalisateur et Joann Sfar. Nous allons ajouter une troisième colonne avant la première. Faites un clic droit dans la première cellule de la première colonne et choisissez la commande Colonne, Insérer une colonne avant. À l’aide d’un glisser-déplacer, positionnez l’image placée à l’étape 04 dans la cellule vide située en haut à gauche. Vous constatez alors que la première ligne du tableau s’est agrandie : en effet, si une cellule est trop petite pour afficher son contenu, elle s’adapte automatiquement. Pour une présentation plus esthétique, il est possible de fusionner les deux cellules de la première colonne, l’image occupant alors l’intégralité de la hauteur disponible. Pour obtenir cet effet, alors que l’image est toujours sélectionnée, cliquez sur l’icône Fusionner les cellules (3e ligne, au centre). Saisissez Colonnes : 1 et Lignes : 2 et validez par Mettre à jour.

Définissez les largeurs de colonnes

Comme nous l’avons vu avec la hauteur de l’image, une cellule occupe au minimum la taille de son contenu (celui-ci n’est jamais tronqué). Par ailleurs, on définit généralement la largeur des cellules en pourcentage de la largeur totale de la page. Nous allons respectivement affecter aux trois colonnes les valeurs 1 %, 49 % et 50 %. Cette astuce permet de faire en sorte que la première colonne fasse juste la taille de son contenu (donc de l’image), les deux autres colonnes se partageant l’espace restant. Cliquez sur l’image puis sur l’icône Propriétés de la cellule. Dans Largeur, saisissez 1 % et validez par Mettre à jour. De même, modifiez les propriétés de la seconde cellule puis de la troisième cellule (de la première ligne), en leur affectant les largeurs 49 % et 50 %. Enfin, cliquez sur l’icône Insérer/Éditer un tableau et redonnez à la Bordure la largeur 0. Si vous avez encore besoin d’afficher les cellules, cliquez sur l’icône Afficher les cadres-lignes des tableaux. Ceux-ci n’apparaîtront pas dans le rendu final, comme vous pouvez le vérifier dans la Prévisualisation.Avec un peu de pratique, vous constaterez que les tableaux permettent de résoudre la plupart des soucis de mise en page de vos articles.

Découpez l’article

De nombreux blogs ne proposent qu’un résumé sur la page principale : quand l’internaute clique sur Lire la suite, il peut alors afficher l’article complet. Vous pouvez utiliser le même principe sous Joomla : placez-vous au niveau de la coupure et cliquez sur l’icône Lire la suite située en bas de la fenêtre. Un trait rouge pointillé apparaît. Cliquez enfin sur Sauver pour enregistrer votre article.

Gérez vos articles

Créez, sur le même principe, plusieurs articles dans différentes sections. Le menu Gestion des articles vous permettra de choisir ceux qui seront ou non Publiés, de modifier l’ordre de ceux-ci ou encore de Supprimer les articles inutiles. Ceux-ci ne seront pas effacés : vous pourrez encore les retrouver via le menu Contenu, Corbeille article. En revanche, une fois effacés de cette Corbeille, ils seront définitivement perdus !

🔴 Pour ne manquer aucune actualité de 01net, suivez-nous sur Google Actualités et WhatsApp.

Stéphane Darget