The document provides an in-depth overview of XPages themes, describing their role in creating a consistent layout and branding for Domino web applications. It covers the process of using, extending, and customizing themes, including practical examples and code snippets for modifying appearance and functionality. The document also discusses best practices for managing themes within applications, emphasizing the importance of maintaining theme independence to facilitate easy updates and changes.

1. XPages OneUIv2 Theme Deep Dive Lance Spellman | President, WorkFlow Studios

2. Agenda What's an Xpages theme?

3. Discussion Database Demo

4. Trying different out-of-the-box themes

5. Extending themes with your changes

6. What's an XPages theme? 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.

7. 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.

8. And last but not least: you can define multiple themes within an application, and then simple switch between themes via the application properties:

9. Discussion Database Demo The 8.5.2 Discussion template is based on the OneUIv2 theme

10. Preview the database http://127.0.0.1/discussion.nsf

11. In Application Properties in Domino Designer, go to the XPages tab

12. By default, the Application Theme is “blue”

13. Try changing to “red” and reloading the page

14. Discussion Db Theme Choices

15. Theme Options Can be server-wide by specifying a server default

16. Can be application specific

17. Can even be XPage specific

18. Dissecting a theme, finding all the files on the server

19. Using Server Default Theme For Discussion Db, change theme to “Server Default”

20. Preview the page

21. Ouch!

22. Server Default: Where does it get set? The server looks for an xsp.properties file in data\properties directory

23. If found, it looks for the entry xsp.theme.web

24. If blank, it looks for the entry xsp.theme

25. If the xsp.properties file doesn't exist, or the entries don't exist, then the webstandard theme is applied as shown below

26. Set a theme for Server Default In data\properties there is a xsp.properties.sample file

27. Make a copy of it named xsp.properties

28. Edit the file and uncomment the #xsp.theme=webstandard to xsp.theme=oneuiv2 Save the file

29. Tell http quit on the server console

30. After http's shutdown, issue load http on the server console

31. Preview the page again

32. Results...not so good?!?

33. Look at the source Theme was applied, the appropriate css files are shown as loading