Site creation example

 

+

Search Tips   |   Advanced Search

 

This example describes the steps required to render a simple web page by creating and linking various IBM Workplace Web Content Management items.

To create and preview a simple web page create the following items:

  • A site
  • A site area
  • A presentation template
  • An authoring template
  • A content item
  • Components

You will also need to:

  • Define a template map between the authoring template and presentation template.

  • Add a Web Content Management tag for each element displayed within a presentation template.

 

Create a simple workflow

Before creating any other item, create a simple workflow to use when creating a content item.

 

Create a site and site area

  • Create a site named NewsSite.

  • Save and close the site form.

  • Create a site area named NewsSiteArea.

  • Save and close the site area form.

 

Create a presentation template

  • Create a presentation template named NewsPresentationTemplate.

  • Create a simple HTML table in the presentation template by adding the following code into the presentation template section.

    <html>
    <head></head>
    <body TEXT="Black" BGCOLOR="White" BACKGROUND=""  LEFTMARGIN="0" RIGHTMARGIN="0"TOPMARGIN="0" BOTTOMMARGIN="0">
    
    <table >
    <tr>
    <td></td>
    <td></td>
    <td></td>
    </tr>
    </table>
    
    </body>
    </html>
    
    .

  • Save and close the presentation template.

 

Create an authoring template

 

Create some content

  • Create a new content item named NewsContent.

  • Select NewsAuthoringTemplate when creating the new content item.

  • Go to the contents section and enter some text in the body element.

  • Go to the workflow section and select the News Workflow.

  • Click Save.

  • Select NewsSiteArea.

  • Click OK and save and close the content item.

 

Map templates and link content

  • Go back to the site framework view.

  • Go to Site Areas -> Site -> NewsSite

  • Open NewsSiteArea.

  • Edit the template map and link NewsPresentationTemplate and NewsAuthoringTemplate.

  • Set NewsContent as the default content for the site area.

  • Save and close the site area.

 

Reference the body element in the presentation template

  • Go back to the presentation template view and open NewsPresentationTemplate.

  • Enter the following element tag into one of the table cells of the presentation template.

    <element type="Content" context="current" key="body"/>
    

    The content of the element tag will change depending on which content item is displayed.

  • Save and close the presentation template.

 

Preview the web page

  • Go back to the content view and preview NewsContent.

    Tip: You may need to configure the browser to allow pop-ups to preview the content.

  • The text you typed in the body element should appear on the rendered web page.

  • Close the preview window.

 

Add a navigator

 

Reference the navigator in the presentation template

  • Go back to the presentation template view and open NewsPresentationTemplate.

  • Enter the following component tag into one of the table cells of the presentation template.

    <component name="NewsNav" />
    

    As you are referencing the navigator directly from a component, the navigator is always displayed in this presentation template. The content of the navigator will change depending on which site area and content items are currently being referenced.

  • Save and close the presentation template.

 

Preview the web page

  • Go back to the content library view and preview NewsContent.

  • A navigator should appear on the rendered web page.

  • Close the preview window.

 

Add an image component

 

Reference the image in the presentation template

  • Go back to the presentation template view and open NewsPresentationTemplate.

  • Enter the following component tag into one of the table cells of the presentation template.

    <component name="NewsImage" />
    

    As you are referencing the image directly from a component, the Image is always displayed in this presentation template.

  • Save and close the presentation template.

 

Preview the web page

  • Go back to the content library view and preview NewsContent.

  • An image should appear on the rendered web page.

  • Close the preview window.

 

Parent Topic

An overview of developing Web content