Custom Theme Creation in Websphere Portal 7

Custom Theme Creations Steps.

Follow below steps while creating a theme in Websphere Portal server version 7.

      
The theme architecture has changed a bit with the release of Portal 7.  The artifacts are split into two separate packages, dynamic and static.  Each package is deployed and maintained independently (even though they both must be present and work together for the theme to properly function).  Below are the instructions for creating and deploying all the necessary artifacts.

Prerequisite: Download AnyClient and install.  This is for access to WEBDAV

1) Copy PageBuilder2.war

· From theme folder under D:\IBM\WebSphere\*PortalServer\theme\wp.mashup.cc.theme\*installedApps\wp.mashup.cc.theme.ear

· Rename your copy to MyNewTheme (your choice of name)

· Remove the plugin.xml file from the WEB-INF directory but do not remove the decorations.xml file or the tld directory.

· Go to web.xml of it and update app ID and display name as you want it (usually to match you theme name).

· Change the attribute in the ibm-web-bnd.xmi and the ibm-web-ext.xmi files to match the above name.

2) Deploy your new theme .war on WAS.

· Log into WAS admin console.

· Go to Applications > New Application. Select Websphere enterprise application.

· Browse to the location of the was file

· Choose “Fast Path”

· Step 1: Only change “Application Name” by removing “_war” from the name.

· Step 2: Map it to Portal Server

· Step 3: Set the context root to the same name as the theme (i.e /MyNewTheme)

· After deploying make sure you have same file structure as it is for PageBuilder2 war 




3) Create new static HTML for your theme

· Open WebDav client ( ex: AnyClient)

· Connect to Portal server

· Use Connection type: WebDav and make sure passive mode is unselected.

· Go to this location /fs-type1/themes/.

· Check out PageBuilder2 folder to your local machine.

· Rename the local copy you just made to MyNewTheme (match the theme name used above)

· To change any theme look n feel you need to modify theme_en.html( US English) under nls folder of the checked out folder

· Check in MyNewTheme folder to the location of PageBuilder2 theme. After this step you'll be seeing 2 folders. i) PageBuilder2 ii) MyNewTheme

· Keep the MyNewTheme folder on you local env, will make edits to it later



5) Use xml file to import this theme in Portal.

· Open Windows Command window and change directory (cd) to “C:\IBM\WebSphere\PortalServer\bin” folder and run the XMLAccess command (location may vary based on Portal install location)

· xmlaccess –url http://portal.ibm.com:10039/wps/config -user wpadmin -password passw0rd –in C:\temp\ImportMyNewTheme.xml

(insert your own localhost and location or deployment xml file on your local machine)

· Confirm you receive a successful install message

· Make note of the theme unique name used in the import XML. You will need to reference this later for your theme to point dynamic content spots to your custom theme_en.html

· Note these other points in the xml

<theme action="update" active="true" default="false" domain="rel" objectid="mytheme.csa2.theme" uniquename="mytheme.csa2.theme" resourceroot="MyNewTheme" context-root="/MyNewTheme" defaultskinref="csa2.standard">

<parameter name="com.ibm.portal.theme.template.ref" type="string" update="set"></parameter>
( If this location is wrong, your theme will use fallback template!! )

The xml template file is also available in D:\IBM\WebSphere\PortalServer\theme\wp.mashup.cc.theme\config\templates



6) Restart Portal Server and Verify your custom theme appears in Portal



7) Update dynamic content spots in your custom theme

· Open WebDav via AnyClient

· Connect to Portal server

· Go to the local version of MyNewTheme/nls/theme_en.html

· Update any dynamic content spots to point to myNewTheme.war

<link
rel="dynamic-content" href="dyn-cs:id:head@tl:oid:csa2.theme"> replace with following
<link rel="dynamic-content" href="
res:/MyNewTheme/themes/html/MyNewTheme/head.jsp">
· Do the same for all remaining jsp references in the file
· Use WebDav to upload the new file to the server


By this you should be completing the custom theme creation of your theme in portal 7


Hope this helps you ...!!!