test

Sun Java System Portal Server 7 Enterprise Sample Guide

Displaying Content Using Layout Properties

You can change the layout of columns by modifying their layout properties. The layout of the columns is determined by a numeric value you assign for each table container. Every channel can be assigned a thickness: thin or wide. All the thin and wide channels are then aggregated by the containers and displayed according to the selected channel layout.

Changing the Width and Number of Columns

The numeric value for the layout is unique and is used as the value for the layout property of the container. Table 3–1 shows the numeric values associated with the number of columns and their widths.

Table 3–1 Column Layout

Layout  

Number of Columns  

Numeric value  

Thin - Wide 

Two 

1 

Wide - Thin 

Two 

2 

Thin - Wide - Thin 

Three 

3 

The default layout of the NewsContainer is Thin - Wide - Thin. The Enterprise Sample defines column widths as layout=3 (Thin-Wide-Thin). To extend support for more layouts, refer to Adding New Layouts.

ProcedureTo Change the Width and Number of Columns of a Nested Tab

Steps

  1. Login to the Portal Server administration console as administrator (amadmin).

  2. Click the Portals tab and click on the portal-ID in the list of portals.

  3. Select Enterprise Sample from the drop down list for Current Location.

  4. Click the Manage Containers & Channels link.

  5. Select NewsContainer in the left side frame.

  6. Change layout property to a new numeric value (refer to layout table for valid values).

  7. Click Save to save the changes.

ProcedureTo Verify that the Layout Properties Are Changed

Steps

  1. Access the Enterprise Sample anonymous portal.

  2. Login as Mary with the password mary.

    The new layout for NewsContainer displays.

Adding New Layouts

The Enterprise Sample relies on the CSS file for positioning of channels on the page. When creating new layouts or modifying existing layouts, review the Enterprise Sample CSS files under /var/opt/SUNWportal/portals/portal-ID/web-src/enterprise/css.

The various CSS file are available and are selected based on client browser type and client operating system. The CSS file selection logic can be found in writeCSS function in /var/opt/SUNWportal/portals/portal-ID/web-src/enterprise/js/util.js.

ProcedureTo Add New Layouts

The Enterprise Sample supports layout=3 (THIN-WIDE-THIN) layout.

You can extend the code to support multiple layouts by modifying the file /var/opt/SUNWportal/portals/portal-ID/desktop/enterprise_sample/JSPTableContainerProvider/table.jsp.

Step

    Replace the code in the table.jsp Listing 1 with the code in Listing 2.

    Listing 1


    <!-- Begin Left Column of Channels -->
<div class="tableContainerColumnLeft">
<dttable:getColumns id="channels" column="left" scope="request"/>
<jsp:include page="column.jsp" flush="true">
<jsp:param name="columnName" value="center"/>
</jsp:include>
</div>
<!-- End Left Column of Channels -->

<!-- Begin Middle Column of Channels -->
<div class="tableContainerColumnCenter"">
<dttable:getColumns id="channels" column="center" scope="request"/>
<jsp:include page="column.jsp" flush="true">
<jsp:param name="columnName" value="center"/>
</jsp:include>
</div>
<!-- End Middle Column of Channels -->

<!-- Begin Right Column of Channels -->
<div class="tableContainerColumnRight">
<dttable:getColumns id="channels" column="right" scope="request"/>
<jsp:include page="column.jsp" flush="true">
<jsp:param name="columnName" value="center"/>
</jsp:include>
</div>
<!-- End Right Column of Channels -->

    Listing 2

    You can find the original code in /var/opt/SUNWportal/portals/portal-ID/desktop/enterprise_sample/JSPTableContainerProvider/table.jsp starting at Line # 78


    <dtpc:getIntegerProperty key="layout" id="layout"/>
<jx:declare id="layout" type="Integer"/>

<!-- start table-container -->
<% if (layout == 1) { %>
<!-- THIN-WIDE layout -->
<!-- Begin Left Column of Channels -->
<div class="tableContainerColumnLeft">
<dttable:getColumns id="channels" column="left" scope="request"/>
<jsp:include page="column.jsp" flush="true">
<jsp:param name="columnName" value="left"/>
</jsp:include>
</div>
<!-- End Left Column of Channels -->

<!-- Begin Right Column of Channels -->
<div class="tableContainerColumnCenter">
<dttable:getColumns id="channels" column="right" scope="request"/>
<jsp:include page="column.jsp" flush="true">
<jsp:param name="columnName" value="center"/>
</jsp:include>
</div>
<!-- End Right Column of Channels -->

<% } else if (layout == 3) { %>
<!-- THIN-WIDE-THIN layout -->
<!-- Begin Left Column of Channels -->
<div class="tableContainerColumnLeft">
<dttable:getColumns id="channels" column="left" scope="request"/>
<jsp:include page="column.jsp" flush="true">
<jsp:param name="columnName" value="left"/>
</jsp:include>
</div>
<!-- End Left Column of Channels -->

<!-- Begin Middle Column of Channels -->
<div class="tableContainerColumnCenter">
<dttable:getColumns id="channels" column="center" scope="request"/>
<jsp:include page="column.jsp" flush="true">
<jsp:param name="columnName" value="center"/>
</jsp:include>
</div>

<!-- Begin Right Column of Channels -->
<div class="tableContainerColumnRight">
<dttable:getColumns id="channels" column="right" scope="request"/>
<jsp:include page="column.jsp" flush="true">
<jsp:param name="columnName" value="right"/>
</jsp:include>
</div>
<!-- Begin Right Column of Channels -->

<% } else if (layout == 4) { %>
<!-- Add custom layout here -->
<% } %>
</div><!-- end table-container -->

    Redeploy the portal web application using the utility: /opt/SUNWportal/bin/psadmin redeploy adminuser amAdmin -passwordfile password-filename -portal portal-ID.