Art of Webcenter Templating

Introduction

This article covers some aspects of Webcenter templating PS5, how you go about doing changes to look and feel , skin, there are couple things that needs to be considered Navigation, Header Section, Footer Section, Content Area, Menu, Security etc

I start with the Assumption that Webcenter, UCM and BPM Process Spaces is been installed and working together , if not please read this article to get the environment ready

Starting to create Webcenter Template

login to webcenter as weblogic, go to Adminstration link, go to Resources Tab and Template, copy a any of the Existing Templates to create a new template.

wc1

then Edit the template by Edit Source

wc2

Webcenter itself needs some changes here , Hope at later version we get a better editor option , but as far now you would need to copy the entire source code into a temp.jspx file in a JDeveloper project and edit the source code and re-paste that code back to this Editor.. I hope things become little easier here .. but as of now this is the way around

wc3

I would highly recommend you to use Firebug firefox extension to understand the css elements and change them on the template.

Getting Topmost Navigation right

wc4

the result of above code will be

wc5

Getting Default Navigation on Space

You can copy paste this code from Top Navigation template itself,

wc6
the result of this code will be as shown below ,that includes a welcome username , login or logout links based on the state of login , and also display of links based on user roles.

wc8

Getting logo and main Navigation in place

this part of code snipped will get the logo and main navigation aligned

wc9

Final look at our template

full

Editing using Firebug

while making this template its very important to install firebug and do minor adjustments on style , height , width etc .. on chrome Browser also you can edit the css inline style

fb

Using Content Repository to store images and css files

Its important to store all the images, css and html files in the content repository so that they can be easily changed or updated without actually editing the temple

cr

BPM Modelling Space on our new template

ms

BPM Process workspace in our template

msp

Complete Template Source Code

Paste Bin Copy
View Complete Template Source code here.

	

    <?xml version='1.0' encoding='UTF-8'?>
    <jsp:root xmlns:jsp="http://java.sun.com/JSP/Page" version="2.1" xmlns:wcshell="http://xmlns.oracle.com/webcenter/shell" xmlns:f="http://java.sun.com/jsf/core" xmlns:af="http://xmlns.oracle.com/adf/faces/rich" xmlns:wcdc="http://xmlns.oracle.com/webcenter/spaces/taglib" xmlns:cust="http://xmlns.oracle.com/adf/faces/customizable" xmlns:trh="http://myfaces.apache.org/trinidad/html" xmlns:rtc="http://xmlns.oracle.com/webcenter/collab/rtc" xmlns:c="http://java.sun.com/jsp/jstl/core">
       <af:pageTemplateDef var="attrs">
          <af:xmlContent>
             <component xmlns="http://xmlns.oracle.com/adf/faces/rich/component">
                <display-name>WCSiteRRTemplateTopNavFlow</display-name>
                <facet>
                   <facet-name>auxiliary1</facet-name>
                </facet>
                <facet>
                   <facet-name>content</facet-name>
                </facet>
                <attribute>
                   <attribute-name>auxiliary1Size</attribute-name>
                   <attribute-class>int</attribute-class>
                   <default-value>200</default-value>
                </attribute>
                <attribute>
                   <attribute-name>templateFixedWidth</attribute-name>
                   <attribute-class>java.lang.String</attribute-class>
                   <default-value>#{not empty WCAppContext.currentPageTemplate.attributesMap['templateFixedWidth'].value ? WCAppContext.currentPageTemplate.attributesMap['templateFixedWidth'].value : '1000'}</default-value>
                </attribute>
                <attribute>
                   <attribute-name>topPanelHeight</attribute-name>
                   <attribute-class>java.lang.String</attribute-class>
                   <default-value>#{not empty WCAppContext.currentPageTemplate.attributesMap['topPanelHeight'].value ? WCAppContext.currentPageTemplate.attributesMap['topPanelHeight'].value : '44'}</default-value>
                </attribute>
                <attribute>
                   <attribute-name>panelSeparatorHeight</attribute-name>
                   <attribute-class>java.lang.String</attribute-class>
                   <default-value>#{not empty WCAppContext.currentPageTemplate.attributesMap['panelSeparatorHeight'].value ? WCAppContext.currentPageTemplate.attributesMap['panelSeparatorHeight'].value : '14'}</default-value>
                </attribute>
                <attribute>
                   <attribute-name>panelFooterHeight</attribute-name>
                   <attribute-class>java.lang.String</attribute-class>
                   <default-value>#{WCAppContext.currentPageTemplate.attributesMap['panelFooterHeight'].value}</default-value>
                </attribute>
                <attribute>
                   <attribute-name>brandingImageUrl</attribute-name>
                   <attribute-class>java.lang.String</attribute-class>
                   <default-value>#{not empty WCAppContext.currentPageTemplate.attributesMap['brandingImageUrl'].value ? WCAppContext.currentPageTemplate.attributesMap['brandingImageUrl'].value : ''}</default-value>
                </attribute>
                <attribute>
                   <attribute-name>footerNavigationModelPath</attribute-name>
                   <attribute-class>java.lang.String</attribute-class>
                   <default-value>#{empty WCAppContext.currentPageTemplate.attributesMap['footerNavigationFile'].value ? '' :
                                    'modelPath='}#{empty WCAppContext.currentPageTemplate.attributesMap['footerNavigationFile'].value ? '' :
                                     WCAppContext.currentPageTemplate.attributesMap['footerNavigationFile'].value}</default-value>
                </attribute>
             </component>
          </af:xmlContent>
          <f:verbatim>
             <style type="text/css">  
             /* Spaces Top Nav Style */
    .xnm.x1r6
    {
        height: 56px;
        width: 100%;
    }    
    .WCSiteTemplateBackground,.x1ng, #home_root_document, .x11v, .x1pv
    #home_root_document, .x11v
    {
    background-color: #ffffff ! important;  
    }
    .AFBrandingBarItem, .xo5
    {
       background:white;
        background-image:none;
       
    }
    .WCSiteTemplateBackground, .x1nj
    {
       background-repeat: repeat-x;
    }
    .x1a.x1r8
    {    
       /* background:white; */
        background-image:none;
    }
    .x1a
    {
         background: white ;
         background-repeat: repeat-x;
         /*color: Black;*/
    }
    .xnm.x1r7
    {
      background: Fuchsia;
      height: 70px;
      background-image: none;
    }
    .xnm.x1r7
    {  
        background:white;
        background-image: none;  
    }
    .xq2[theme="webcenter"]
    {
        background-color: white;  
        background-image: none;
        height:150px;
    }
    .xq2  
    {
        background-color: white;  
        background-image: none;
        height:150px;
    }
    .xpy[theme="webcenter"]
    {
      background-color: white;
      background-image: none;
      height:0px;
    }
    .xpy
    {
      background-color: white;
      background-image: none;
      height:0px;
    }
    .xq6  
    {
      background-color: white;
      background-image: none;
      height: 0px;
    }
    .xq6[theme="webcenter"]
    {
      background-color: white;
      background-image: none;
      height: 0px;
    }
    .xq4[theme="webcenter"]
    {
      background-color: white;
      background-image: none;
    }
    .xq4
    {
      background-color: white;
      background-image: none;
    }
    .xq1[theme="webcenter"]
    {
      background-color: white;
      background-image: none;
    }
    .xq1
    {
      background-color: white;
      background-image: none;
    }  
    .xpx[theme="webcenter"]
    {
      background-color: white;
       background-image: none;
    }  
    .xpx
    {
      background-color: white;
       background-image: none;
    }
    .xq0[theme="webcenter"]
    {
      background-color: white;
       background-image: none;
    }
    .xq0
    {
      background-color: white;
      background-image: none;
    }
    .xq5[theme="webcenter"]
    {
      background-color: white;
       background-image: none;
    }
    .xq5
    {
      background-color: white;
       background-image: none;
    }
    .xq7
    {
      background-color: white;
       background-image: none;
    }
    .xq7[theme="webcenter"]
    {
      background-color: white;
       background-image: none;
    }
    .x11w
    {
       /*background-color: black;*/
       background-image: none;
    }
    .x11w[theme="webcenter"]
    {
       /*background-color: black;*/
       background-image: none;  
    }
    .xde
    {
      /*background-color: black;*/
      background-image: none;  
     /* color:white;*/
    }
     
    .x6e.x1r8 .xdt, .x6e.x1r8 .xdr, .x6e.x1r8 .xds
    {    
      /*  color:white;*/
    }
    .xdt, .xdr, .xds, .xzs
    {  
        color:black;
    }
    .x193
    {
       background-color: white;
       background-image: none;
       color: Black;
    }
    .x6e.x1r8 .xdt, .x6e.x1r8 .xdr, .x6e.x1r8 .xds {
       /* color: white; */
    }
    webcenterfx-desktop-z3che6-en-ltr-gecko-linux-
    .x6e.x1r8 .xdt, .x6e.x1r8 .xdr, .x6e.x1r8 .xds {
        /* background-color: transparent; */
        height: 29px;
        font-weight: bold;
        border: medium none;
        padding: 15px 15px 0px;
    }
     
    .xdt, .xdr, .xds {
    }
    webcenterfx-desktop-z3che6-en-ltr-gecko-linux-
    .xdt, .xdr, .xds {
        font-family: Tahoma,Verdana,Helvetica,sans-serif;
        font-weight: normal;
        font-size: 11px;
        cursor: default;
        white-space: nowrap;
        height: 17px;
        padding: 3px 1px 1px;
    }
    .x6e {
        font-family: Tahoma,Verdana,Helvetica,sans-serif;
        font-weight: normal;
        font-size: 11px;
       /* color: white;*/
    }
    .x11w {
        font-family: Tahoma,Verdana,Helvetica,sans-serif;
        font-weight: normal;
        font-size: 11px;
        /*color: white;*/
    }
    .x19g .x101.x19h .x6e .xyj, .x19g .x101.x19h .x10h, .xnm[theme="webcenter"] .xft, .xnm[theme="webcenter"]
    .xfd, .xnm[theme="webcenter"] .x107, .xnm[theme="webcenter"]
    .x106, .x6e.x1r8 .xym.x1r9 .xyj, .x6e.x1r8 .xym.x1r9 .xyk, .x6e.x1r8 .xyn.x1r9 .xyj, .x6e.x1r8 .xyn.x1r9 .xyl
    {
        color: black;
    }
    .x25, .WCInputText, .x1nt
    {  
    border-style: solid;
    border-width: 1px;
    border-color: black;
    width:100px;
    }
             /* Spaces Top Nav Style End */
             
    /* start nav */
     
    #navbox
    {
           
            -webkit-border-radius: 5px;
            -moz-border-radius: 5px;  
            background: url("http://james:16200/cs/groups/personalspaces/documents/document/x2dy/ywrp/~edisp/jamesbank_gradient.png") repeat-x;
            background-repeat:repeat-x ! important;
            height: 46px;
           
    }
     
    #nav
    {
            float: left;
            color: #333333;
            font-family: Verdana,Arial,Helvetica,sans-serif;
            list-style:none;
            width:990px;                
            float: left;
            margin: 0;
            padding: 0;              
            margin: 0;
            padding: 0px 0px 0;
             line-height: 100%;
            border-radius: 3px;
            -webkit-border-radius: 3px;
            -moz-border-radius: 3px;
            margin-left: auto;
            margin-right: auto;
            margin-top: 0px;
             
    }
     
    /* main level link hover */
    #nav .current a, #nav li:hover > a
    {              
           
            /* mouse over on the main top navigation that has HOME, Services, Careers */
             
            color: #333333;
            font-family: Verdana,Arial,Helvetica,sans-serif;
            -moz-border-radius-bottomright: 0px;
            border-bottom-right-radius: 0px;
            -moz-border-radius-bottomleft: 0px;
            border-bottom-left-radius: 0px;
            -moz-border-radius-topright: 0px;
            border-top-right-radius: 0px;
            -moz-border-radius-topleft: 0px;
            border-top-left-radius: 0px;
            background: #FBFBFB; /* for non-css3 browsers */
            filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#FBFBFB', endColorstr='#DEDDDC');  
            background: -webkit-gradient(linear, left top, left bottom, from(#FBFBFB), to(#DEDDDC));  
            background: -moz-linear-gradient(top,  #FBFBFB,  #DEDDDC);  
           
    }
     
    #nav li
    {        
            /*margin: 0 5px;*/
            /*padding: 0 0 8px;*/
            float: left;
            position: relative;
            list-style: none;
    }
     
    /* main level link */
    #nav a
    {      
        color: #333333;
        border-left: 1px solid #CCCCCC;    
        display: block;
        font-size: 1.8em;
        padding: 15px 20px 20px 15px;
        /* text-align: center; */
        text-decoration: none;
    }
    #nav a:hover {
             
            color: black;
    }
     
     
     
    /* sub levels link hover */
     
    #nav ul li:hover a, #nav li:hover li a
    {
             
            background-color: #FBFAFA;
            text-decoration: none;
            -webkit-box-shadow: none;
            -moz-box-shadow: none;  
             color: #333333;      
           
            -webkit-border-radius: 0;
            -moz-border-radius: 0;
            text-shadow: 0 1px 1px rgba(0, 0, 0, .1);
            font-family: Verdana,Arial,Helvetica,sans-serif;
            font-size: 1em;
            text-decoration: none;
            display: block;  
            margin: 0;
            font-weight: bold;
    }
    #nav ul a:hover
    {        
            color: #333333 !important;
            -webkit-border-radius: 0;
            -moz-border-radius: 0;
    }
     
    /* dropdown */
    #nav li:hover > ul {
            display: block;
            z-index: 101;
    }
     
    /* level 2 list */
    #nav ul {
            display: none;
            margin: 0;
            padding: 0;
            width: 185px;
            position: absolute;  
            left: 0;
            -webkit-border-radius: 3px 3px 3px 3px;
            -moz-border-radius: 3px 3px 3px 3px;
            border-radius: 3px 3px 3px 3px;
            -webkit-box-shadow: 0 1px 3px rgba(0,0,0, .3);
            -moz-box-shadow: 0 1px 3px rgba(0,0,0, .3);
            box-shadow: 0 1px 3px rgba(0,0,0, .3);
    }
    #nav ul li {
            float: none;
            margin: 0;
            padding: 0;
    }
     
    #nav ul a {
            font-weight: normal;
            /*text-shadow: 0 1px 0 #fff;*/
    }
     
    /* level 3+ list */
    #nav ul ul {
            left: 181px;
            top: -3px;
    }
     
    /* rounded corners of first and last link */
    #nav ul li:first-child > a {
            -webkit-border-top-left-radius: 3px;
            -moz-border-radius-topleft: 3px;
     
            -webkit-border-top-right-radius: 3px;
            -moz-border-radius-topright: 3px;
    }
    #nav ul li:last-child > a {
            -webkit-border-bottom-left-radius: 3px;
            -moz-border-radius-bottomleft: 3px;
     
            -webkit-border-bottom-right-radius: 3px;
            -moz-border-radius-bottomright: 3px;
    }
     
    /* clearfix */
    #nav:after {
            content: ".";
            display: block;
            clear: both;
            visibility: hidden;
            line-height: 0;
            height: 0;
    }
    #nav {
            display: inline-block;
    }
    html[xmlns] #nav {
            display: block;
    }
     
    * html #nav {
            height: 1%;
    }
     
     
     
    /* end nav */
     
    /* login box */
    #loginbox
    {        
            margin-top:-15px;
            width:295px;
            background: #CF1321 none;
            color: white;
            float: left;
            height: 70px;
            -moz-box-shadow: 3px 0px 3px rgba(0,0,0,0.4);
            -webkit-box-shadow: 5px 0px 5px rgba(0,0,0,0.2);          
            box-shadow: 3px 0px 3px rgba(0,0,0,0.4);
            z-index: 4;
            position: relative;
            padding: 0 32px;        
    }
    #postloginbox
    {        
            margin-top:-15px;
            width:295px;
            background: #0A50A1 none;
            color: white;
            float: left;
            height: 70px;
            -moz-box-shadow: 3px 0px 3px rgba(0,0,0,0.4);
            -webkit-box-shadow: 5px 0px 5px rgba(0,0,0,0.2);
            box-shadow: 3px 0px 3px rgba(0,0,0,0.4);
            z-index: 4;
            position: relative;
            padding: 0 32px;        
    }
    #postloginbox a
    {      
       font-family: Verdana,Arial,Helvetica,sans-serif;
       font-size: 0.8em;
       color: #ffffff;  
       border-left: none;  
       height:10px;
    }
    #postloginbox a:hover
    {
        color: white;    
        border-left: none;      
    }
    #loginbox h2
    {
            font-family: Verdana,Arial,Helvetica,sans-serif;
            font-size: 0.8em;
            color: #ffffff;
            margin: 20px 0 4px;
            padding: 2px 0 0;
    }
    .AFLabelText, .xa, .xq, .xr, .xs, .xt, .xu, .xv, .xw, .xx, .xy, .xz, .x10, .x11, .x12,
    .x13, .x14, .x15, .portlet-form-label, .xd2, .portlet-icon-label, .xd5, .portlet-dlg-icon-label,
    .xd6, .portlet-form-field-label, .xd7, .xgg, .xun, .xuo, .x113, .xg6, .x16t, .x16u {
        color: white;
        font-family: Tahoma,Verdana,Helvetica,sans-serif;
        font-size: 11px;
        font-weight: normal;
        padding: 0 6px 0 0;
        text-align: right;
    }
    /* login box */
    /* topmost nav box */
      .nav-module {
        border-left: 1px solid #DADADA;
        float: right;
        height: 17px;
        margin: 0;
        padding: 3px 15px;
        background: url("http://james:16200/cs/groups/personalspaces/documents/document/dhgt/c3by/~edisp/hp-repeatx-sprite.png");
    }      
     .last-module
     {
        border-right: 1px solid #DADADA;
         background: none;
    }        
    /* topmost nav box */
    /* footer */
    .xng.x1r4 {
        background-color: white;
        font-family: Tahoma,Verdana,Helvetica,sans-serif;
        font-size: 11px;
        color: black;
        padding: 0 10px;
        white-space: nowrap;
    }
     
    /* footer */
             </style>
          </f:verbatim>
          <af:resource type="javascript" source="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"/>
          <af:panelGroupLayout id="pt_pgl3" layout="scroll" styleClass="WCSiteTemplateRoot">
             <af:panelGroupLayout id="pt_pgl5" layout="vertical" styleClass="WCSiteTemplateBackground">
                <div id="topbox" style="padding: 0px 0px 0px 0px;width:990px;margin-left:0px;margin-top:0px;background:red;">
                   <af:panelGroupLayout id="pt_pgl2" inlineStyle="width:990px;">
                      <table border="0" cellspacing="0" cellpadding="0" bgcolor="white" align="center" width="990px">
                         <tr align="right">
                            <td>
                               <af:commandLink text="About Us" id="pt_cl31" styleClass="nav-module">
                                  <af:image source="http://james:16200/cs/groups/personalspaces/documents/document/zmxh/z3nj/~edisp/sm_flagscape.gif" id="pt_i1"/>
                               </af:commandLink>
                                <af:commandLink text="Enterprise Architecture" id="pt_cl32" styleClass="nav-module"/>
                               <af:commandLink text="Webcenter" id="pt_cl33" styleClass="nav-module"/>
                               <af:commandLink text="SOA BPM" id="pt_cl34" styleClass="nav-module"/>
                               
                               <af:goLink text="James Smith's Blogs" id="pt_gl2" styleClass="nav-module last-module"
                                          destination="http://jamessmith73.wordpress.com"
                                          targetFrame="_self"/>                
                            </td>
                         </tr>
                      </table>
                   </af:panelGroupLayout>
                </div>
                <af:panelGroupLayout id="pt_pbl1" layout="vertical" inlineStyle="width:#{attrs.templateFixedWidth}px;margin:0px auto;padding-top:0px;">
                   <af:panelGroupLayout id="top_globalContainer" layout="vertical" inlineStyle="height:0.0px;">
                      <wcdc:siteTemplateMetadata type="start"/>
                   </af:panelGroupLayout>
                   <af:panelGroupLayout id="pprIndicator" inlineStyle="height:0.0px;" visible="false">
                      <wcdc:spacesAction id="statusIndiWcLink" type="statusIndicator"/>
                   </af:panelGroupLayout>
                   <af:decorativeBox id="db1" theme="webcenter" styleClass="WCSiteTemplateHeader">
                      <f:facet name="center">
                         <af:panelBorderLayout id="gtbppbl1" styleClass="AFStretchWidth" inlineStyle="padding-top:3px; vertical-align:middle;">
                            <f:facet name="start">
                               <cust:panelCustomizable id="pcust1" layout="horizontal" inlineStyle="padding:0px;">
                                  <af:panelGroupLayout valign="middle" id="pt_pgl7" layout="vertical">
                                     <af:panelGroupLayout id="gtbrspmxpgl2" layout="horizontal">
                                        <img src="http://james:16200/cs/groups/personalspaces/documents/document/yw5r/x2xv/~edisp/james_bank_logo3.png" style="padding: 0px 0px 0px 0px; margin-top: 0px; margin-left: 0px; margin-bottom:0px;"/>
                                     </af:panelGroupLayout>
                                  </af:panelGroupLayout>
                               </cust:panelCustomizable>
                            </f:facet>
                            <af:panelBorderLayout id="gtbppbl2" styleClass="AFStretchWidth">
                               <f:facet name="end">
                                  <af:panelGroupLayout layout="vertical" styleClass="AFBrandingBarItem" id="gtbppgl3" halign="end">
                                     <af:panelGroupLayout layout="horizontal" id="globNavItms" valign="middle" halign="end" inlineStyle="height:24.0px;">
                                        <cust:panelCustomizable id="pcust2" layout="horizontal" inlineStyle="padding:0px;" valign="middle">
                                           <af:region value="#{bindings.localToolbarSearch.regionModel}" id="searchbox"/>
                                           <af:spacer width="15" height="10" id="pt_s3"/>
                                           <wcdc:userProfile id="currUserWcLink" immediate="false" text="#{security.userDisplayName}" shortDesc="#{security.userDisplayName}" inlineStyle="white-space:nowrap;"/>
                                           <af:spacer styleClass="WCGlobalNavSeparator" rendered="#{security.authenticated}" id="gtbps31"/>
                                           <wcdc:spacesSwitcher id="wcCmdLinkGSSwit" __taskFlowId="createGroupSpaceRegion" immediate="false" inlineStyle="white-space:nowrap;" styleClass="WCLinkMenu" text="#{uib_o_w_s_r_Spaces.LABEL_COMMUNITIES}" shortDesc="#{uib_o_w_s_r_Spaces.LABEL_COMMUNITIES_DESC}"/>
                                           <af:spacer width="10" id="gtbps4"/>
                                           <wcdc:favoritesMenu immediate="false" id="wcCmdLinkGSFav" __taskFlowId="favoritesTaskFlow" inlineStyle="white-space:nowrap;" text="#{uib_o_w_w_r_WebCenter.LABEL_FAVORITES}" shortDesc="#{uib_o_w_w_r_WebCenter.LABEL_FAVORITES_DESC}"/>
                                           <af:spacer styleClass="WCGlobalNavSeparator" id="gtbps32"/>
                                           <af:region value="#{bindings.languageSelectorRegion.regionModel}" id="lang" rendered="#{!security.authenticated}"/>
                                           <af:spacer width="10" id="gtbps5" rendered="#{!security.authenticated}"/>
                                           <wcdc:spacesAction id="wcAdminLink" type="administration" immediate="false" inlineStyle="white-space:nowrap;" text="#{uib_o_w_w_r_WebCenter.GLOBAL_LINK_ADMINISTRATION}" shortDesc="#{uib_o_w_w_r_WebCenter.GLOBAL_LINK_ADMINISTRATION_DESC}"/>
                                           <af:spacer width="10" id="gtbps52" rendered="#{security.webCenterConfigAllowed and security.authenticated}"/>
                                           <wcdc:userPreferences id="wcPreferLink" __taskFlowId="preferenceRegion" inlineStyle="white-space:nowrap;" text="#{uib_o_w_w_r_WebCenter.GLOBAL_LINK_PREFERENCES}" shortDesc="#{uib_o_w_w_r_WebCenter.GLOBAL_LINK_PREFERENCES_DESC}"/>
                                           <af:spacer styleClass="WCGlobalNavSeparator" id="gtbps33"/>
                                           <wcdc:spacesAction id="globalHelpWcLink" type="globalHelp" immediate="false" text="#{uib_o_w_w_r_WebCenter.LABEL_HELP}" shortDesc="#{uib_o_w_w_r_WebCenter.LABEL_HELP_DESC}" inlineStyle="white-space:nowrap"/>
                                           <af:spacer width="10" id="gtbps6" rendered="#{boilerBean.webCenterHelpConfigured}"/>
                                           <wcdc:spacesAction id="wcLogoutLink" type="logout" inlineStyle="white-space:nowrap" text="#{uib_o_w_w_r_WebCenter.GLOBAL_LINK_LOGOUT}" shortDesc="#{uib_o_w_w_r_WebCenter.GLOBAL_LINK_LOGOUT_DESC}"/>
                                           <af:spacer width="10" id="gtbps61" rendered="#{security.authenticated}"/>
                                           <wcdc:spacesAction id="wcLoginLink" type="login" inlineStyle="white-space:nowrap" text="#{uib_o_w_w_r_WebCenter.GLOBAL_LINK_LOGIN}" shortDesc="#{uib_o_w_w_r_WebCenter.GLOBAL_LINK_LOGIN}"/>
                                           <af:spacer width="10" id="gtbps6133" rendered="#{security.authenticated}"/>
                                           <af:goLink text="Back to Portal" id="pt_gl1" rendered="#{security.authenticated}" destination="http://james:8888/webcenter"/>
                                           <af:spacer width="10" id="gtbps62" rendered="#{changeModeBean.inEditMode or !security.authenticated}"/>
                                           <wcdc:spacesAction id="selfRegWcLink" type="selfRegistration" text="#{uib_o_w_w_r_WebCenter.GLOBAL_LINK_SELFREG}" shortDesc="#{uib_o_w_w_r_WebCenter.GLOBAL_LINK_SELFREG_DESC}" inlineStyle="white-space:nowrap"/>
                                           <af:spacer width="10" id="gtbps63" rendered="#{changeModeBean.inEditMode or                                             (WCAppContext.application.applicationConfig.publicregistrationEnabled and                                             !security.authenticated)}"/>
                                        </cust:panelCustomizable>
                                     </af:panelGroupLayout>
                                     <trh:script id="edvkloastar54" text="                 function wcNavigate(event)                 {                   window.location = event.getSource().getProperty('wcDestination');                   event.cancel();                 }                 function wcLaunchWindow(event)                 {                   window.open(event.getSource().getProperty('wcDestination'));                   event.cancel();                 }               "/>
                                  </af:panelGroupLayout>
                               </f:facet>
                            </af:panelBorderLayout>
                         </af:panelBorderLayout>
                      </f:facet>
                   </af:decorativeBox>
                   <div id="navbox" style="padding: 0px 0px 0px 0px;width:990px;margin-left:0px;margin-top:0px;">
                      <c:set var="navNodes" value="${navigationContext.defaultNavigationModel.listModel['startNode=/, includeStartNode=false']}" scope="session"/>
                      <ul id="nav" style="height:30px;margin-left:0px;margin-top:0px;">
                         <li>
                            <br/>
                            <c:choose>
                               <c:when test="${!securityContext.authenticated}">
                                  <div id="loginbox">
                                     <table border="0" cellpadding="2" cellspacing="2">
                                        <tr>
                                           <td valign="middle">
                                              <af:inputText id="pt_it1" value="#{o_w_s_l_LoginBackingBean.userName}" label="Username" inlineStyle="color:white;"/>
                                           </td>
                                           <td/>
                                           <td rowspan="2">
                                              <img src="http://james:16200/cs/groups/personalspaces/documents/document/mdaw/zw5y/~edisp/enroll.png"/>
                                              <br/>
                                              <br/>
                                                Enroll
                                           </td>
                                        </tr>
                                        <tr>
                                           <td valign="middle">
                                              <af:inputText id="pt_it2" secret="true" value="#{o_w_s_l_LoginBackingBean.password}" label="Password" inlineStyle="color:white;"/>
                                           </td>
                                           <td>
                                              <af:commandLink id="pt_logincb" text="Sign In" action="#{o_w_s_l_LoginBackingBean.doLogin}" inlineStyle="border: medium none;color: #FFFFFF;cursor: pointer;float: left;font-family:  Tahoma;font-size: 1.2em;font-weight: bold;text-align:  center;width:45px;height:5px;background:blue;padding-bottom: 6px;"/>
                                           </td>
                                        </tr>
                                     </table>
                                  </div>
                               </c:when>
                               <c:when test="${securityContext.authenticated}">
                                  <div id="postloginbox">
                                     <table border="0" cellpadding="2" cellspacing="2">
                                        <tr>
                                           <td valign="middle">
                                              <br/>
                                                   Welcome &nbsp;&nbsp;
                                              <b>${securityContext.userName}</b>
                                           </td>
                                           <td rowspan="2">
                                              <img src="http://james:16200/cs/groups/personalspaces/documents/document/mdaw/mdaw/~edisp/wl.jpg"/>
                                           </td>
                                           <td valign="middle">
                                              <br/>
                                                Help / Support
                                           </td>
                                        </tr>
                                        <tr>
                                           <td>
                                               Edit Profile
                                           </td>
                                           <td>
                                                Savings account  
                                           </td>
                                        </tr>
                                     </table>
                                  </div>
                               </c:when>
                            </c:choose>
                         </li>
                         <c:forEach var="menu" varStatus="vs" items="${navNodes}">
                            <li class="parentnode">
                               <a href="/webcenter${menu.goLinkPrettyUrl}" class="${menu.selected}">${menu.title}</a>
                               <c:if test="${not empty menu.children}">
                                  <ul>
                                     <c:forEach var="child" items="#{menu.children}">
                                        <li class="childnode">
                                           <a href="/webcenter${child.goLinkPrettyUrl}">${child.title}</a>
                                           <c:if test="${not empty child.children}">
                                              <ul>
                                                 <c:forEach var="grandchild" items="#{child.children}">
                                                    <li class="grandchildnode">
                                                       <a href="/webcenter${grandchild.goLinkPrettyUrl}">${grandchild.title}</a>
                                                    </li>
                                                 </c:forEach>
                                              </ul>
                                           </c:if>
                                        </li>
                                     </c:forEach>
                                  </ul>
                               </c:if>
                            </li>
                         </c:forEach>
                      </ul>
                   </div>
                   <af:panelGroupLayout id="pt_pglc" layout="vertical" inlineStyle="min-height:600px;padding:#{attrs.panelSeparatorHeight}px 0px 12px;" styleClass="WCContent">
                      <af:region value="#{bindings.spacesNavigationPageHeader.regionModel}" id="wcSpcInd"/>
                      <af:skipLinkTarget/>
                      <af:facetRef facetName="content"/>
                   </af:panelGroupLayout>
                   <af:panelBorderLayout id="appftpsl1" styleClass="WCSiteTemplateFooter" rendered="#{changeModeBean.inEditMode or                                                    (WCAppContext.currentScope.default and !WCAppContext.application.applicationConfig.footerHidden) or                                                   (!WCAppContext.currentScope.default and boilerBean.footerDisplayedInSpace)}">
                     James Smith Bank   © 2012 jamessmith73.wordpress.com
                   </af:panelBorderLayout>
                </af:panelGroupLayout>
             </af:panelGroupLayout>
          </af:panelGroupLayout>
       </af:pageTemplateDef>
    </jsp:root>


Author

About Author softwarearchitect73@gmail.com