[jboss-user] [JBoss Portal] - Re: Custom layout for a portal page
aerostra
do-not-reply at jboss.com
Mon Aug 27 12:38:02 EDT 2007
"webhunter" wrote : just bringing it up to the top of the queue. Any ideas as to how one can achieve the above requirement. Thanks.
As I had nothing to do I had a quick go at this and I have based the following on the generic layout with the renaissance theme. It is "work in progress" and works almost as it should look in JBP 2.4.1 with Firefox 1.5 and Opera 9.2 at around 1024 pixels in width. It gives strange results in IE6 & 7 hence I state again this is a work in progress and purely a demo. The following just modifies the generic layout to this:
Logo
Navigation
Top
Left|Right
Bottom
Footer
Top & Bottom rows are full width, Left/Right are 50% each.
In the first instance, make sure you have changed your admin layout to something that does not rely on the generic layout
e.g. phalanx then stop the server after logging out. You will have problems trying to change the layout afterwards as
the regions have been modified. Obviously, don't do this in a live environment!
1) In portal-layout.xml (server/default/deploy/jboss-portal.sar/portal-core.war/WEB-INF/portal-layout.xml)
Replace the current generic layout tags with the following:
<layout>
| <name>generic</name>
| <uri>/layouts/generic/index.jsp</uri>
| <uri state="maximized">/layouts/generic/maximized.jsp</uri>
| <regions>
| <region name="left"/>
| <region name="right"/>
| <region name="top"/>
| <region name="bottom"/>
| <region name="navigation"/>
| </regions>
| </layout>
Save file.
2) Edit portal_style.css
(server/default/deploy/jboss-portal.sar/portal-core.war/themes/renaissance/portal_styles.css)
Replace regionA, regionB and regionC with the following and add regionD as below:
/* portlet regions within content-container. this includes footer-container. */
| #regionA {
|
| /*50%: Left*/
| width: 50%;
| float: left;
| min-width: 250px;
| height: 300px;
| }
|
| #regionB {
| /* 50% right*/
| width: 50%;
| float: left;
| min-width: 250px;
| height: 300px;
| }
|
| #regionC {
| /* 100%: TOP row */
| padding: 0px;
| margin: 0px;
| width: 100%;
|
| }
|
| #regionD {
| /* 100% BOTTOM row, set 300px from top to avoid overlap for Region A + B. Adjust accordingly */
| padding: 300px 0 0 0;
| margin: 0px;
| width: 100%;
|
| }
save file.
3) Edit index.jsp
(server/default/deploy/jboss-portal.sar/portal-core.war/themes/layouts/generic/index.jsp)
Replace from the body tag with:
<body id="body">
| <div id="portal-container">
| <div id="sizer">
| <div id="expander">
| <div id="logoName"></div>
| <p:region regionName='navigation' regionID='navigation'/>
| <div id="spacer"></div>
| <div id="content-container">
| <!--top row, assigned as css id: regionC -->
| <p:region regionName='top' regionID='regionC'/>
| <!-- insert the content of the 'left' region of the page, and assign the css selector id 'regionA' -->
| <p:region regionName='left' regionID='regionA'/>
| <!-- insert the content of the 'right' region of the page, and assign the css selector id 'regionB' -->
| <p:region regionName='right' regionID='regionB'/>
| <!-- bottom row,assigned as css id: regionD -->
| <hr class="cleaner"/>
| <p:region regionName='bottom' regionID='regionD'/>
| <div id="footer-container" class="portal-copyright">Powered by <a class="portal-copyright"
| href="http://www.jboss.com/products/jbossportal">JBoss
| Portal</a><br/>
| <span id="ThemeBy"></span>
| </div>
| </div>
| </div>
| </div>
| </div>
| </body>
|
Save the file.
Restart the server and it will pick up the new layout for renaissance. Create a new page with the generic layout/renaissance theme and assign portlets accordingly into the right regions.
View the original post : http://www.jboss.com/index.html?module=bb&op=viewtopic&p=4078435#4078435
Reply to the post : http://www.jboss.com/index.html?module=bb&op=posting&mode=reply&p=4078435
More information about the jboss-user
mailing list