Displaying Articles

Use the article page layout to display an article within the publication. You have the freedom to arrange this page as desired. In the following illustration, the article is shown with a title and a side navigation bar that shows all the articles within this section.

To construct a template for a Web magazine article:

Design the template in HTML.

Before creating a template, decide on the page design and break it up into table cells.

Code example:

<HTML> 
<HEAD> 
<TITLE> PeopleTalk: Home Page </TITLE> 
<meta name="keyword" content="PSA  Professional Services Automation">
<style type="text/css">

A:HOVER {
   font-family : Arial, Helvetica, sans-serif;
   color: #FF0000;
   text-decoration: none;
}

A:LINK {
   font-family : Arial, Helvetica, sans-serif;
   color: #0000FF;
   text-decoration: none;
}

A:VISITED {
   font-family : Arial, Helvetica, sans-serif;
   color: #0000FF;
   text-decoration: none;
}

A:HOVER.leftnavlink {
   font-family : Arial, Helvetica, sans-serif;
   color: #FF0000;
   text-decoration: none;
}

A:LINK.leftnavlink {
   font-family : Arial, Helvetica, sans-serif;
   color: #0000FF;
   text-decoration: none;
}

A:VISITED.leftnavlink {
   font-family : Arial, Helvetica, sans-serif;
   color: #0000FF;
}

.bodytext {
   font-family : Arial, Helvetica, sans-serif;
   font-size : 10pt;
   color : #000000;
   background-color : #FFFFFF;
}

.blocktext {
   font-family : Arial, Helvetica, sans-serif;
   font-size : 10pt;
   color : #000000;
   background-color : #FFFFFF;
}

</style>
</HEAD>
 
<BODY>
 
<TABLE BORDER="0" CELLPADDING="0" CELLSPACING="0" WIDTH="760">

<!-- Header -->
<TR> 
<TD COLSPAN=2> 
%BIND(:1)
</TD>
</TR> 

<!-- Navigation Bar 1 -->
<TR> 
<TD  COLSPAN=2>
%BIND(:2) 
</TD>
</TR>

<!-- Navigation Bar 2 -->
<TR> 
<TD  COLSPAN=2 BACKGROUND="%BIND(:3)">
%BIND(:4) 
</TD>
</TR> 

<!-- Category Picture -->
<TR> 
<TD WIDTH="140" HEIGHT="130">
%BIND(:5) 
</TD>

<!-- Article Title Picture -->
<TD WIDTH="620">
%BIND(:6) 
</TD>
</TR>

<!-- Section Articles Navigation Bar -->
<TR> 
<TD WIDTH="140" BGCOLOR="#CCFFCC" VALIGN="TOP">
%BIND(:7) 
</TD>

<!-- Article Body -->
<TD>
        <table width="100%" border="0" cellspacing="0" cellpadding="8"> 
        <tr> 
        <td class="bodytext">
        %BIND(:8) 
        </td>
        </tr>
        </table>
</TD>
</TR>

<!-- Footer -->
<TR> 
<TD  COLSPAN=2>
%BIND(:9) 
</TD>
</TR>

</TABLE>

</BODY> 
</HTML>

Place this HTML code within an HTML object in PeopleTools.
Add the appropriate BIND parameters to each cell in the HTML object for your template.
Save the HTML object in PeopleTools.
Open the record WEBLIB_WEBPUB in PeopleTools.
Navigate to the record PeopleCode for the field EO_PE_TEMPLATES.
Edit this PeopleCode to suit your needs.
Call functions to get the values for the bind variables.
1. Under the function IScript_ArticleTemplate, add the appropriate functions to bind values to the values you have set up in your HTML object (the article template).
  In our example, we will bind a value to the fifth bind variable. The fifth cell in the article template represents the category image. The function IScript_GetCategoryImg is delivered with Web Magazine to get the category image.
2. From the PeopleCode in IScript_ArticleTemplate, call the function IScript_GetCategoryImg and set it to a string variable.
  In our example, set the return value of the function to the variable &HTMLCategoryImage.
  
  Example:
```
rem;
rem    Category Image;
rem;
&HTMLCategoryImage = IScript_GetCategoryImg();
```
Bind function values to the HTML object (article template).
Bind &HTMLCategoryImage into the HTML object (article template) using the function GetHTMLText.

This function takes our HTML object (article template), which was saved as EO_PE_ARTICLETEMPLATE, and binds into it the bind values. These values must occur in the order in which they were specified in the HTML object. The variable &HTMLCategoryImage is listed fourth because it is the fourth bind variable.

Example:
```
&HTMLText = GetHTMLText(HTML.EO_PE_ARTICLETEMPLATE, &HTMLHeader, &HTMLNav1,
 IScript_GetImageFileSpec("PWSA19OE
85C"), &HTMLNav2, &HTMLCategoryImage, &HTMLTitle, &HTMLNav3, &HTMLBody,
 &HTMLFooter);
```
Register Article Template within the portal.
Repeat the process and bind additional cells within the HTML object (article template).
For each bind value, you can add a function, another HTML object, or static text/images. Continue until all the cells of the HTML object have values. When you finish, the page should look like the PeopleTalk page shown in the previous illustration.

See PeopleTools: Application Designer Developer's Guide for information about designing template.