Traitement des images

Web Content Integrator possède une fonction de traitement des images ce qui permet de créer des images référencées dans des éléments HTML et de texte enrichi comme composants d'image lors du traitement d'un flux.

Configuration du traitement des images

Les paramètres suivants peuvent être définis dans le fichier WCMConsumerPlugin.properties :
Activation et désactivation du traitement des images
Le traitement des images est activé par défaut. Pour désactiver le traitement des images, définissez la propriété suivante : disable.img.processing=true

Si le traitement des images est activé, les adresses URL spécifiées dans les attributs "src" des balises d'image ne doivent pas contenir une chaîne de requête car tous les éléments qui suivent un point d'interrogation sont ignorés lorsque le composant d'image est créé.

Par exemple, <img src="http://<host_name>/program/path?param1=hello&param2=a.jpg" ...> and <img src="http://<host_name>/program/path?param1=world&param2=b.jpg" ...> crée et met à jour le même composant d'image nommé "program.path".

Activation et désactivation des images de texte enrichi imbriquées
Les images peuvent être imbriquées directement dans des éléments de texte enrichi ; il n'est pas nécessaire de créer un composant d'image au préalable. Cette fonction permet de traiter les images des éléments de texte enrichi consommés par Web Content Integrator de la même manière que les images ajoutées aux éléments de texte enrichi dans l'interface utilisateur de création. Par défaut, les images de texte enrichi imbriquées sont désactivées. Pour les activer, définissez les propriétés suivantes :
  • disable.img.processing=false
  • richtext.embedded.images.enabled=true

URL de source d'image absolues

Les images des éléments HTML et de texte enrichi peuvent être spécifiées à l'aide d'URL HTTP absolues dans l'attribut de la source d'image. Web Content Integrator traite les URL absolues de source d'image comme indiqué dans le flux.

Exemple d'élément de flux :
<item>
    <title>RichText Component With Image 1</title>
    <pubDate>Thu, 30 Mar 2011 16:00:00 EDT</pubDate>
    <guid>Image_Example_1</guid>
    <ibmwcm:action>add</ibmwcm:action>
    <ibmwcm:itemType>Component</ibmwcm:itemType>
    <ibmwcm:element>
      <ibmwcm:type>rich text</ibmwcm:type>
      <ibmwcm:value>
         <![CDATA[
         <p>Image 1:</p><img src="http://wci-feed-server/img/f/flower.jpg"/>
         <p>Image 2:</p><img src="http://wci-feed-server/img/g/guitar.jpg"/>
         ]]>
      </ibmwcm:value>
    </ibmwcm:element>
  </item>

URL de source d'image relatives

Les images des éléments HTML et de texte enrichi peuvent être spécifiées à l'aide d'URL HTTP relatives dans l'attribut de la source d'image et d'une URL de base de l'élément link de l'élément. Web Content Integrator traite les URL relatives de source d'image comme une concaténation de l'élément link de l'élément et des attributs de source d'image dans le HTML.

Exemple d'élément de flux :
<item>
    <title>RichText Component With Image 2</title>
    <pubDate>Thu, 30 Mar 2011 16:00:00 EDT</pubDate>
    <guid>Image_Example_2</guid>
    <link>http://wci-feed-server</link>
    <ibmwcm:action>add</ibmwcm:action>
    <ibmwcm:itemType>Component</ibmwcm:itemType>
    <ibmwcm:element>
      <ibmwcm:type>rich text</ibmwcm:type>
      <ibmwcm:value>
         <![CDATA[
         <p>Image 1:</p><img src="/img/p/penguin.jpg"/>
         <p>Image 2:</p><img src="/img/s/sunset.jpg"/>
         ]]>
      </ibmwcm:value>
    </ibmwcm:element>
  </item>

Comment utiliser des URL de source d'image absolues et relatives

Les images des éléments HTML et de texte enrichi peuvent être spécifiées à l'aide d'une combinaison d'URL HTTP relatives et absolues dans les attributs de source d'image. The Web Content Integrator processes relative image source URLs as a concatenation of the item's link element and image source attributes in the HTML. The Web Content Integrator processes absolute image source URLs as specified in the feed.

Exemple d'élément de flux :
<item>
    <title>RichText Component With Image 3</title>
    <pubDate>Thu, 30 Mar 2011 16:00:00 EDT</pubDate>
    <guid>Image_Example_3</guid>
    <link>http://wci-feed-server</link>
    <ibmwcm:action>add</ibmwcm:action>
    <ibmwcm:itemType>Component</ibmwcm:itemType>
    <ibmwcm:element>
      <ibmwcm:type>rich text</ibmwcm:type>
      <ibmwcm:value>
         <![CDATA[
         <p>Image 1:</p><img src="http://www.ibm.com/favicon.ico"/>
         <p>Image 2:</p><img src="/img/f/fish.jpg"/>
         <p>Image 3:</p><img src="/img/g/grapes.jpg"/>
         ]]>
      </ibmwcm:value>
    </ibmwcm:element>
  </item>

Résultats attendus pour un composant de texte enrichi

Exemple d'élément de flux de composant de texte enrichi :
<item>
    <title>RichText Component With Image 4</title>
    <pubDate>Thu, 30 Mar 2011 16:00:00 EDT</pubDate>
    <guid>Image_Example_4</guid>
    <ibmwcm:action>add</ibmwcm:action>
    <ibmwcm:itemType>Component</ibmwcm:itemType>
    <ibmwcm:element>
      <ibmwcm:type>rich text</ibmwcm:type>
      <ibmwcm:value>
         <![CDATA[
         <p>Image 1:</p><img src="http://wci-feed-server/img/l/leaf.jpg"/>
         ]]>
      </ibmwcm:value>
    </ibmwcm:element>
  </item>
Composant de texte enrichi avec traitement des images désactivé :
  • Un composant de texte enrichi intitulé : "RichText Component With Image 4" est créé dans la bibliothèque de flux.
  • Source HTML du composant de texte enrichi : <p>Image 1:</p><img src="http://wci-feed-server/img/l/leaf.jpg">
  • Le HTML du texte enrichi n'est pas modifié.
  • La source de l'image n'est pas gérée car Web Content Manager ne peut pas détecter une source d'image endommagée.
Composant de texte enrichi avec traitement des images activé :
  • Un composant de texte enrichi intitulé : "RichText Component With Image 4" est créé dans la bibliothèque de flux.
  • Un composant d'image intitulé "img.l.leaf.jpg" est créé dans la bibliothèque de flux.
  • Source HTML du composant de texte enrichi : <p>Image 1:</p><img src="/wps/wcm/myconnect/[IMAGE COMPONENT ID]/leaf.jpg?MOD=AJPERES">
  • La source de l'image est remplacée par une URL pointant vers l'image nouvellement créée.
  • La source de l'image est gérée par Web Content Manager et est mise à jour en même temps que le composant d'image.
Composant de texte enrichi avec images imbriquées activées :
  • Un composant de texte enrichi intitulé : "RichText Component With Image 4" est créé dans la bibliothèque de flux.
  • Source HTML du composant de texte enrichi : <p>Image 1:</p><img src="/wps/wcm/myconnect/[RT COMPONENT UUID]/1/img.l.leaf.jpg?MOD=AJPERES">
  • Le HTML du texte enrichi est modifié et remplace la source d'image par une URL pour l'image imbriquée dans le composant de texte enrichi.
  • La source de l'image est gérée par Web Content Manager et est mise à jour lorsque le texte enrichi est modifié.

Résultats attendus pour un composant HTML

Exemple d'élément de flux :
<item>
    <title>HTML Component With Image 1</title>
    <pubDate>Thu, 30 Mar 2011 16:00:00 EDT</pubDate>
    <guid>Image_Example_5</guid>
    <ibmwcm:action>add</ibmwcm:action>
    <ibmwcm:itemType>Component</ibmwcm:itemType>
    <ibmwcm:element>
      <ibmwcm:type>html</ibmwcm:type>
      <ibmwcm:value>
         <![CDATA[
         <p>Image 1:</p><img src="http://wci-feed-server/img/l/leaf.jpg"/>
         ]]>
      </ibmwcm:value>
    </ibmwcm:element>
  </item>
Elément HTML avec traitement des images désactivé
  • Un composant HTML intitulé "HTML Component With Image 1" est créé dans la bibliothèque de flux.
  • Source HTML du composant HTML : <p>Image 1:</p><img src="http://wci-feed-server/img/l/leaf.jpg"/>
  • Le HTML n'est pas modifié.
  • The image source is unmanaged because Web Content Manager cannot detect a broken image source.
Elément HTML avec traitement des images activé
  • Un composant HTML intitulé "HTML Component With Image 1" est créé dans la bibliothèque de flux.
  • Un composant d'image intitulé "img.l.leaf.jpg" est créé dans la bibliothèque de flux.
  • Source HTML du composant HTML : <p>Image 1:</p><img src="<Component id="[IMAGE COMPONENT ID]" name="img test 1/img.l.leaf.jpg" format="url"/>"/>
  • La source de l'image est remplacée par une balise de composant pointant vers l'image qui vient d'être créée.
  • The image source is managed by Web Content Manager and is updated as the image component is updated.