3

I'm using a diazo (currently plone.app.theming 1.0b1-r48205) with Plone 4.1. I want to use exactly Plone's html for the search widget except that I'd like to replace <input> element used for the search button in the search widget with a <button>. The diazo docs seem to suggest you can do this.

In my theme html file I have an empty <div id="portal-searchbox"></div>. In my rules.xml I have the following:

<rules if-content="$enabled">
    <replace css:theme="div#portal-searchbox">
        <xsl:apply-templates css:select="div#portal-searchbox" />
    </replace>    
    <xsl:template css:match="div#portal-searchbox input.searchButton">
        <button type="submit"><img src="images/search.png" alt="Search" /></button>
    </xsl:template>
</rules>

I've tried numerous variations of this but with no success. Any help would be much appreciated.

scarba05
  • 2,943
  • 1
  • 27
  • 29
  • 2
    I really need a reproducible example to offer any help here. I suggest stripping your rules, theme and content down to the minimum required to show the problem and then post those somewhere for us to look at. You need to ensure the example can be run from the commandline (bin/diazorun - if it's not there create a new buildout part with the zc.recipe.egg recipe and eggs=diazo) – Laurence Rowe Apr 22 '11 at 11:06

1 Answers1

6

Ok, so the following works. The reason it wasn't working before was that the <xsl:template> was not in the root level rules tag (there's a documentation bug there). The <xsl:template> must be in the root level rules tag because there is no way to apply rule conditions to an <xsl:template> currently.

<xsl:template css:match="div#portal-searchbox input.searchButton">
     <button type="submit"><img src="images/search.png" alt="Search" /></button>
</xsl:template>

<replace css:theme="div#portal-searchbox" css:content="div#portal-searchbox"/>

Update: I've added support for <replace content="..."> to Diazo, so inline <xsl:template>'s are considered deprecated. Instead use:

<replace css:content="div#portal-searchbox input.searchButton">
    <button type="submit"><img src="images/search.png" alt="Search" /></button>
</replace>
<replace css:theme="div#portal-searchbox" css:content="div#portal-searchbox"/>

Documentation at http://diazo.org/advanced.html#modifying-the-content-on-the-fly

Laurence Rowe
  • 2,909
  • 17
  • 20
  • 1
    Exactly as Laurence suggests (thanks Laurence!) - wasn't working because I was trying to do this inside a nested rules element. I've edited my question to make this clear. Note that I ended up putting a within my so that the transform only happened with $enabled set – scarba05 Apr 22 '11 at 22:22