Base de connaissancesRéférences XMLTypes des données

Les images [image]

Les images [image]
Le terme image est employé pour qualifier le type d'une donnée Blogger.
Une donnée de type image contient l'url d'une image.

Présentation

Ce type de données hérite des caractéristiques des données de type string. Ces données contiennent des URLs d'images et diverses caractéristiques.

Vous trouverez la liste complète dans la bibliothèque [filtre image].


Les opérateurs

Les données de type images peuvent être injectées dans la majorité des opérations.
Consultez les opérateurs au cas par cas pour connaître ceux qui acceptent les données images entrantes et ceux qui renvoient un résultat de type image.


Paramètres additionnels

Certains types de données disposent de paramètres additionnels qui permettent d'obtenir des informations supplémentaires ou d'appliquer une caractéristique à la donnée. C'est le cas des données de type image :

Paramètre Type de la valeur Signification
isResizable boolean Renvoie une valeur de type booléenne qui détermine si l'image peut être redimensionnée avec les opérateurs d'images.
isYoutube boolean Vérifie si l'image provient de YouTube.
youtubeMaxResDefaultUrl image Renvoie l'url de l'image HD YouTube.
width number Renvoie la largeur mentionnée dans les metas de l'image.
height number Renvoie la hauteur mentionnée dans les metas de l'image.

Les données de type image héritent automatiquement des caractéristiques des données de type string.

Paramètre Type de la valeur Signification
length number Renvoie le nombre de caractères contenus dans la chaîne.
size
escaped string Échappement HTML d'une chaîne de caractères.
jsEscaped string Échappement JS d'une chaîne de caractères.
jsonEscaped string Échappement JSON d'une chaîne de caractères.
cssEscaped string Échappement CSS d'une chaîne de caractères.


D'un point de vue technique, ces paramètres sont des données contenues dans un objet et qui renvoient une nouvelle valeur :


Représentation des ressources


En pratique, les paramètres s'ajoutent simplement au nom de la donnée et renvoie une nouvelle valeur.
Quelques exemples avec la donnée universelle data:view.featuredImage :


URL de l'image
data:view.featuredImage

L'image peut être redimensionnée ?
data:view.featuredImage.isResizable

L'image provient de YouTube ?
data:view.featuredImage.isYoutube

URL de l'image HD YouTube
data:view.featuredImage.youtubeMaxResDefaultUrl

Largeur (Meta)
data:view.featuredImage.width

Hauteur (Meta)
data:view.featuredImage.height

Longueur de l'url de l'image
data:view.featuredImage.size

Échappement HTML
data:view.featuredImage.escaped

Échappement JS
data:view.featuredImage.jsEscaped

Échappement JSON
data:view.featuredImage.jsonEscaped

Échappement CSS
data:view.featuredImage.cssEscaped


Exemple 1 - Redimensionner une image
<b:if cond='data:view.featuredImage.isResizable'>
  <img expr:src='resizeImage(data:view.featuredImage,500,"1:1")'/>
</b:if>
Si data:view.featuredImage.isResizable renvoie la valeur true, l'image pourra être redimensionnée à l'aide de l'opérateur resizeImage.

Exemple 2 - Extraire l'image HD YouTube
<b:if cond='data:view.featuredImage.isYoutube'>
  <img expr:src='resizeImage(data:view.featuredImage.youtubeMaxResDefaultUrl,500,"16:9")'/>
</b:if>
Si data:view.featuredImage.isYoutube renvoie la valeur true, la donnée contiendra l'image HD Youtube. La nouvelle valeur sera de type "image" et pourra également être redimensionnée.


array[image]

array[image] est un type de tableau contenant que des valeurs de type image.

array["https//...photodetoto.jpg","https//...photodetiti.jpg","https//...photodetutu.jpg"]

Il n'existe aucun tableau de ce type dans la bibliothèque des données Blogger, mais si une telle donnée existait, il faudrait employer la balise b:loop

Exemple fictif
<b:loop values='data:arrayIMAGE' var='itemIMAGE'>

  <data:itemIMAGE/>

</b:loop>

Pourquoi avoir mentionné le type array[image] dans cette documentation si aucune donnée de ce type ne figure dans la bibliothèque ?
Il est vrai que la bibliothèque ne contient pas de tableau de ce type, mais il est possible d'en créer. Pour cela, vous devez utiliser une donnée de type array[object] avec l'opérateur lambda map qui se chargera de regrouper une donnée de type image contenue dans l'objet du tableau.

Syntaxe
array[object] map (var => var.featuredImage)

Exemple
<b:loop values='data:posts map (x => x.featuredImage)' var='postImage'>

  Image : <img expr:src='data:postImage'/>

</b:loop>
L'opérateur map compile les valeurs de la donnée image contenue dans le tableau objet data:posts. Le nouveau tableau de dates est créé et stocké dans la variable postImage.
Assistance publique pour le produit Blogger sur les supports  d'aides :

Certifiée par Google - Experte Platine TC (Ambassador & Advanced Troubleshooter):
  • Affectation Google France, produit Blogger, du 11/07/2011 au 28/07/2014.
  • Affectation Google US, produit Blogger depuis le 28/07/2014.

Posts les plus consultés de ce blog

DéveloppementsMulti-versions
Facebook : Bouton J'aime [Like button]
Populaire
DéveloppementsFichiers XML
Populaire
Base de connaissancesFonctionnalitésÉditeurs
Populaire