Media

Vous trouverez ici comment intégrer des lecteurs audio et vidéo dans vos pages wiki, qu'il s'agisse de fichiers téléchargés sur le wiki ou hébergés sur des sites externes.

Ces fonctionnalités reposent sur la recette Cookbook:Ape, mais sont quelque peu plus simples à utiliser et présentent des différences au niveau du balisage wiki.

Activation des fonctionnalités multimédias

L'intégration de médias est disponible depuis PmWiki 2.6.0 et peut être activée en ajoutant la ligne suivante au fichier local/config.php :

$PmMedia['EnableEmbed'] = 1;

Utilisation de base

L'intégration de lecteurs multimédias est similaire à l'intégration d'images dans les pages wiki, avec le lien Attach: ou l'URL distante brute, sans les crochets.

Pour intégrer un fichier multimédia dans une page, utilisez la fonction upload pour le télécharger en utilisant le balisage "Attach:", ou saisissez l'adresse (URL) du fichier dans le texte du balisage.

Fichier joint localement intégré :
Attach:video.webm

Fichier distant intégré :
https://example.com/video.mp4

Fichier intégré sur le même serveur, en dehors de la structure du répertoire uploads :
Path:/some/directory/video.mp4

Liens uniquement (non intégrés, notez les crochets):
[[Attach:video.webm]], [[Attach:video.webm|texte du lien]]
[[https://example.com/video.mp4]]
[[Path:/some/place/video.mp4]]

Les extensions de fichiers suivantes sont censées correspondre à des fichiers multimédias pouvant être intégrés :

  • Fichiers audio : mp3, opus, weba, m4a, ogg, flac, wav
  • Fichiers vidéo : mp4, webm, m4v, ogv, mov

Formats de fichiers joints localement, fichiers associés, affiche, sous-titres

La prise en charge des médias varie selon les navigateurs et les appareils.

Si le lien est une URL externe, un chemin d'accès ou un lien InterMap, PmWiki intégrera simplement le fichier.

Si les uploads sont activés et qu'il s'agit d'un lien Attach: vers un fichier téléchargé localement, PmWiki analysera le répertoire des téléversements à la recherche de fichiers alternatifs dans d'autres formats et les affichera tous dans le navigateur.

Par exemple, si vous insérez un lien vers Attach:My-Trip-2026.webm, PmWiki intégrera ce fichier. Il recherchera également les fichiers ayant le même nom de base et une autre extension : My-Trip-2026.mp4, My-Trip-2026.m4v, My-Trip-2026.ogv, My-Trip-2026.mov (dans cet ordre) et les proposera comme formats alternatifs au lecteur.

Le navigateur lira le premier format compatible. S'il ne prend en charge aucun des formats disponibles, il affichera des liens directs vers les fichiers afin que les visiteurs puissent les télécharger.

Si vous ne pouvez téléverser qu'un seul fichier, pour une compatibilité maximale, privilégiez le format MP4 (H.264/AAC) pour la vidéo et le format MP3 pour l'audio.

Pour une qualité optimale et une taille de fichier réduite, privilégiez le format WebM (VP9) pour la vidéo et les formats Opus/Ogg/WebA pour l'audio. Ces formats sont compatibles avec les navigateurs récents.

Pour une expérience utilisateur optimale, téléversez vos fichiers multimédias dans les deux formats mentionnés ci-dessus si possible, et utilisez les formats offrant la meilleure qualité (les autres formats seront détectés et disponibles dans le lecteur).

"Encodage

À faire.

Pour les fichiers téléchargés localement, PmWiki recherchera également les images et sous-titres/chapitres associés (même nom de base et extension différente) et les intégrera au lecteur.

  • Images de couverture : webp, jpg, jpeg, png
  • Pistes audio (sous-titres, chapitres) : vtt

Par exemple, si vous créez un lien vers Attach:My-Trip-2026.webm, et qu'un fichier image My-Trip-2026.jpg est présent, il doit s'afficher comme image de couverture avant le début de la vidéo.

S'il s'agit d'un fichier audio et qu'un fichier d'illustration est associé, le lecteur doit créer un élément <video> avec l'illustration en arrière-plan.

Pour les fichiers vidéo uniquement, les fichiers audio suivants seront automatiquement ajoutés au lecteur s'ils se trouvent dans le répertoire d'uploads et qu'un fichier vidéo basename.webm est intégré :

  • Sous-titres :
    • basename.vtt
    • basename.en.vtt, basename.en-US.vtt : avec un code de langue défini
  • Sous-titres, comporte une partie « .captions » entre le nom de base et l'extension :
    • basename.captions.vtt
    • basename.en.captions.vtt, basename.en-US.captions.vtt : avec un code de langue défini
  • Chapitres, comporte une partie « .chapters » entre le nom de base et l'extension :
    • basename.chapters.vtt
    • basename.en.chapters.vtt, basename.en-US.chapters.vtt : avec un code de langue défini

Vous pouvez avoir plusieurs fichiers VTT associés ; ils seront tous ajoutés au lecteur et un utilisateur ne pourra en activer qu'un seul à la fois.

Options du lecteur

Les options du lecteur peuvent être définies dans un fragment de code (hash) après l'URL. Les différentes options doivent être séparées par des points-virgules :

Attach:video.mp4#800x450;loop;t=1:20,5:33

Les options suivantes sont prises en charge, après le dièse (#), séparées par des points-virgules :

  • audio - Lire la vidéo dans un lecteur audio (seul le son sera diffusé, sans l'image ; le navigateur téléchargera tout de même le fichier complet).
  • controls=0 - ​​Afficher le lecteur sans commandes ni barre de progression ; le menu contextuel (clic droit) permet à l'utilisateur de contrôler la lecture.
  • muted - Le lecteur est initialement muet ; l'utilisateur peut le réactiver.
  • loop - La lecture redémarre automatiquement à la fin du fichier.
  • preload=none - Ne pas précharger les métadonnées de la vidéo tant que l'utilisateur ne la lit pas.
  • loading=lazy - Ne pas charger le fichier multimédia tant que le lecteur n'est pas proche de la zone d'affichage à l'écran.
  • 800x450 - Dimensions en pixels WIDTHxHEIGHT de l'élément lecteur (sans 'px' ni pourcentage) ; recommandé si preload=none ou loading=lazy
    • 1280x - Définit uniquement la largeur width, x720 - Définit uniquement la hauteur height (le navigateur doit ajuster les autres dimensions proportionnellement).
  • 1.25x, 0.8x - Modifie la vitesse de lecture de la vidéo (par exemple, 2x = deux fois plus rapide) ; l'utilisateur peut modifier la vitesse via les points de suspension ou le menu contextuel (clic droit). La valeur doit être comprise entre 0,5 et 3,0.
  • autoplay - La lecture doit démarrer dès le chargement de la page. Notez que certains navigateurs exigent que le mode « muet » soit également activé et peuvent demander à l'utilisateur de confirmer l'autorisation de lecture automatique des médias pour le site web.
  • id=video_id - Ajoutez un identifiant unique ; il peut servir d'ancre pour les liens vers le lecteur (par exemple, Page#video_id) et pour la mise en forme.
  • class=vertical - Ajoutez une classe CSS unique. * t=start,end - Configurer les horodatages de début et de fin
    • t=01:00,07:53 - Au format (HH:)MM:SS(.000)
    • t=130,187 - Au format start-second,end-second
    • t=10 - Indiquer uniquement l'heure de début (start), l'heure de fin est facultative.
    • Les secondes peuvent être un nombre décimal, par exemple 20.907 (avec un point décimal).
  • lang=fr - Définir la langue par défaut des sous-titres dans le lecteur vidéo. Cela activerait un fichier de sous-titres video.fr.vtt s'il existe, sans que l'utilisateur ait à le sélectionner.

D'autres options sont disponibles ; consultez developer.mozilla.org: <video> (à l'exception de poster et src).

Variables de configuration

Les éléments suivants peuvent être activés dans la configuration locale :

  • $PmMedia['EnableEmbed'] = 1; Inclure les fonctions multimédias (désactivées par défaut ; requises pour toutes les fonctionnalités).
  • $PmMedia['EnableUploadEmbed'] = 1; Activer l'intégration des URL nues (Attach:) aux fichiers multimédias (activé par défaut, définir sur 0 pour désactiver).
  • $PmMedia['EnableRemoteEmbed'] = 1; Activer l'intégration des URL nues distantes aux fichiers multimédias (activé par défaut, définir sur 0 pour désactiver).
  • $PmMedia['AudioExts'] = 'opus|weba|m4a|ogg|mp3|flac|wav'; Extensions audio prises en charge, par ordre de préférence.
  • $PmMedia['VideoExts'] = 'webm|mp4|m4v|ogv|mov'; Extensions vidéo prises en charge, par ordre de préférence.
  • $PmMedia['PosterExts'] = 'webp|jpg|jpeg|png'; Extensions d'affiches prises en charge, par ordre de préférence (ce n'est pas une expression régulière).
  • $PmMedia['DefaultAttrs']['attribute'] = 'value'; Valeurs par défaut des attributs, voir Options du lecteur :
    • $PmMedia['DefaultAttrs']['controls'] = false; Masquer les commandes par défaut. Utilisez #controls dans le fragment pour les activer pour chaque lecteur.
    • $PmMedia['DefaultAttrs']['loading'] = 'lazy'; Chargement différé pour tous les fichiers multimédias.

Pour les sous-titres, lorsqu'un code de langue est détecté, le nom de la langue s'affiche comme étiquette dans le lecteur. Certains codes et étiquettes de langue sont inclus. Vous pouvez définir d'autres codes et étiquettes de langue comme suit :

  • $PmMedia['Langs']['fr-CA'] = 'Français (Canada)'; Afficher cette étiquette pour un fichier de sous-titres nommé video.fr-CA.vtt.

Liens vers les horodatages / chapitres

Les horodatages tels que 0:19 ou 1:01:34, écrits en texte brut après le lecteur, sont convertis en liens permettant de démarrer la lecture à ces points :

Attach:video.mp4
La première chanson commence à 0:19, le générique de fin à 12:58.
* 0:00 Début/Introduction
* 0:19 Première chanson
* 6:55 Deuxième chanson
* ...
* 12:58 Générique de fin

Un autre lecteur multimédia, ou un titre de page de niveau 1, 2 ou 3 comme !!! Titre suivant, interrompra la recherche des horodatages pour le fichier multimédia en cours.

Différences avec Cookbook:Ape

Ape est une recette PmWiki populaire permettant d'intégrer des lecteurs audio et vidéo HTML5. Cette fonction PmWiki de base est basée sur Ape, mais simplifiée pour les contributeurs wiki, avec moins de balisage à écrire.

Les principales différences entre PmMedia et Ape sont les suivantes :

  1. Plus besoin de wikistyles %embed%...%% ; les URL brutes sont converties en balises HTML5 <audio> et <video>.
  2. Seules les URL brutes sont intégrées, comme pour les images ; Ape permet d'intégrer des liens entre crochets.
  3. Les options du lecteur sont écrites dans le fragment de hachage plutôt que dans wikistyles.
  4. Détection automatique des formats multimédias alternatifs, des images d'affiche et des sous-titres/légendes dans les fichiers locaux ; il n'est pas nécessaire de les lier. ** PmMedia utilise des conventions pour les noms de fichiers, tandis qu'Ape permet de créer des liens vers n'importe quel nom de fichier.
  5. Étiquetage automatique multilingue des sous-titres.
  6. Lecteur vidéo pour fichier audio + affiche.
  7. Les liens vers les horodatages n'ont pas besoin d'être encadrés par >>embed<< ou >>mediajump<<, et ne sont détectés qu'après le lecteur vidéo.
  8. Contrairement à Ape, PmMedia ne nécessite pas l'activation de JavaScript (sauf pour les liens vers les horodatages).
  9. Contrairement à Ape, les lecteurs PmMedia peuvent être intégrés dans une carte Ape.

À terme, PmMedia permettra d'intégrer des vidéos YouTube et Vimeo, comme Ape, mais avec une meilleure conformité au RGPD.

Si vous utilisez actuellement Ape pour l'intégration de fichiers audio/vidéo, PmMedia ne le remplace pas directement : son objectif est de réduire le balisage et d'améliorer l'expérience utilisateur. Si vous activez PmMedia, vous devrez également vérifier vos pages existantes et, le cas échéant, mettre à jour le balisage wiki (supprimer les crochets de lien, utiliser les options de hachage au lieu des styles wiki) et éventuellement renommer les fichiers joints alternatifs ou associés.

Notes

Le serveur web doit envoyer les en-têtes Content-Type corrects pour tous les formats de fichiers multimédias mentionnés ci-dessus. La configuration suivante peut être ajoutée au fichier .htaccess si le serveur ne les prend pas en charge correctement.

# Formats web modernes souvent absents des configurations par défaut des serveurs
AddType image/webp     webp
AddType audio/opus     opus
AddType audio/flac     flac
AddType audio/webm     weba
AddType video/webm     webm
AddType text/vtt       VTT

# Variantes spécifiques Apple/MPEG-4
AddType audio/mp4      m4a
AddType video/mp4      m4v



Traduction de PmWiki.Media Page originale sur PmWikiFr.Media - Référencé par
Dernières modifications:
PmWikiFr.Media: 06 September 2026 à 15h55
PmWiki.Media: 17 May 2026 à 11h34