Il y a quelques jours j’ai brièvement expliqué comment créer sa chaîne, comment rédiger et modifier des articles, et comment uploader ses images. Cette fois nous allons aborder la mise en page qui est extrêmement importante pour mettre en valeur le contenu de vos articles.
L’éditeur de texte
L’éditeur de texte est l’outil qui vous permet de créer et de mettre en page votre article. Même si vous connaissez sûrement la plupart des boutons qui la composent faisons d’abord le tour de la barre d’outils:
1. Revenir en arrière/en avant. Ces flèches permettent d’effacer les dernières modifications apportées à l’article. Vous pouvez aussi utiliser les raccourcis clavier “crtl + z” et “crtl + y”.
2. Pour mettre le texte sélectionné en gras, en italique, pour le souligner ou le barrer. Toutes ces actions peuvent être appliquées ensemble sur le même texte.
3. Pour aligner le texte, une image, ou une vidéo. On peut choisir d’aligner à gauche (c’est l’alignement par défaut), au centre, à droite, ou de justifier le texte (pour qu’il occupe toute la largeur de la page).
1. Permet de choisir un style de texte prédéfini, la police du texte, et la taille du texte.
2. Affiche le texte sélectionné sous forme de liste. Avec choix entre deux types de listes.
3. Indentation du texte et affichage d’une citation.
4. Couleur du texte.
1. Ces boutons permettent d’insérer un élément dans le texte. On peut insérer un lien hypertexte, briser un lien hypertexte, insérer une ancre, insérer une image, insérer des caractères spéciaux, insérer un smiley, insérer une vidéo. Voir plus bas pour le détail de certains de ces éléments.
2. Quatre boutons qui permettent de:
- Insérer une ligne horizontale de longueur et largeur prédéfinie dans l’article.
- Insérer une ligne horizontale paramétrable dans l’article.
- Effacer la mise en forme du texte sur lequel on aura juste cliqué auparavant.
- Afficher les éléments invisibles comme les bordures d’un tableau “sans bordures”.
3. Permet d’insérer un tableau dans l’article et de le personnaliser. Cette partie mérite un article complet.
4. Affiche un aperçu de votre article fini dans une zone que vous pouvez agrandir à volonté.
Insérer un lien
Pour insérer un lien dans un texte, sélectionnez d’abord le texte que vous voulez transformer en lien “cliquable”. Ensuite cliquez sur le bouton lien, le bouton tout en bas à gauche. S’ouvre alors une fenêtre avec plein d’options de configuration réparties sur quatre onglets. L’onglet “General” suffit pour insérer un lien “normal” et dans 99% des cas vous n’aurez pas l’utilité des autres onglets (mais on y reviendra sans doute un jour car ça n’est pas inintéressant). Le champ “Link URL” est le champ principal dans lequel vous ajoutez/collez l’adresse de la page vers laquelle le lien va diriger le lecteur. Le “http://” s’affiche automatiquement. Validez en cliquant sur le bouton “Insert” et c’est fini. Mais avant cela pensez à donner un nom à votre lien dans le champ “Title” même si ça n’est pas obligatoire.
Par défaut le lien s’ouvrira sur la page du navigateur où se trouve votre article, la page sera donc remplacée et l’utilisateur quittera votre chaîne. Si vous voulez que la page du lien soit ouverte dans un nouvel onglet du navigateur choisissez la cible “_blank” dans le champ “Target”.
Pour supprimer un lien dans un texte cliquez simplement sur la zone comportant le lien puis cliquez sur le bouton “Unlink”, le second en bas à gauche de votre éditeur de texte.
Attention: même si dans l’éditeur de texte, les liens apparaissent en couleur et soulignés ça ne sera pas le cas dans le texte publié. Si vous voulez que votre lien soit facilement différentiable du reste du texte pensez à le mettre en couleur ou à souligner le texte.
Notez que vous pouvez assigner un lien à une image comme à du texte. Cliquez simplement sur une image puis sur le bouton de lien pour arriver au même résultat.
Insérer une ancre
Une ancre est similaire à un lien au détail près qu’elle renvoie non pas sur une autre page mais à un endroit précis de votre article. C’est très utile par exemple si vous faites un long article avec un menu en haut de page. Un exemple avec cette page.
Pour insérer une ancre choisissez d’abord l’endroit de la page où vous voulez renvoyer le lecteur simplement avec un clic de souris. Cliquez ensuite sur le bouton en forme d’ancre. Une fenêtre s’ouvre et vous devez choisir un nom pour l’ancre, sans espace ni caractères spéciaux. Dans l’exemple en image ci-dessus j’ai choisi le nom “ancre1”. Lorsque vous validez l’ancre est créée et un petit symbole apparaît dans la page pour marquer l’emplacement de l’ancre; ce symbole sera invisible dans l’article publié.
Pour créer le lien qui renverra vers l’ancre, utilisez la même technique que pour la création d’un lien classique (voir plus haut). Simplement vous remarquerez un champ supplémentaire “Anchors” dans la fenêtre qui s’ouvre. Choisissez dans la liste l’ancre sur laquelle va renvoyer le lien, validez, et c’est fini.
Insérer une image
L’éditeur de texte des chaînes permet de faire beaucoup de choses avec les images mais nous allons voir uniquement l’essentiel pour le moment. Pour insérer une image cliquez sur le bouton images. Une fenêtre à trois onglets s’ouvre, ici seul l’onglet “General” nous intéresse. L’essentiel est de rentrer l’URL de l’image dans le premier champ. Si vous utilisez la fonction d’upload d’images que nous mettons à votre disposition pour les chaînes, l’URL de l’image apparaît sous la miniature de l’image en question dans votre galerie. Vous avez juste à faire un copier/coller. Si l’Url est correcte l’image s’affiche dans la zone de “Preview” lorsque vous quittez le champ “Image URL” en cliquant ailleurs. Les champs “Image Description” et “Title” ne sont pas obligatoires mais on vous conseille de donner un titre et une description à vos images pour plusieurs raisons que nous n’évoquerons pas ici.
Lorsque vous validez avec “Insert” votre image est visible immédiatement dans l’éditeur de texte. En cliquant sur l’image vous pouvez la centrer (c’est souvent mieux de centrer une image), y assigner un lien, ou la redimensionner en cliquant sur un coin et en déplaçant votre souris.
Pour rappel, une image de 700 pixels de large occupe “pile-poil” la largeur d’un article.
Insérer une vidéo
Vous pouvez insérer dans vos articles des vidéos provenant de tous les grands sites de partage de vidéos comme Youtube, Dailymotion, Vimeo et d’autres. C’est très simple. Cliquez d’abord sur le bouton vidéos pour ouvrir une fenêtre avec trois onglets. Vous avez deux méthodes pour insérer une vidéo.
La plus simple est de coller l’adresse de la page comportant la vidéo dans le champ File/URL. Par exemple sur le site Youtube vous trouverez l’adresse de la page en cliquant sur le bouton “Partager” situé sous la vidéo.
Cependant cette solution ne fonctionne pas avec tous les sites et souvent il faudra intégrer une vidéo via l’onglet “Source”. Sur n’importe quel site de partage de vidéos on propose d’intégrer les vidéos sur un site/blog etc. Ça fonctionne aussi pour les chaînes. Pour cela suivez le lien “Intégrer” ou “Embed” sur les sites de type Youtube et copiez le code affiché. C’est un code un peu barbare qui commence normalement par “iframe …” ou “embed …”. C’est ce code qu’il faut ensuite coller dans l’unique champ de l’onglet “Source”.
Avant de valider en cliquant sur “Insert” retournez sur l’onglet “General”. Si vous voulez afficher une vidéo provenant d’un gros site de partage le “Type” de vidéo sera généralement “Flash” (affiché par défaut). Pensez surtout à changer la taille de votre vidéo. Une vidéo peut être affichée avec une largeur de 700 pixels sans sortir de la page. Faire attention à la case “Constrain proportions” qui choisit la hauteur de la vidéo proportionnellement à la largeur rentrée. Souvent cette redimension automatique n’est pas adaptée aux vidéos 16:9. Une vidéo HD de 700 pixels de large par exemple doit être affichée avec une hauteur de 394 pixels ou 395 pixels.
Une fois votre vidéo intégrée dans l’article pensez à la centrer (surtout si elle ne fait pas 700 pixels de large).
Notez qu’en plus de vidéos vous pouvez insérer grâce à ce bouton toutes sortes de contenus comme de la musique ou des jeux Flash.
Dans cet article nous n’avons vu que les fonctions principales de mise en page et vous voyez déjà que les possibilités sont très nombreuses. Faites cependant attention à ne pas en abuser car en voulant faire une mise en page originale on arrive parfois à publier un texte désagréable à lire pour certaines personnes, et plus votre mise en page s’écarte des standards du web et plus vous risquez de perdre des lecteurs.