How to link an URL inside the them from the Diazo

Question

If an URL to a image is set in a HTML template, then the URL is updated to reference files inside the theme folder. For example,

<img src="image.png" />

is replaced by:

<img src="http://localhost:8080/mysite/++theme++mytheme-theme/image.png" />

However, if I write following Diazo rule:

<replace css:content="#some-class">
   <div id="#some-class"><img src="image.png" /></div>
</replace>

the URL of the image is not update. How can I write Diazo rules where the image gets correctly referred. I want to refer this image in the template HTML file with <img src="path/image.png">. However it is not clear what to put instead of path. I notice that path cannot be an absolute path because it depends of the site domain. Also, it cannot be a relative path because it depends on the path of each page in the site. May be it would be useful to have an specific keyword to reference the theme folder. For example, <img src="$themeFolder/image.png">. Exists such keyword?

Answer 1

You may create XSLT parameters in your theme's manifest.cfg file. Just add a stanza like:

[theme:parameters]
theme_base_url = string:${portal_state/portal_url}/++theme++mytheme-theme/

Then you may use it in your rules file:

<replace css:content="#some-class">
   <div id="#some-class">
     <img><xsl:attribute name="src"><xsl:value-of select='$theme_base_url' />image.png</xsl:attribute></img>
  </div>
</replace>