Creating a theme styleAdded by IBM | Edited by IBM on January 9, 2013 | Version 3 (Show original)
|You can add your own custom style to the theme that can be selected on the customization shelf.
To add your own custom style to the theme, create a new Cascading Style Sheet (CSS) file in WebDAV. This new file includes CSS class definitions that override the ones provided by the default CSS layer, located here: dav:fs-type1/themes/Portal184.108.40.206/css/master.css
The ready-use alternate styles can be used as guide while going through the creation process and are located in folders as peers to the default CSS layer. The alternate style resources can be found at this location: dav:fs-type1/themes/Portal220.127.116.11/css/
To create a new alternate style:
Parent topic: Styles
- On your local system, create a folder and place inside a new CSS file that includes the class overrides for the alternate style. For this example, we are referencing ./custom/custom.css.
- Connect to the fs-type1 WebDAV entry point, http://<server>:<port>/wps/mycontenthandler/dav/fs-type1/.
- Copy the new folder to this location in WebDAV: dav:fs-type1/themes/Portal18.104.22.168/css/.
- Open the file in WebDAV at dav:fs-type1/themes/Portal22.214.171.124/system/styles.json.
- Register the style by adding an entry to the items array in the following format:
The following is an example of the items array:
'help':'The white style.'}
The display name shows in the Customize shelf. Make the path relative to the folder in WebDAV. The json object in the file styles.json
contains two attributes that are used for globalizing the style display strings localizationPackageName
. These objects are used by dojo.i18n to provide localized strings by creating bundles with dojo.i18n.getLocalization("localizationPackageName", "localizationBundleName")
. If you choose to globalize the display name of your new style, add a key to the bundle and replace the label value in the json with the key name. The customize shelf automatically looks up the display name in the bundle using the key.
The previous steps add the new style to the default All
category under Change Style
in the Customize shelf
- To add a category, edit the file in WebDAV at dav:fs-type1/themes/Portal126.96.36.199/system/changeStyle.json and add another item to the categories array in the json object.
"label":"My new category",
"searchStr":"Search my new category",
In the previous example, the attribute url is the path to a json file that contains the style entries for the new category. Model this json file after the one in WebDAV at dav:fs-type1/themes/Portal188.8.131.52/system/styles.json
- Verify that your custom style is added to the Customize shelf.