The Apache Maven Fluido Skin is an Apache Maven site skin built on top of Twitter's Bootstrap 2.2.2.
A sample page is provided to see the skin in action, and two complete sites to show skin configurations: one for sidebar layout (default) and the other for topbar layout.
To use this skin in your project, use the skin element of the site.xml site descriptor:
<project name="xxx"> [...] <skin> <groupId>org.apache.maven.skins</groupId> <artifactId>maven-fluido-skin</artifactId> <version>1.3.1-SNAPSHOT</version> </skin> [...] </project>
The skin supports different layouts, enabling/disabling the left sidebar menu and the topbar menu. Users have just play with flags in the custom.fluidoSkin element in site.xml:
<project name="xxx"> [...] <custom> <fluidoSkin> <topBarEnabled>true</topBarEnabled> <sideBarEnabled>false</sideBarEnabled> </fluidoSkin> </custom> [...] </project>
That allows users having 4 skins in only 1!
Default skin setting is the option 1.
When users decide to enable the topbar, they can plug a small icon/logo there (typically 108*20 px) just configuring the custom.fluidoSkin.topBarIcon element in site.xml:
<project name="xxx"> [...] <custom> <fluidoSkin> <topBarEnabled>true</topBarEnabled> <topBarIcon> <name>Maven Fluido Skin</name> <alt>Maven Fluido Skin</alt> <src>/images/topbar-logo.png</src> <href>/index.html</href> </topBarIcon> </fluidoSkin> </custom> [...] </project>
You can configure the style attribute value of the div container for your topbar
<project name="xxx"> [...] <custom> <fluidoSkin> <topBarEnabled>true</topBarEnabled> <topBarContainerStyle>width: 90%;</topBarContainerStyle> </fluidoSkin> </custom> [...] </project>
You can configure style of your top bar nav (since bootstrap 2.1.0 is not anymore black by default). Use navbar-inverse to have the black one.
<project name="xxx"> [...] <custom> <fluidoSkin> <topBarEnabled>true</topBarEnabled> <navBarStyle>navbar-inverse</navBarStyle> </fluidoSkin> </custom> [...] </project>
When using sidebar, the left column used by default span3 class and body column use span9. To prevent weird/ugly result, the sum must be 12. You can change that using:
<project name="xxx"> [...] <custom> <fluidoSkin> <leftColumnClass>span2</leftColumnClass> <bodyColumnClass>span10</bodyColumnClass> </fluidoSkin> </custom> [...] </project>
Users can optionally enable the Google Search for the generated site, requirements are:
<project name="xxx"> [...] <url>http://maven.apache.org/skins/maven-fluido-skin</url> [...] </project>
<project name="xxx"> [...] <custom> <fluidoSkin> <googleSearch> <sitesearch/> </googleSearch> </fluidoSkin> </custom> [...] </project>
By default, the search form:
External links are either rendered in the sidebar or the topbar. When both sidebar and topbar are enabled, they are rendered as dropdown in the topbar only.
Source code sections are enhanced by Google Code Prettify, users can optionally enable line numbers rendering (disabled by default):
<project name="xxx"> [...] <custom> <fluidoSkin> <sourceLineNumbersEnabled>true</sourceLineNumbersEnabled> </fluidoSkin> </custom> [...] </project>
Since version 1.3.1, you can configure a copyright class:
<project name="xxx"> [...] <custom> <fluidoSkin> <copyrightClass>pull-right</copyrightClass> </fluidoSkin> </custom> [...] </project>
Since #eval Velocity macro is not supported yet, the only placeholder available in additional footers is @project.name@.
Since version 1.1, fluido-skin supports GitHub ribbons to simplify the Fork me on GitHub banner integration. Users must define:
<project name="xxx"> [...] <custom> <fluidoSkin> <gitHub> <projectId>apache/maven-skins</projectId> <ribbonOrientation>right</ribbonOrientation> <ribbonColor>black</ribbonColor> </gitHub> </fluidoSkin> </custom> [...] </project>
As shown in the MOJOs list, plugins life-cycle are characterized by different status/stages:
Users can configure different backgrounds depending on the project status (except the production) to warrant users they are not using a production ready software:
<project name="xxx"> [...] <custom> <fluidoSkin> <profile>(pre-release|sandbox|retired)</profile> </fluidoSkin> </custom> [...] </project>
Since version 1.1, fluido-skin supports the Twitter follow button to simplify its integration. Users must define:
<project name="xxx"> [...] <custom> <fluidoSkin> <twitter> <user>simonetripodi</user> <showUser>true</showUser> <showFollowers>true</showFollowers> </twitter> </fluidoSkin> </custom> [...] </project>
By default, it is rendered in the sidebar, if the topbar only is available it will be rendered there.
Since version 1.1, fluido-skin supports the Ohloh widgets to simplify its integration. Users must define:
<project name="xxx"> [...] <custom> <fluidoSkin> <ohloh> <projectId>3499</projectId> <widget>factoids</widget> </ohloh> </fluidoSkin> </custom> [...] </project>
Ohloh widgets will be rendered always in the footer as last element
Since version 1.2, fluido-skin supports the Facebook like integration. Users have just to declare:
<project name="xxx"> [...] <custom> <fluidoSkin> <facebookLike /> </fluidoSkin> </custom> [...] </project>
By default, it is rendered in the sidebar, if the topbar only is available it will be rendered there.
Note in order the Facebook like button appears, ${project.url} property must be set in the pom.xml!
Since version 1.2, fluido-skin supports the Google plusone integration. Users have just to declare:
<project name="xxx"> [...] <custom> <fluidoSkin> <googlePlusOne /> </fluidoSkin> </custom> [...] </project>
By default, it is rendered in the sidebar, if the topbar only is available it will be rendered there.
Note in order the Google plusone button appears, ${project.url} property must be set in the pom.xml!
Since version 1.3.1, fluido-skin supports inserting Piwik web analytics tracking code into the generated pages. Users have to declare:
<project name="xxx"> [...] <custom> <fluidoSkin> <piwik> <piwikUrl>example.org/piwik</piwikUrl> <idsite>1</idsite> </piwik> </fluidoSkin> </custom> [...] </project>
Since version 1.3.1, fluido-skin supports Flattr button integration. Users have to declare:
<project name="xxx"> [...] <custom> <fluidoSkin> <flattr> <thing>12345/Example-Org</thing> <url>http://example.org/</url> <style>compact</style> </flattr> </fluidoSkin> </custom> [...] </project>
By default, it is rendered in the sidebar, if the topbar only is available it will be rendered there.
Apache Maven Fluido Skin contains/redistributes Glyphicons Halflings as part of Bootstrap by Twitter, released under Creative Commons Attribution 3.0 Unported (CC BY 3.0).