Changeset 36392 for documented-examples
- Timestamp:
- 2022-08-18T17:30:59+12:00 (20 months ago)
- File:
-
- 1 edited
Legend:
- Unmodified
- Added
- Removed
-
documented-examples/trunk/style-e/resources/collectionConfig.properties
r36370 r36392 11 11 12 12 13 shortDescription=<p>This collection demonstrates Greenstone's use of Cascading Style Sheets (CSS) for visual formatting in web browsers. (Greenstone uses CSS instead of HTML tables since version 2.63.) On every page, you can change the style-sheet in effect, to modify that page's appearance.</p>13 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> 14 14 15 description1=<p> This collection contains the same material as the original Greenstone demo collection.</p>15 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 <pre>Format > Format Features > global</pre> 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> 16 16 17 description2=<p>An <a href='_httpcollection_/macros/extra.dm'>extra.dm</a> macro file is used by the collection to provide the stylesheet switching. This redefines a few macros from the <i>Style</i> package: <b>\_cssheader\_</b>, to link to multiple stylesheets; <b>\_optnavigationbar\_</b>, to display the links to click; and <b>\_pagescriptextra\_</b>, to facilitate the switching when a link is clicked.</p> 17 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\ 18 <pre> \n\ 19 <xsl\:template name="additionalHeaderContent"> \n\ 20 <xsl\:variable name="httpCollection"> \n\ 21 <xsl\:value-of select="/page/pageResponse/collection/metadataList/metadata[@name='httpPath']"/> \n\ 22 </xsl\:variable> \n\ 23 <link rel="stylesheet" href="{$httpCollection}/style/gs3-style-default-extra.css" type="text/css" \n\ 24 title="GS3 Style" id="custom-style" charset="UTF-8"/> \n\ 25 \n\ 26 <script src="{$httpCollection}/script/custom-script.js" type="text/javascript"> \n\ 27 </script> \n\ 28 \n\ 29 </xsl\:template> \n\ 30 \n\ 31 \n\ 32 <xsl\:template name="create-banner"> \n\ 33 \n\ 34 <div class="choose_style"> \n\ 35 Choose a style\: \n\ 36 <a href="#" onclick="replaceStyle('gs3-style-default-extra');return false;">Default Greenstone</a>, \n\ 37 <a href="#" onclick="replaceStyle('gs3-style-blue');return false;">Blue</a>, \n\ 38 <a href="#" onclick="replaceStyle('gs3-style-olive-purple');return false;">OlivePurple</a>, \n\ 39 <a href="#" onclick="replaceStyle('');return false;">None</a> \n\ 40 </div> \n\ 41 \n\ 42 <div id="gs_banner" class="ui-widget-header ui-corner-bottom"> \n\ 43 <div id="titlesearchcontainer"> \n\ 44 \n\ 45 <xsl\:call-template name="page-title-area"/> \n\ 46 <xsl\:call-template name="quick-search-area"/> \n\ 47 <div style="clear\:both;"><xsl\:text> </xsl\:text></div> \n\ 48 </div> \n\ 49 <xsl\:call-template name="browsing-tabs"/> \n\ 50 </div> \n\ 51 </xsl\:template> \n\ 52 </pre> \n\ 53 </p> 18 54 19 55 description3=<p>If you want to download any of these stylesheets for your own collections, here are links to them: \n\ 20 56 <ul> \n\ 21 <li><a href=' _httpimages_/style.css'>Default Greenstone Style</a></li> \n\22 <li><a href=' _httpcstyle_/style-blue.css'>âOcean Blueâ theme</a></li> \n\23 <li><a href=' _httpcstyle_/style-red.css'>âFire Redâ theme</a></li> \n\24 <li> <a href='_httpimages_/style-print.css'>Printer</a></li> \n\57 <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\ 58 <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\ 59 <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\ 60 <li>None - clears all CSS styling from the current page (needs reload to get the default GS3 style back)</li> \n\ 25 61 </ul> \n\ 26 62 </p> … … 28 64 description4=<p><b>Using a downloaded stylesheet</b> \n\ 29 65 <ul> \n\ 30 <li>To use a stylesheet as the default, place it in greenstone/web/style and rename it to style.css. This will affect all collections.</li> \n\ 31 <li>To use a stylesheet for a particular collection, place it in the collection's style directory, add an extra.dm file to the collection's macros directory, and add a macro like the following (this uses style-red.css as the example):<br/> <small><tt> <br/> package Style<br/> <br/> \_cssheader\_ {<br/> <link rel='stylesheet' href='\_httpcstyle\_/style-red.css'<br/> type='text/css' title='Fire Red' charset='UTF-8'><br/> }<br/> </tt></small> </li> \n\ 66 <li>To use a stylesheet as the default, place it in greenstone/web/interfaces/default/style and rename it to <pre>style.css</pre>. This will affect all collections.</li> \n\ 67 <li>To use a stylesheet for a particular collection, place it in greenstone/web/sites/localsite/collect/<collection>/style then specify the stylesheet link in the <b>additionalHeaderContent</b> of GLI's <i>global</i> format statement (<pre>Format > Format Features > global</pre>) as follows: \n\ 68 <pre><xsl\:template name="additionalHeaderContent"> \n\ 69 <xsl\:variable name="httpCollection"> \n\ 70 <xsl\:value-of select="/page/pageResponse/collection/metadataList/metadata[@name='httpPath']"/> \n\ 71 </xsl\:variable> \n\ 72 <link href="{$httpCollection}/style/stylesheet-name.css" rel="stylesheet" type="text/css"/> \n\ 73 </xsl\:template></pre> \n\ 74 </li> \n\ 32 75 </ul> \n\ 33 76 </p>
Note:
See TracChangeset
for help on using the changeset viewer.
