Version 12 — Octobre 2010 — Joseph
Le fonctionnement des modèles pour l’insertion des documents soulève régulièrement des questions, notamment parce <doc13>
, <img13>
ou encore <emb13>
ne produisent pas le même résultat et que ce résultat, pour les images, dépend du fait d’être dans le portfolio ou non.
Comme l’écrit Romy,
<blockquote class="spip">Qui sait expliquer clairement la différence entre les « images » et les « documents » de SPIP ? Quand faut-il utiliser le raccourci d’insertion <img314>
, celui <doc314>
ou encore <emb314>
? et quelles sont précisément leurs différences ? Pourquoi est-ce si difficile à retenir ?
(Source : http://romy.tetue.net/mais-ou-est-p...)
Sur la liste SPIP-Zone, Cédric expliquait :
<blockquote class="spip">Le sujet est un serpent de mer, contraint par la compatibilté ascendante. Pour le moment on a fait le choix de ne pas la casser, ce qui a des limites.
</blockquote>(Source : http://permalink.gmane.org/gmane.co...)
Avant de poursuivre la discussion, on pourra lire la documentation officielle à cette adresse http://www.spip.net/fr_article3715.html.
La présente proposition vise à proposer une nouvelle série de modèles ayant un comportement unifié et indépendant du mode des images. Ces modèles seront implémentés dans un premier temps dans un plugin dédié (modeles_media) avant d’envisager une éventuelle intégration au core.
Ce plugin fournira également une aide en ligne actualisée ainsi qu’une aide à l’insertion des modèles (au travers du plugin inserer_modeles en cours de développement).
Les modèles existants (doc, emb, img, image, audio, video, text, application) ne seront pas modifiés afin d’assurer la rétrocompatibilité.
Reprenant l’idée suggérée par Romy Têtue, un seul modèle sera à retenir avec un appel unifié de la forme :
<mediaXX|variante|alignement|parametres>
où XX représente l’identifiant du document.
Volontairement, afin de distinguer le nouveau système du système actuel, on n’a pas repris <doc>
.
<img8784 >
Les modèles < code>
<media12|icone>
affichera l’icône représentant le type de document.
<media12|vignette>
affichera une vignette du document. Il s’agira dans l’ordre :
|taille
transmis au modèle (voir ci-après).<media12|embed>
permet d’incruster le document, l’incrustation étant fonction du type du document.
Il existe également d’autres variantes secondaires, décrites plus bas, qu’il n’est pas besoin de connaître pour un usage courant.
voir plus loin pour les variantes secondaires
L’alignement se précise comme actuellement avec |left
, |center
et |right
.
Exemple : <media12|icone|right <media34|icone|right >
En l’absence de paramètres spécifiques , aucune légende n’est affichée .
Pour afficher une légende simple (titre + descriptif), on ajoutera simplement |legende
au modèle. Par exemple : <media12|vignette|legende>
.
Si l’on souhaite une légende complète ( Params : legende , titre + , descriptif + crédits + , credits , type de document + , poids en octets ), on indiquera < code>|legende=complete</code >. . Par exemple : <media12|vignette|legende=complete>
.
Il est également possible d’indiquer plus précisément les éléments qui devront composer la légende. Au lieu du paramètre |legende
, on aura alors recours aux paramètres |titre
, |descriptif
, |credits
, |type
|poids
. Par exemple, si on souhaite afficher uniquement le titre et les crédits on fera : <media12|icone|titre|credits>
. Pour afficher seulement le type de document et son poids : <media12|icone|type|poids>
.
Il est possible de personnaliser le titre, le descriptif et les crédits à afficher pour utiliser d’autres valeurs que celles associées au document (utile par exemple sur un site multilingue). On précisera alors simplement à ces trois paramètres les valeurs à prendre. Par exemple :
<media12|icone
|titre=Un autre titre
|descriptif=Un autre descriptif avec du {{gras}}, de l'{italique} et même une note[[de bas de page]].
|credits=d'autres crédits>
On peut utilise les deux formes d’écritures. Pour afficher le titre du document, des crédits personnalisés et le poids du document : <media12|icone|titre|credits=autres crédits|poids>
. Si on souhaite afficher la légende complète en personnalisant juste le titre : <media12|icone|legende=complete|titre=Mon autre titre>
.
Texte à compléter
En l’absence de paramètres spécifiques, aucun lien n’est ajouté au média.
Pour que le média pointe sur lui-même, on ajoutera simplement |lien
. Il est possible de préciser un lien spécifique, par exemple <media12|icone|lien=http://www.monsite.net>
. On peut utiliser les raccourcis SPIP pour les liens internes. Par exemple, pour pointer sur la rubrique 3 : <media12|icone|lien=rub3>
.
Il est également possible d’utiliser la syntaxe suivante [<media12|icone>->rub3]
.
L’attribut title
du lien est déterminé automatiquement par SPIP en fonction du lien. Cependant, il est possible de spécifier explicitement l’attribut title
avec le paramètre |titre_lien
. Par exemple : <media12|icone|lien=http://www.monsite.net|titre_lien=Un super site à visiter>
.
Params : lien, titre_lien
texte à compléter
Rappeler syntaxe possible [<media12|icone>->rub38]
.
Params : taille, hauteur, largeur
texte à compléter
Params : alt
texte à compléter
Mettre à jour le table
| Paramètre | Description |
| legende | - paramètre absent, la légende (titre + descriptif + crédits) n’est pas affichée.
- |legende
pour afficher la légende. |
| titre | optionnel, permet de personnaliser le titre si la légende est affichée (exemple : <media32|logo|legende|titre=Un autre titre>
) |
| descriptif | - optionnel, permet de personnaliser le descriptif
- |descriptif=non
pour ne pas afficher le descriptif |
| lien | - paramètre absent, pas de lien sur l’icône, la vignette ou l’image
- |lien
pour ajouter un lien pointant sur le document
- |lien=http://monsite.net
ou |lien=rub2
pour spécifier un lien particulier|
| class | Optionnel, permet d’ajouter une ou plusieurs classes CSS sur le document |
| alt | Optionnel, permet de personnaliser le texte alternatif |
| taille | Optionnel, peut prendre quatre valeurs : icone, petit, moyen et grand, correspondant à trois tailles standards (paramétrables dans l’interface privée, par défaut 52px, 100 px, 250px, 500px [1]) ou bien une taille maximum en pixels |
| hauteur | Optionnel, une alternative au paramètre taille, permettant de définir une hauteur spécifique en pixels |
| largeur | Optionnel, une alternative au paramètre taille, permettant de définir une largeur spécifique en pixels [2] |
En l’absence de paramètres spécifiques Tableau à compléter , la taille du document sera utilisée ( modifiable selon le type de fichier ), notamment pour les vignettes . contrôleurs audio et video
Les modèles <media>
proposent 4 tailles standards : icone, petit, moyen et grand. Ces quatre tailles peuvent être personnalisées dans la Configuration de SPIP, sous l’onglet Fonctions avancées.
On spécifiera la taille souhaitée en utilisant le paramètre |taille
, par exemple : <media12|vignette|taille=petit>
. Il est également possible de spécifier une taille précise en pixels de la manière suivante : <media12|vignette|taille=150>
.
Les médias sont redimensionnés en respectant le ratio hauteur/largeur. Ainsi, |taille=150
redimensionnera le média de telle manière que sont plus grand côté soit égal à 150 pixels.
Si souhaite simplement spécifier une hauteur maximum de 150 pixels, on utilisera |hauteur=150
. Pour une largeur maximum de 300 pixels, |largeur=300
. On peut utiliser les deux paramètres en même temps : <media12|vignette|hauteur=150|largeur=300>
.
Il est possible de personnaliser le texte alternatif ajouté aux images et autres médias avec le paramètre |alt
. Par exemple : <media12|icone|alt=Texte alternatif sur l'icône>
.
Il peut arriver que le modèle soit appelé sans spécifier de variante (exemple : <code><media12></code code><media24></code >).
Dans cette situation indéterminée, plutôt que de ne rien afficher, le modèle retournera l’équivalent de <media24|vignette|legende|lien|taille=icone>
.
Il est possible de faire <media12|logo>
qui affichera le logo du document. Le logo d’un document est calculé par SPIP de la manière suivante :
Le logo d’un document affiche donc tantôt une vignette et tantôt l’icône du document. On préférera donc l’usage des variantes icone et vignette à la place de la variante logo.
Une variante par groupe MIME
Reprenant le fonctionnement actuel de <emb>
, la variante media_embed.html
sous-traite sous-traitera le travail à plusieurs modèles en fonction du type MIME du document : media_image.html
, media_audio.html
, media_video.html
, media_text.html
et media_application.html
.
Dès lors, il est possible d’utiliser également les variantes de la forme <mediaXX|image>
, <mediaXX|audio>
, <mediaXX|video>
, <mediaXX|text>
et <mediaXX|application>
.
<mediaXX|embed>
et <mediaXX|image>
produiront exactement le même résultat si XX est une image. [3].
Une Permettre une variante par extension
Il est possible de définir une variante par extension sous la forme modeles/media_groupeMIME_extension.html
. Lors de l’incrustation d’un fichier, on vérifiera l’existence d’un modèle spécifique pour cette extension (modeles/media_groupeMIME_extension.html
), sinon on utilisera le modèle générique du groupe MIME modeles/media_groupeMIME.html
.
Pour les images, on a pourrait ainsi avoir un modèle générique modeles/media_image.html
et un modèle spécifique pour le BMP SVG : <code>modeles/media_image_bmp code>modeles/media_image_svg .html.
Ainsi, avec le lecteur multimedia, pour la prise en charge des mp3, le plugin pourrait proposer un modèle media_audio_mp3.html
qui appelle le player fourni par le plugin. Dans mon article, je mets juste <media123|embed>
qui saura tout seul trouver le bon modèle. Maintenant, je désactive le lecteur multimedia, <media123|embed>
sera toujours pris en charge par le modèle générique modeles/media_audio.html
qui incrustera le MP3 dans une balise <object>
. Ce qui est mieux qu’une simple icone dans le cas présent. [4].
Quelque soit la variante utilisée, on ajoutera, en plus des classes usuelles spip_documents
, spip_document_#ID_DOCUMENT
et spip_documents_#ENV{align}
, les classes suivantes : media_#ENV{variante}
et media_#ENV{variante}_#EXTENSION
.
Compléter texte à compléter
Expliquer les filtres media_generer_vignette_ext.