# Add into a header block:

  <!-- Bespoke jquery-ui extension for turnstyle open/close blocks -->
  <gsf:style  src="ext/jquery-ui-extra/turnstyle-block.css"/>
  <gsf:script src="ext/jquery-ui-extra/turnstyle-block.js"/>

# For example, in your collectionConfig.xml, in the format-block for <display>
# if using turnstyles on the document page
#
# If using, for example, on the About page, then adding the lines into
# the appropriate 'additionalHeader' template rule in header.xsl
# would be the way to go

  <display>
    <format>
      <!-- .... -->
    
      <xsl:template name="additionalHeaderContent">
        <gsf:style  src="ext/jquery-ui-extra/turnstyle-block.css"/>
        <gsf:script src="ext/jquery-ui-extra/turnstyle-block.js"/>
      </xsl:template>
      
    </format>
  </display


# An example of an HTML using the turnstyle feature is:

   <div id="myblock-turnstyle">
     <div style="background-image: none; background-color: rgb(80%,80%,20%);">
       My Block: Heading
     </div>

     <div class="documenttext" style="display: none;">
       <p>
         Sample text ...
       </p>
      </div>
    </div>

    <script>
      <xsl:text disable-output-escaping="yes">
        $(function(){
          transformToTurnstyleBlock("myblock");
        });
      </xsl:text>
    </script>