What's an XPages theme? <ul><li>Themes are powerful design elements that control overall layout of Domino web applications. With themes, you can give all your web applications a consistent look and feel, and include corporate branding.
Themes are much more than styles. They can include various style sheets and can also override/ specify individual control's look and feel. For example, in a theme you can specify a particular style class for all submit buttons in your application.
And last but not least: you can define multiple themes within an application, and then simple switch between themes via the application properties: </li></ul>
Discussion Database Demo <ul><li>The 8.5.2 Discussion template is based on the OneUIv2 theme
Preview the database http://127.0.0.1/discussion.nsf
In Application Properties in Domino Designer, go to the XPages tab
This database originally was set to use the “blue” theme and it worked with that. “blue” extends oneuiv2, apparently in a big way. </li></ul>
Before looking at “blue” theme... <ul><li>Let's identify where the domino server is getting oneuiv2 and webstandard themes from
Look in the dominoxspnsfthemes directory </li><ul><li>There you find all the .theme documents including </li><ul><li>oneui.theme (8.5 and 8.5.1)
oneuiv2.theme (previewed in 8.5.1 and supported in 8.5.2)
webstandard.theme </li></ul></ul><li>Open the oneuiv2.theme with Wordpad </li><ul><li>Resources are declared there with paths like </li><ul><li>/.ibmxpress/domino/oneuiv2/base/core.css </li></ul></ul><li>The /.ibmxpress/domino directory is mapped by the Domino server to </li><ul><li>datadominohtml directory </li></ul><li>Under the html directory is the oneuiv2 folder with all the CSS files </li></ul>
Where's the Blue theme? <ul><li>Go to Resources and Themes within the database
Move custom.css from the blue theme <ul><li>We want to leave the blue theme in it's pristine state, so any mods we'd made there, we're moving out.
Move the resource definition for custom.css from the blue theme and put it in the new WFS theme </li></ul>
Move control definition <ul><li>Take the button.cool control definition from the blue theme over to the WFS theme </li></ul>
Get rid of custom theme id <ul><li>To make the theme transferable with no code changes to the base app, we need to get rid of theme id of button.cool on the “New Topic” button that we added earlier </li></ul>
How to determine a control's theme id <ul><li>We can apply our cool button style globally to all buttons of this type in the application by changing the styleClass definition for the existing button controls
This requires that we know what the control's theme id is
Some are relatively easy to determine and some aren't
You can use code to get the component's StyleKitFamily
Resources <ul><li>There's a lot of great information on the XPages Blog
By searching for all items with tag of theme, there are 5 good articles available </li><ul><li>http://xpagesblog.com/xpages-blog/tag/themes </li></ul><li>Lotus User Interface documentation </li><ul><li>http://www-12.lotus.com/ldd/doc/oneuidoc/docpublic/index.htm </li></ul><li>Article in the Domino wiki </li><ul><li>http://www-10.lotus.com/ldd/ddwiki.nsf/dx/Create_a_website_layout </li></ul><li>My Delicious bookmarks </li><ul><li>http://www.delicious.com/lspellman/xpages+themes </li></ul></ul>
The information contained in this publication is provided for informational purposes only. While efforts were made to verify the completeness and accuracy of the information contained in this publication, it is provided AS IS without warranty of any kind, express or implied. WorkFlow Studios shall not be responsible for any damages arising out of the use of, or otherwise related to, this publication or any other materials. Nothing contained in this publication is intended to, nor shall have the effect of, creating any warranties or representations from WorkFlow Studios or its suppliers or licensors, or altering the terms and conditions of the applicable license agreement governing the use of IBM software.
References in this presentation to IBM products, programs, or services do not imply that they will be available in all countries in which IBM operates. Product release dates and/or capabilities referenced in this presentation may change at any time at IBM’s sole discretion based on market opportunities or other factors, and are not intended to be a commitment to future product or feature availability in any way. Nothing contained in these materials is intended to, nor shall have the effect of, stating or implying that any activities undertaken by you will result in any specific sales, revenue growth or other results.
IBM, the IBM logo, Lotus, Lotus Notes, Notes, Domino and Lotusphere are trademarks of International Business Machines Corporation in the United States, other countries, or both.
Java and all Java-based trademarks are trademarks of Sun Microsystems, Inc. in the United States, other countries, or both.
Dissemination or reuse of this presentation is allowed provided full attribution to WorkFlow Studios is made by retaining the title slide and this legal disclaimer slide in their original form. </li></ul>