SAP NetWeaver – Step by step guide to add Footer iView to CE 7.31 AJAX Framework Page

SAP Enterprise Portal requires a lot of customizations to meet company’s branding requirements for External Facing Portal. Achieving web page like experience some time becomes a challenging task.

It took our significant effort to put company’s general documents on footer of all Portal pages as SAP does not provide out-of-box functionality through which developer can easily assign footer page to existing AJAX Framework Page. Here is one stop bespoke solution to add Footer page to AFP Framework Page.

Let’s get started..

Step 1: Get following files from Java Application server file system

• File Name:  com.sap.portal.navigation.afp.layout.war
• Location:\usr\sap\SID>\J<instance_no>\j2ee\cluster\apps\ sap.com\com.sap.portal.navigation.afp.layout\servlet_jsp\com.sap.portal.navigation.afp.layout\

Step 2: Create DC from layout war file using server compliant NWDS version

• File -> Import -> War File -> Choose above mentioned war file

This will create new project with structure as follows.

Step 3: Create a new Development Component as follows

• Name: app/layout
• DC Type: J2EE / WebModule [sap.com]
• Dependent On: None

This DC will have similar structure as shown in above figure.Perform following steps in this DC.

1. Delete all content from WebContent folder.
2. Copy content of WebContent folder from project created using AFP layout file in Step 2 above and Paste in WebContent folder of this project.
3. Open portalapp.xml -> Go to Source Tab
4. Find property name com.sap.portal.reserved.layout.Cont<1-6>. There should be 6 different iView containers already in this xml file.
5. Add new container named com.sap.portal.reserved.layout.Cont7 with value=bottomFixedContainer as follows. It can be copy pasted from existing container properties.
6. Remember to change plainDescription property with value = “Footer Container” as given below.

<propertyname="com.sap.portal.reserved.layout.Cont7" value="bottomFixedContainer"><propertyname="plainDescription"value="Footer Container"/><propertyname="orientation"value="vertical"/><propertyname="designClass"value="prtlPageConL"/></property>

7.  Now, Open JSP Page named LShapeLayout.jsp
8.  Add new Table row tag with code as follows.

<tr>  <td nowrap="nowrap">

</td></tr>

Note: Remember to change container Id to bottomFixedContainer as shown above. This code can be placed at end of Table containing all layout containers.

Step 4: Create another new Development Component as follows –

•   Name: app/layout/ear
•   DC Type: J2EE / Enterprise Application [sap.com]
•   Dependent On: app/layout (Above created Web Module DC)

Step 5: Build and Deploy DC created at Step 3 via EAR DC at Step 4. 

Step 6: Go to SAP Enterprise Portal -> Content Administration -> Portal Applications

1. Spot newly deployed file with name <vendorName>~app~layout
2. Copy ‘AFP framework layout’ Page
3. Paste it as PCD Object in target folder 

Step 7: Open AJAX Framework Page you intend to use.

1. Go to Add/Remove Layouts button on right section of page.
2. It will allow you to select layout created in Step 6.3, in a popup window.
3. Select your bespoke layout name from ‘Current Layout’ drop down box. You should be able to find Footer Container in preview section as shown below.
4. Add Footer iView to your Ajax Framework page and choose ‘Footer Container’
5. Save it.

Note: Setting up Desktop and Display rule are not discussed in this document. We assume readers are familiar with this process.

Final Outcome:
Static Footer Page will be displayed at each navigation level.

Let me know for no obligation consulting assistance. Leave your comments for feedback or discussion.