source: documented-examples/trunk/style-e/resources/collectionConfig.properties@ 36619

name=Cascading Style Sheets<br/> Demo collection
textdate=publication date\: 
textnumpages=no. of pages\: 
textsource=source ref\: 
section_chapter=chapter
document_book=book

dls.Organization=Organizations
dls.Subject=Subjects
index_text=Text
index_document=Book
index_section=Chapter
dls.Titles=Titles
dls.Keyword=How to
depositormetadata={"name"\:"dls.Title","label"\:"Title","tooltip"\:"dls.Title\: The title of this resource.","type"\:"text"}, {"name"\:"dls.Organization","label"\:"Organization","tooltip"\:"dls.Organization\: The organization responsible for producing this resource.","type"\:"text"}, {"name"\:"dls.Subject","label"\:"Subject","tooltip"\:"dls.Subject\: The subject of this resource.","type"\:"text"}, {"name"\:"dls.Keyword","label"\:"Keyword","tooltip"\:"dls.Keyword\: A more specific indication of what the resource can be used for.","type"\:"text"}, {"name"\:"dls.Language","label"\:"Language","tooltip"\:"dls.Language\: The language of this resource.","type"\:"text"}


shortDescription=<p>This collection demonstrates Greenstone's use of Cascading Style Sheets (CSS) for visual formatting in web browsers. On every page, you can change the style-sheet in effect, to modify that page's appearance. This collection contains the same material as the original Greenstone demo collection.</p>

description1=<p>A combination of JavaScript and the overriding of GS3 XSL templates in Greenstone 3's <i>global</i> format statement is used by the collection to provide the stylesheet switching. As in some other <i>Documented Example Collections</i>, GLI's <tt>Format &gt; Format Features &gt; global</tt> can be used to define the <b>additionalHeaderContent</b> template. Doing so overrides the existing <i>additionalHeaderContent</i> template, and appends any specified HTML elements to the HTML header.</p>

description2=<p>In this case, the <b>additionalHeaderContent</b> specifies the custom collection stylesheet currently active and the JavaScript to facilitate the stylesheet switching when a link is clicked. The <b>create-banner</b> XSL template in the <i>global</i> format statement is also overridden to provide links to the multiple stylesheets within the existing GS3 banner section, and invoke the custom JavaScript when any link is clicked. \n\
<pre> \n\
  &lt;xsl\:template name="additionalHeaderContent"&gt; \n\
    &lt;xsl\:variable name="httpCollection"&gt; \n\
      &lt;xsl\:value-of select="/page/pageResponse/collection/metadataList/metadata[@name='httpPath']"/&gt; \n\
    &lt;/xsl\:variable&gt; \n\
    &lt;link rel="stylesheet" href="{$httpCollection}/style/gs3-style-default-extra.css" type="text/css"  \n\
       title="GS3 Style" id="custom-style" charset="UTF-8"/&gt; \n\
    &lt;script src="{$httpCollection}/script/custom-script.js" type="text/javascript"&gt; \n\
    &lt;/script&gt; \n\
  &lt;/xsl\:template&gt; \n\
 \n\
  &lt;xsl\:template name="create-banner"&gt;   \n\
    &lt;div class="choose_style"&gt; \n\
        Choose a style\: \n\
        &lt;a href="#" onclick="replaceStyle('gs3-style-default-extra');return false;"&gt;Default Greenstone&lt;/a&gt;, \n\
        &lt;a href="#" onclick="replaceStyle('gs3-style-blue');return false;"&gt;Blue&lt;/a&gt;, \n\
        &lt;a href="#" onclick="replaceStyle('gs3-style-olive-purple');return false;"&gt;OlivePurple&lt;/a&gt;,      \n\
        &lt;a href="#" onclick="replaceStyle('');return false;"&gt;None&lt;/a&gt; \n\
        &lt;/div&gt; \n\
    &lt;div id="gs_banner" class="ui-widget-header ui-corner-bottom"&gt;         \n\
      &lt;div id="titlesearchcontainer"&gt; \n\
    &lt;xsl\:call-template name="page-title-area"/&gt;   \n\
    &lt;xsl\:call-template name="quick-search-area"/&gt; \n\
    &lt;div style="clear\:both;"&gt;&lt;xsl\:text&gt; &lt;/xsl\:text&gt;&lt;/div&gt;     \n\
      &lt;/div&gt; \n\
      &lt;xsl\:call-template name="browsing-tabs"/&gt;   \n\
    &lt;/div&gt; \n\
  &lt;/xsl\:template&gt; \n\
</pre> \n\
</p>

description3=<p>If you want to download any of these stylesheets for your own collections, here are links to them\: \n\
<ul> \n\
<li><a href='https\://trac.greenstone.org/browser/documented-examples/trunk/style-e/style/gs3-style-default-extra.css'>GS3 default extra</a> - builds on top of GS3's default style</li> \n\
<li><a href='https\://trac.greenstone.org/browser/documented-examples/trunk/style-e/style/gs3-style-blue.css'>Blue theme</a> - modifies the GS3 default style for a blue colouring</li> \n\
<li><a href='https\://trac.greenstone.org/browser/documented-examples/trunk/style-e/style/gs3-style-olive-purple.css'>olive-purple theme</a> - modifies the GS3 default style for a vivid colouring of vine green and purples</li> \n\
<li>None - clears all CSS styling from the current page (needs reload to get the default GS3 style back)</li> \n\
</ul> \n\
</p>

description4=<p><b>Using a downloaded stylesheet</b> \n\
<ul> \n\
<li>To use a stylesheet as the default, place it in greenstone/web/interfaces/default/style and rename it to <tt>style.css</tt>. This will affect all collections.</li> \n\
<li>To use a stylesheet for a particular collection, place it in <tt>greenstone/web/sites/localsite/collect/&lt;collection&gt;/style</tt> then specify the stylesheet link in the <b>additionalHeaderContent</b> of GLI's <i>global</i> format statement (<tt>Format &gt; Format Features &gt; global</tt>) as follows\: \n\
<pre>&lt;xsl\:template name="additionalHeaderContent"&gt; \n\
    &lt;xsl\:variable name="httpCollection"&gt; \n\
      &lt;xsl\:value-of select="/page/pageResponse/collection/metadataList/metadata[@name='httpPath']"/&gt; \n\
    &lt;/xsl\:variable&gt; \n\
    &lt;link href="{$httpCollection}/style/stylesheet-name.css" rel="stylesheet" type="text/css"/&gt; \n\
&lt;/xsl\:template&gt;</pre> \n\
</li> \n\
</ul> \n\
</p>