Plugin Modèles media

Pour les versions de SPIP antérieures à la version 3.3, les modèles <doc>, <img> et <emb> produisent chacun un résultat différent et ce résultat, pour les images, dépend du fait qu’elle soit dans le portfolio ou non.

Ce plugin propose une nouvelle série de modèles ayant un comportement unifié et indépendant du mode des images. Les modèles existants (doc, emb, img) ne sont pas modifiés afin d’assurer la rétrocompatibilité.

Installation

Les modèles <media> nécessitent que le plugin Médiathèque soit installé et activé.

Le plugin Insérer Modèles n’est pas obligatoire mais fortement recommandé afin de fournir une aide aux rédacteurs pour l’insertion des modèles <media>.

Avertissement

La version 3.3 de SPIP a résolu la grande partie des problèmes auquel ce modèle répondaient. Le plugin est toutefois compatible 3.3 pour les raisons suivantes :
-  permettre de ne pas avoir à migrer ses modèles ;
-  continuer à disposer de certaines options non encore présente dans les modèles de SPIP.

Syntaxe générale

Syntaxe des modèles <media>
Syntaxe des modèles <media>

Trois variantes principales

Les modèles <media> reposent sur trois variantes principales : icone, vignette et embed.

<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 :

  1. de la vignette personnalisée associée au document si elle existe.
  2. d’une vignette générée automatiquement à partir du document. La vignette générée est indépendante de la configuration de SPIP (que l’on ait activé ou non les vignettes automatiques dans Configuration > Fonctions avancées). Enfin, la taille de la vignette n’est pas déterminée par le paramètre de SPIP concernant les vignettes automatiques mais par le paramètre |taille transmis au modèle (voir ci-après).
  3. de l’icône du type de fichier si aucune vignette personnalisée n’est disponible et si aucune fonction de génération automatique de vignette n’est disponible pour ce type de fichier.

<media12|embed> permet d’incruster le document, l’incrustation étant fonction du type du document.

Depuis la vesion 1.2.0, on peut utiliser <media12|insert>, équivalent à <media12|embed> [1].

Alignement

L’alignement se précise comme actuellement avec |left, |center et |right.

Exemple : <media12|icone|right>

Afficher une légende

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 (titre + descriptif + crédits + type de document + poids en octets), on indiquera |legende=complete. 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 et |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>.

Ajouter un lien

Pour les variantes icone et vignette, un lien pointant sur le document sera ajouté par défaut. Pour la variante embed, en l’absence de paramètre lien, aucun lien ne sera 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>.

Spécifier la taille

En l’absence de paramètres spécifiques, la taille du document sera utilisée (modifiable selon le type de fichier), notamment pour les vignettes.

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 son plus grand côté soit égal à 150 pixels.

Si on 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>.

Personnaliser le texte alternatif

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>.

Cas du modèle appelé sans variante

Il peut arriver que le modèle soit appelé sans spécifier de variante (exemple : <media12>).

Le modèle n’est pas censé être appelé sans variante. Si cela arrive, la variante vignette sera utilisée. Mais cela n’est pas recommandé.

Aide à l’insertion des modèles

Afin de faciliter l’insertion des nouveaux modèles, ce plugin fournit un formulaire d’insertion utilisable avec le plugin Insérer Modèles. Si celui-ci est actif, alors une aide à l’insertion des modèles media sera disponible dans le porte-plume.

Plugins étendant les modèles media

Footnotes

updated on 18 February 2021

Discussion

49 discussions

  • 1
    Boltzmann_Solver

    Bonjour,

    Dans la fonction calculer_balise_MEDIA_IMAGE_RETAILLEE, il y a un ajout de chaîne que je n’explique pas et qui bloque le chargement d’images chez moi. Il s’agit de “://” à la ligne 163. Sa suppression permet de résoudre le problème de chargement de l’image.

    BS.

    • Voici les lignes en questions :

       $url = parse_url($src);
      if (!empty($url['query'])) {
                $src = $url['scheme'].'://'.$url['host'].$url['path'];
      }

      Cela correspond à la ligne 3 juste au-dessus.

      Je ne comprends pas très bien votre problème. Vous pourriez nous donner un exmeple plus précis permettant de reproduire le bug ?

    Reply to this message

  • Hello,

    J’aime bien ce plugin pour la présentation des pièces jointes dans le texte des articles.
    Tout fonctionne de mon coté avec SPIP 3.1 et la version 1.3.5 SVN [98239] du plugin.

    Mes liens sont sous la forme <media2001|vignette|legende=complete>
    et dans l’espace privé c’est assez disgracieux car sur les pages ?exec=article&id_article=xx la vignette s’affiche au max de la largeur du texte et donc par exemple la vignette figurant un zip est agrandie à 500px de large au lieu de 52px.

    J’ai mis une capture du code généré ici : https://framapic.org/dbVMjMWgtZ5W/V9bVIKInfWl6.png

    dd

    Reply to this message

  • 1

    Bonjour,

    Je n’arrive pas à installer le plugin sur un SPIP 3.1.1. J’ai toujours l’erreur “Oups. Une erreur inattendue a empêché de soumettre le formulaire. Vous pouvez essayer à nouveau.” qui est une erreur ajax sur le formulaire.
    C’est le seul plugin que je n’arrive pas à activer.

    Les logs ne m’indique strictement rien… Quelqu’un a déjà rencontré le problème ?

    Ybbet

    • C’est bon, j’ai trouvé… Il manque les numéros de version des plugins en nécessite et utilise…
      Je corrige cela sur le SVN.

    Reply to this message

  • Bonjour,

    En passant en mode débug j’ai ceci
    Notice: Undefined index: hauteur in /modeles_media/media_fonctions.php on line 149

    Idem pour les 4 ligne qui suive.

    Quelle correction apporter ?

    Reply to this message

  • Salut

    j’ai un souci avec l’insertion des titres dans l’attribut alt des images
    quand le titre contient des enrichissements réalisés à l’aide de balise, ça nous fait un alt assez sale et ambigû

    d’où ma question pourquoi la variable $alternative n’est pas nettoyer avec le filtre attriibut_html dans la fonction calculer_balise_MEDIA_IMAGE_RETAILLEE, ligne 213, comme c’est le cas dans la fonction calculer_balise_MEDIA_LIEN ligne 259 ?

    Reply to this message

  • 3

    Bonjour

    Est ce logique que : <media1093|vignette|left|lien=art529> Rajoute un (fr) ?

    • Plus précisément, c’est un hreflang ajouté au lien et ce sont les CSS de l’espace privé qui affichent ce (fr).

      Cependant, on précise normalement le hreflang seulement si c’est différent de la langue du contexte.

      Normalement, c’est corrigé avec la version 1.2.17.

    • Je te tient informer une fois mis à jour.

      Je le voyais aussi dans le public d’où ma question.

    • Merci pour la correction, cela fonctionne.

    Reply to this message

  • 3

    Bonjour,
    Je viens de faire une migration SPIP 2.1.26 vers 3.0.17 et j’observe un certain nombre de petits trucs à droite à gauche qui ne fonctionnent plus correctement, ou disons, pas comme avant !

    Par exemple :
    [<media4004|embed|left>->media4007]
    ne fonctionne plus : le document 4004 n’est plus cliquable alors que c’était le cas avant… et le lien vers le doc 4007 n’est plus généré. Quelque chose a-t-il changé ?

    • Bonjour Manu,

      désolé de ne pas avoir vu ton message plus tôt. Je n’avais pas remarqué ce changement de comportement.

      J’essaie d’en trouver l’origine.

    • Peux-tu essayer la version 1.2.16 ? Le problème est-il corrigé ?

    • OK… les liens sont renouveau générés.
      Merci beaucoup !

    Reply to this message

  • 4

    Bonjour,

    Je viens de passer à Modèles média 1.2.14. et j’obtiens le résultat suivant:

    Est-ce qu’il y a une solution prochaine ou comment puis-je faire pour utiliser la version précédente?

    Merci par avance.

    SPIP 3.0.17 [21515]

    Reply to this message

  • Bonjour,

    Je sais que cela peut ouvrir une discussion à l’infini sur le bien-fondé des liens qui ouvrent un nouvel onglet (ou une nouvelle fenêtre), mais même si je comprend (et pratiquement approuve) les arguments de ceux qui disent que c’est mal, il y a de nombreux cas ou cela me parait souhaitable (par ex ouvrir une page vers un autre site), ne serait-ce que parce que les internautes (lire 80% des internautes que je connais) ne savent pas vraiment se servir d’un navigateur et que de toutes les façons il me semble pire de forcer l’internaute à revenir en arrière pour retrouver un site qu’il a quitté ... (sans parler des sites qui maintenant effacent l’historique pour que vous ne reveniez pas en arrière ...) ... Bref ce long préambule pour dire que c’est dommage que ce plugin n’autorise pas le choix d’une cible d’ouverture des liens.

    J’ai contourné le problème en modifiant media_fonctions.php à la ligne 263 en $a .= ' target="_blank">'; mais c’est dommage que l’on n’ait pas, soit un paramètre à positionner lors de l’ajout d’un média dans le back-office, soit la possibilité d’agir en créant un modèle dans nos squelettes ...

    Je me posais la question de savoir s’il était possible de surcharger une fonction d’un plugin en créant une fonction de nom équivalent dans mes_fonctions.php ?
    Et bien sûr, s’il était éventuellement possible que le plugin évolue dans ce sens avec un paramètre |cible= par ex.

    PS: à noter que HTML5 est revenu sur cet attribut qui est maintenant valide alors qu’il ne l’était plus en XHTML strict.

    Merci !
    Pierre.

    Reply to this message

  • 1

    Problème Responsive Web Design et modèle média sans paramètre de taille
    Je encontre un souci sur un site que je suis en train de passer en RWD. Dans cette logique-là, les balises img sont dotées des déclarions max-width:100% et height:auto.

    Lorsque des médias sont insérés dans le texte sans paramètres de taille genre <mediaXXX|left|insert>, dans le code html, outre les attribut standard de width et height, l’image se voit attribuer un attribut style="width:xxxx";height:zzzz" ce qui contrarie le bon affichage (l’image est déformée)

    Si l’insertion se fait en insérant un paramètre de taille genre <mediaXXX|left|insert|taille=grand>, alors, l’image ne se voit pas dotée d’attribut de style, donc c’est OK, les CSS font leur travail.

    À part fouetter les rédacteurs pour qu’ils pensent à indiquer systématiquement un paramètre de taille, comment peut-on contourner l’obstacle et faire en sorte que l’affichage soit toujours correct en proportion ?

    Mais c’’est peut-être moi qui ai loupé quelque chose...

    • OK,

      il semble que images_reduire (qui est appliqué quand on précise une taille) peuple bien les tags HTML width et height mais sans ajouter leur valeur avec le tag style. Or, en l’absence de redimensionnement, l’information était donné à la fois en style CSS inline et avec les tags HTML.

      C’est modifié en version 1.2.14. Seuls les tags HTML sont gardés.

    Reply to this message

Ajouter un commentaire

Who are you?
[Log in]

To show your avatar with your message, register it first on gravatar.com (free et painless) and don’t forget to indicate your Email addresse here.

Enter your comment here

This form accepts SPIP shortcuts {{bold}} {italic} -*list [text->url] <quote> <code> and HTML code <q> <del> <ins>. To create paragraphs, just leave empty lines.

Add a document

Follow the comments: RSS 2.0 | Atom