Added ability to link to BlogPosts via "page" attribute of the "css-switch-link" macro
Added methods to VelocityHelper to simplify embedding in Velocity decorators
New icons
Installation
The plugin is available from Atlassian Plugin Repository. Alternatively grab the jar referenced above and install manually via Administration Console/Plugins.
The plugin has no external dependencies.
Usage
Once you have installed the extension you can apply it to the main decorator of any space that uses default Confluence theme.
To include the CSS Switcher JavaScript library use the following in the HTML head section of the Velocity decorator templates.
The eventual placement of the link to the Javascript library is performed by Confluence automatically somewhere within the HTML <head> tag. The call to the Javascript library has to be after the links to the alternate CSS style sheets. This implies putting the style sheets as high up the HTML <head> tag as possible. This however results in the inability to override existing styles being put by Confluence among the results.
To overcome this use All flavor of the calls below instead of the resource call above
To render a set of alternate stylesheets insert the following in the HTML head section of the Velocity decorator templates.
This will instruct Confluence to render links to all files with content type "text/css" attached to the home page of the current space. If the All flavor of the code was used - the link to the JS library will be rendered too immediately after the stylesheets.
Alternatively, specify the page where to look for files explictly.
$!cssSwitchHelper.renderHtmlHeaders($sitemeshPage.getProperty("page.spacekey"), "My Page")
or
$!cssSwitchHelper.renderAllHtmlHeaders($sitemeshPage.getProperty("page.spacekey"), "My Page")
If you have a preferred alternate style sheet that you want to be enabled by default use
$!cssSwitchHelper.renderHtmlHeadersPreferred($sitemeshPage.getProperty("page.spacekey"),
"My Page", "Blue Style")
or
$!cssSwitchHelper.renderAllHtmlHeadersPreferred($sitemeshPage.getProperty("page.spacekey"),
"My Page", "Blue Style")
References to attached text/css files with no comments will be rendered as persistent style sheets.
Use css-switch-link macro to render links to select the alternate style-sheet.
Besides all standard HTML parameters the macro supports optional parameters "styleSheet" to reference the one that should be activated on click and "page" to create a link to a Confluence page.
{css-switch-link:Blue Style|id=rswitch|class=switchlink|style=text-decoration:none
|title=Click here to switch to red text style and go futher.
|page=TEST:Further}Switch to red text now and go further.{css-switch-link}
results in:
<a href="/display/TEST/Further"
title="Click here to switch to red text style and go futher."
style="text-decoration:none"
class="switchlink"
id="rswitch"
onclick="setActiveStyleSheet('Blue Style')">
Switch to red text now and go further.</a>
An empty value for styleSheet parameter or no parameter specified will result in a switch to preferred style sheet or the first alternate if no preferred exists in the document
Once the user selects the style sheet the choice is stored into a cookie and applied on the next visit to this or subsequent pages. If this is not desired - enable CSS Switcher JavaScript No Cookies flavor of CSS Switcher JavaScript in Adminstration/Plugins instead of the default one.
Errara
get access to sitemeshpage implicitly from Velocity helper
make it possible to apply to an existing 3rd party theme
