Jump to content

Manuel:Assets

From mediawiki.org
This page is a translated version of the page Manual:Assets and the translation is 100% complete.

MédiaWiki inclut des ressources binaires dans son code.

Images PNG

Des fichiers PNG sont nécessaires pour les navigateurs incompatibles avec SVG.

La plupart des images/icônes PNG incluses dans notre code sont optimisées avec optipng ou pngcrush, qui détectent automatiquement la meilleure méthode pour les fichiers cibles (et sont fournis dans plusieurs distributions GNU/Linux). Par exemple:

pngcrush -brute -reduce image.png image.out.png

MédiaWiki a un support intégré pour SVG avec PNG comme solution de rechange, en utilisant le code Less.

    .background-image-svg( '../images/file.svg', '../images/file.png' );

Pour utiliser cela, ajouter aussi la ligne au début de votre fichier Less:

    @import "mediawiki.mixins";

en haut du fichier.

Versions antérieures de MediaWiki

Version de MediaWiki :
1.21

Si vous développez pour de plus anciennes version de MédiaWiki (avant la 1.22), vous pouvez utiliser la même technique (de La technique du dégradé invisible) manuellement.

    background: transparent url(fallback-image.png) center center no-repeat;
    background-image: linear-gradient(transparent, transparent), url(vector-image.svg);

Fichiers SVG

Chaque image devrait aussi (ou plutôt d'abord) exister en format SVG.

Les fichiers SVG doivent aussi être optimisés. Pour la plupart des fichiers système et extension, svgo est utilisé. Vous devez vous assurer qu'un prologue compatible à XML est conservé, par exemple avec cet extrait :

for i in `find . -name '*.svg'`
  do
    mv $i $i-tmp
    (echo -n '<?xml version="1.0" encoding="UTF-8"?>'; cat $i-tmp) > $i
    rm $i-tmp
  done

Si vos fichiers SVG sont déjà bien formés et ont un prologue XML, vous pouvez simplement utiliser la configuration svgo pour le noyau MédiaWiki. For example, from an extension's directory:

npm -g install svgo
svgo --config ../../.svgo.config.js --folder .

Pour une optimisation plus agressive (par exemple, si vous ne vous souciez pas de lire la source SVG plus tard), exécutez-le sans fichier de config et il appliquera toutes les optimisations par défaut. Note that for MediaWiki use, some of these are unnecessary (e.g. we pretty-print the XML because ResourceLoader will minify it later, and it's nicer to work with it unminified).