Ajouter des photos, vidéos, etc., et partager des contenus depuis les réseaux sociaux

Toutes les méthodes qui nous sont connues pour enrichir et enjoliver vos articles ! N’hésitez pas à nous écrire si ce que vous souhaitez insérer n’est pas couvert ici.

A propos des images sur internet, restez conscient.es que ce que vous publiez sera rendu public, et notamment tout un tas de données qui n’apparaissent pas à l’écran si vous n’y prenez pas garde ! Quel que soit le site, il est indispensable de supprimer les métadonnées [1] de vos photos avant publication.

Cette bonne pratique n’étant malheureusement pas encore entrée dans les mœurs, nous avons sur l’ensemble des sites du réseau Mutu automatisé la suppression des données EXIF (métadonnées contenues dans les fichiers images au format TIFF et JPEG). Cela ne doit pas vous empêcher de le faire vous-même, grâce à des logiciels comme Exiftools pour Windows ou Mac, et Mat sur Linux.

Des sites comme celui-ci par exemple permettent de vérifier les métadonnées qu’il peut rester dans vos images.

Consultez Sécurité et anonymat sur MIA pour plus d’infos.

Ajouter un document

Pour partager un tract, une brochure, ou une affiche en bonne qualité pour permettre l’impression, il est possible d’insérer un document dans un article. Pour se faire on peut soit le téléverser, soit l’importer directement d’internet en utilisant le cadre ci-dessous situé dans la colonne à gauche de la zone de saisie de texte de l’article.

Une fois téléversé, le document apparaîtra dans cette même colonne sous la forme suivante :

Il ne reste alors plus qu’à copier la balise <docXXXX|center> à l’endroit où l’on veut faire apparaître le document.

Il est possible de remplacer “center” (centré) par “left” (gauche) ou “right” (droite), mais pour des raisons d’affichages il est souvent préférable de centrer son document.

Ajouter une légende

Pour ajouter une légende à un document, il suffit de cliquer sur l’onglet “Modifier”.

Dans l’exemple ci-dessous, le texte en gras a été inséré dans le champ “Titre”, le reste du texte dans le champ “Description”.

Mineur.es isolé.es exilé.es en danger, le CD 13 hors la loi !
Rassemblement mercredi 26 septembre à 18h30 sur l’esplanade du MUCEM

Il est aussi possible d’ajouter des documents d’autres formats, tel que .doc, .odt, .zip, etc.

Attention : les fichiers pdf [2] et texte (.doc, etc) contiennent eux aussi des métadonnées ! Consultez Sécurité et anonymat sur MIA.

Ajouter une image

Pour la différence entre une image et un “logo”, consultez la page Écrire un article.

Pensez à mettre vos images en format JPEG, PNG, TIFF,... Le format PDF en revanche est géré comme un document en pièce jointe, et ne sera pas perçu comme une illustration.

Un fichier en PDF peut par contre être utile pour faire passer des fichiers de bonne qualité, notamment si c’est un document (tract,....) qui a vocation à être imprimé.

Il vaut mieux mettre des fichiers de petite taille
(mais pas trop petite non plus !) : une image de 2Mo maximum sont largement suffisant. Cela évite de prendre de la place inutilement sur les serveurs. Il n’est pas possible de téléverser des fichiers de plus de 10Mo.

MIA a pour pratique de flouter les visages des personnes sur les photos de manif, d’actions, etc. Si vous le faites vous-même, c’est cool, et c’est pas compliqué !

Attention : les fichiers images contiennent parfois une version miniature de l’image originale dans leurs métadonnées. Pensez donc à supprimer les métadonnées après avoir flouté ou rogné une image.

Depuis internet

Méthode 1 :
Le cadre en haut à gauche ("déposez vos fichiers ici ou cliquez sur ce cadre") permet d’ajouter des images d’un simple "copier-coller".

Vous pouvez copier l’image que vous avez choisie (depuis une autre fenêtre du navigateur, ou une capture d’écran), et survoler ce cadre. Une fois votre souris dessus, faire "ctrl+v" pour coller le contenu du presse papier.

Méthode 2 :
Il est aussi possible d’utiliser le cadre ci-dessous, en sélectionnant “internet” et en y collant l’url de l’image que l’on veut ajouter.

Depuis son ordinateur

Il est aussi possible de cliquer sur l’un des deux cadres mentionnés ci-dessus pour aller chercher un fichier directement sur son ordinateur. Dans ce cas là, il est toujours prudent de penser à effacer les éventuelles métadonnées qui pourraient traîner sur vos images ! Voir Sécurité et anonymat sur MIA.

Intégrer l’image dans le texte

Une fois téléversée, votre image apparaît dans la colonne de gauche de votre article.

Il ne reste alors plus qu’à copier la balise <docXXXX|center> (à privilégier), <imgXXXX|center> ou <embXXXX|center> à l’endroit où l’on veut faire apparaître l’image.

Il est possible de remplacer “center” (centré) par “left” (gauche) ou “right” (droite), cela peut donner des effets intéressant, mais selon la taille de l’image et la taille de l’écran de lecture, cela peut aussi donner un résultat pas terrible. Pour un affichage adapté à tout les supports (écrans, tablettes, mobiles) il est préférable de choisir la balise <docXXX|center>

Ajouter une légende

Comme pour les documents, il est possible d’ajouter une légende à une image, en cliquant sur l’onglet “Modifier”.

Cela donne ce résultat :

Manif antifa du 8 février 2019

Ajouter une vidéo

Il arrive que la vidéo ne s’affiche pas, ou pas correctement, dans l’article une fois enregistré, mais qu’elle marche en mode “Prévisualiser”. L’inverse est aussi vrai. C’est pourquoi il faut vérifier le bon fonctionnement de la vidéo en prévisualisant l’article.

Depuis internet

Il est souvent pratique “d’incruster” une vidéo directement dans le corps de l’article. Il existe pour le moment deux méthode, une stable, et une qui ne marche pas toujours. Vimeo et Youtube sont utilisés comme exemple ci-dessous, mais le principe est le même pour les autres plateformes de partage de vidéos (Dailymotion, etc.).

Méthode 1 : embed

Les sites de partage de vidéos offrent la possibilité d’incruster leurs vidéos sur d’autres sites. Il faut se rendre sur la vidéo et

  1. sélectionner “partager”, ou “share” ;
  2. sélectionner embed
  3. éventuellement choisir les options de partage proposées
  4. copier-coller dans le corps de texte la balise qui est générée, et qui devrait commencer par <iframe... et se terminer par ...</iframe>

Vimeo

étape 1
étape 2, 3 et 4

Appel aux masses from primitivi on Vimeo.

Balise de la vidéo ci-dessus :

Dans l’exemple ci-dessus, la texte du premier paragraphe (entre <iframe src= et </iframe> ) fait apparaître la vidéo, et celui du 2e paragraphe (entre <p><a href= et Vimeo</a>.</p>) fait apparaître le texte « Appel aux masses from primitivi on Vimeo. » On peut donc enlever le 2e paragraphe si on veut la vidéo sans la légende.

Youtube

étape 1
étape 2
étape 3 et 4

Balise de la vidéo ci-dessus :

Méthode 2 : url

À terme, il sera possible d’incruster une vidéo simplement en copiant l’url de la vidéo. Cela est déjà possible, mais ça ne marche pas toujours très bien. Par conséquent il faut absolument tester votre vidéo en mode “Prévisualiser” si vous choisissez cette méthode.

Vimeo

Youtube

Depuis son ordinateur

Il est aussi possible de téléverser directement un fichier vidéo depuis son ordinateur, selon la même procédure que pour d’autres fichiers. À noter que la limite est de 10Mo, ce qui est peu pour une vidéo. Il est donc préférable d’insérer la vidéo depuis une plateforme de partage de vidéo tel que décrit ci-dessus, d’autant plus que le rendu est meilleur .

Une fois téléversé, on peut insérer le document, et le légender comme n’importe quel autre document (voir ajouter un document ou ajouter une image). Il faut sélectionner la balise <docXXXX|center>, qui donne le résultat visible ci-dessous. La balise <embXXXX|center>, qui devrait permettre un rendu similaire à l’insertion de vidéo depuis une plateforme de partage de vidéo, avec un aperçu de la vidéo, n’est pas fonctionnelle.

Appel aux masses

Ajouter une piste son

Depuis internet

Pour ajouter une piste audio depuis une plateforme de partage, il faut sélectionner “internet” dans le cadre “Ajouter une image ou un document”, et entrer l’url dans le champ de saisie qui s’affiche.

Une fois téléversé, on peut insérer le document, et le légender comme n’importe quel autre document (voir ajouter un document ou ajouter une image). Le meilleur rendu en terme d’affichage n’est possible que par la méthode de téléversement d’un fichier depuis son ordinateur (voir ci-dessous).

Audioblog | Dans les murs - CESAÏ ouvre toi !

À noter que certaines plateformes de partage de pistes audio offrent aussi la possibilité d’incruster un player son en générant une balise de type <iframe...</iframe> . Celle essayé ne marche pas sur MIA, mais vous pouvez toujours tester !

Depuis son ordinateur

Pour ajouter une piste audio depuis un ordinateur, il faut suivre la même procédure que pour d’autres fichiers.

Une fois téléversé, on peut insérer le document, et le légender comme n’importe quel autre document (voir ajouter un document ou ajouter une image). Deux choix de balise sont alors offert docXXXX|center et embXXXX|center. Mais le meilleur rendu peux être obtenu en écrivant la balise suivante : sonXXXX|center. Ci-dessous les différents affichages par balise, en utilisant respectivement :

Reportage Audio sur CÉSAÏ
Reportage Audio sur CÉSAÏ
Reportage Audio sur CÉSAÏ

Partager des contenus depuis les réseaux sociaux

Facebook

Les insertions de publications Facebook rapatrient pour l’instant les trackers de Facebook, mieux vaut donc ne pas les utiliser et privilégier la méthode consistant à prendre une capture d’écran (attention aux métadonnées ! Voir Sécurité et anonymat sur MIA) et à l’insérer ensuite comme une image classique. De plus, selon le contenu il peut être intéressant de prendre une capture d’écran pour garder le contenu même s’il est supprimé par son auteur.e ou Facebook.

En mode Édition de texte et Voir, le résultat peut être assez bizarre, vérifiez toujours le rendu final en utilisant le mode “Prévisualisation”. Pour partager une publication (ou une vidéo, etc.), il suffit d’insérer l’url de la publication. Par exemple :

https://www.facebook.com/robin.kotula.3/videos/10216761350859096/

Bien nombreux pour ce rassemblement spontané pour refuser le discours de haine degainé par Ravier et ses fafs pour...

Posted by Collectif Soutien Migrants 13 / El Manba on Wednesday, February 27, 2019

Twitter

Lorsqu’on insère un tweet, le code embarqué dans la page ne contient pas d’iframe ni d’appel à des ressources extérieures, pour ne pas dévoiler l’adresse IP des visiteurs à des tiers.

En mode Édition de texte et Voir, le résultat peut être assez bizarre, vérifiez toujours le rendu final en utilisant le mode “Prévisualisation”. Pour partager un tweet, il suffit d’insérer l’url du tweet. Par exemple :

Mastodon

Lorsqu’on insère un toots, le code embarqué dans la page ne contient pas d’iframe ni d’appel à des ressources extérieures, pour ne pas dévoiler l’adresse IP des visiteurs à des tiers.

En mode Édition de texte et Voir, le résultat peut être assez bizarre, vérifiez toujours le rendu final en utilisant le mode “Prévisualisation”. Pour partager un toots, il suffit d’insérer l’url du toots. Par exemple :

Instagram

En mode Édition de texte et Voir, le résultat peut être assez bizarre, vérifiez toujours le rendu final en utilisant le mode “Prévisualisation”. Pour partager du contenu, il suffit d’insérer l’url de la photo en question. Par exemple :

Walkouts, strikes, and actions planned across North America tomorrow. Check itsgoingdown.org for a partial list. Make sure to contribute action reports! Happy May Day! #MayDay2017

Flickr

En mode Édition de texte et Voir, le résultat peut être assez bizarre, vérifiez toujours le rendu final en utilisant le mode “Prévisualisation”. Pour partager du contenu, il suffit d’insérer l’url de la photo en question.

Marseille manif 24

Notes :

[1Les métadonnées sont des donnés qui decrivent des données. Tout matériel numérique en dispose. Très simplement, on pourrait dire qu’il s’agit d’un ensemble d’informations qui résument le contenu d’un document/photo/ecc., la manière dont il doit être traité par l’ordinateur, ainsi que des données sur sa provénence (date de création et de modification, miniatures des précedentes versions en cas de modification, codes propres à un appareil photo ou à un ordinateur, ...). Les sites ou logiciels qui suppriment les métadonnées, suppriment en pratique toutes les informations qui sont superflues à la simple reproduction du document.

[2Malheureusement, les outils que nous connaissons (tel que MAT) ne permettent pas encore d’enlever les métadonnées des fichiers pdf, il est donc nécessaire de les copier-coller dans des fichiers textes si on veut en enlever les métadonnées.

PS :

Liste des tutos, aide à l’écriture et ressources MIA : Nouveaux tutoriels MIA.

A lire aussi...