29 Template Element Examples for Basic Assets

This chapter uses examples from the Burlington Financial sample site to illustrate the information presented in Chapter 28, "Coding Elements for Templates and CSElements."

This chapter contains the following sections:

Section 29.1, "Example 1: Basic Modular Design"
Section 29.2, "Example 2: Coding Links to the Article Assets in a Collection Asset"
Section 29.3, "Example 3: Using the ct Variable"
Section 29.4, "Example 4: Coding Templates for Query Assets"
Section 29.5, "Example 5: Displaying an Article Asset Without a Template"
Section 29.6, "Example 6: Displaying Site Plan Information"
Section 29.7, "Example 7: Displaying Non-Asset Information"

All of the elements described in this section are from the Burlington Financial sample site.

29.1 Example 1: Basic Modular Design

The Burlington Financial sample site is an example of a modular site design that takes advantage of common elements so that common code is written once but reused in several locations or contexts. Following is a description of how one area on the Burlington Financial home page is created from five separate elements.

First, open the WebCenter Sites interface, select the Burlington Financial site and preview the Home page asset. You can either search for the asset and select Preview from the drop-down list on the icon bar or you can expand the Placed Pages icon under the Burlington Financial node in the Site Plan tab, select the Home page, and then select Preview from the right-mouse menu.

WebCenter Sites displays the Burlington Financial home page in your browser.

Directly under the date, there is a column that displays the main stories of the day. There is a summary paragraph and byline for each story in the list. The titles of the stories are hyperlinks to the full story. Several of the stories, including the first story in the list, also present a photo:

Description of g-mainstorylist.gif follows

Description of the illustration g-mainstorylist.gif

This example describes how the first story in the list is identified, selected, positioned at the top of the list, and formatted.

These are the elements used to format the first story in the list:

BurlingtonFinanical/Page/Home
BurlingtonFinancial/Collection/MainStoryList
BurlingtonFinancial/Article/LeadSummary
BurlingtonFinancial/ImageFile/TeaserSummary

This section contains the following topics:

Section 29.1.1, "First Element: Home"
Section 29.1.2, "Second Element: MainStoryList"
Section 29.1.3, "Third Element: LeadSummary"
Section 29.1.4, "Fourth Element: TeaserSummary"
Section 29.1.5, "Back to LeadSummary"
Section 29.1.6, "Back to MainStoryList"
Section 29.1.7, "Back to Home"

29.1.1 First Element: Home

The Home page of the of the Burlington Financial sample site uses a template that is also named Home. You can examine it in two ways:

Search for and then inspect it in the WebCenter Sites interface.
Use Oracle WebCenter Sites Explorer to open the template element called:
```
ElementCatalog/BurlingtonFinancial/Page/Home
```

First, the Home element loads the home page asset, names it HomePage, and then scatters the information in its fields:

<ASSET.LOAD TYPE="Variables.c" OBJECTID="Variables.cid" NAME="HomePage"/>
<ASSET.SCATTER NAME="HomePage" PREFIX="asset"/>

The value for cid is passed in from the Burlington Financial URL and the value for c is available because it is set as a variable in the resarg1 column in the SiteCatalog page entry for the Home template.

Scroll down past several callelement and RENDER.SATELLITEPAGE tags to the following ASSET.CHILDREN tag:

<ASSET.CHILDREN NAME=HomePage LIST=MainStories CODE=TopStories/>

With this code, Home obtains the collection asset identified as the page asset's TopStories collection (CODE=TopStories) and creates a list named MainStories to hold it (LIST=MainStories).

Next, Home determines whether it successfully obtained the collection and then calls for the page entry of the MainStoryList template.

<IF COND = IsList.MainStories=true>
<THEN>
<RENDER.SATELLITEPAGE pagename=BurlingtonFinanical/Collection/MainStoryList
ARGS_cid=MainStories.oid
ARGS_p=Variables.asset:id/>
<THEN/>
<IF/>

Notice that Home passes the identity of the list that holds the collection to MainStories with ARGS_cid and the identity of the Home page asset with ARGS_p=Variables.asset:id.

29.1.2 Second Element: MainStoryList

The MainStoryList page entry invokes its root element. Use Oracle WebCenter Sites Explorer to open and examine this element:

ElementCatalog/BurlingtonFinancial/Collection/MainStoryList.xml

The MainStoryList element is the template element (the root element) for the MainStoryList Template asset, a template that formats collection assets.

This element creates the framework for the Home page column that holds the main list of stories, and then fills that column with the articles from the TopStories collection. It uses two templates to format those articles:

LeadSummary for the first article in the collection (the top-ranked article)
Summary for the rest of the articles

Because the purpose of this example is to describe how the first story in the list is displayed, this example discusses only the LeadSummary template element.

MainStoryList loads and scatters the collection that Home passed to it:

<ASSET.LOAD TYPE="Variables.c" OBJECTID="Variables.cid"
NAME="MainStoryListCollection"/>
<ASSET.SCATTER NAME="MainStoryListCollection" PREFIX="asset"/>

It then extracts the articles from the collection, creates a list to hold them, ordering them by their rank:

<ASSET.CHILDREN NAME="MainStoryListCollection" LIST="theArticles"
ORDER="nrank" CODE=-/>

And then it calls for the page entry of the LeadSummary template:

<RENDER.SATELLITEPAGE PAGENAME="BurlingtonFinancial/Article/LeadSummary"
ARGS_cid="theArticles.oid"
ARGS_ct="Full"
ARGS_p="Variables.p"/>

Once again, this element passes on several pieces of information:

The identity of the list that holds the articles (ARGS_cid)
The name of the template to use when creating the link to each of the articles (ARGS_ct)
The identity of the originating page asset (ARGS_p), which is Home.

Because the list was ordered by rank and this code does not loop through the list, the value in ARGS_cid (theArticles.oid) is the object ID of the highest ranked article in the collection because that article is the first article in the list.

29.1.3 Third Element: LeadSummary

The LeadSummary page entry invokes its root element (which is the template element for the LeadSummary template). Use Oracle WebCenter Sites Explorer to open and examine it:

ElementCatalog/BurlingtonFinancial/Article/LeadSummary.xml

This element formats the first article in the TopStories collection. It does the following:

Retrieves the image file associated with the first article through the TeaserImage association.
Invokes the TeaserSummary element to obtain the formatting code for the image.
Uses a RENDER.GETPAGEURL tag to obtain the URL for the first article in the collection.
Displays the imagefile asset, the title of the article as a hyperlink to the full article, the summary paragraph, and the byline.

First LeadSummary loads the article and names it LeadSummaryArticle:

<ASSET.LOAD TYPE="Variables.c" OBJECTID="Variables.cid" NAME="LeadSummaryArticle"/>
<ASSET.SCATTER NAME="LeadSummaryArticle" PREFIX="asset"/>

It obtains the assets associated with the article as its Teaser imagefile asset, creating a list for that file named TeaserImage:

<ASSET.CHILDREN NAME="LeadSummaryArticle" LIST="TeaserImage" CODE="TeaserImageFile"/>

Finally, it calls the page entry for the TeaserSummary template, passing it the ID of the imagefile asset held in the list:

<THEN>
<RENDER.SATELLITEPAGE PAGENAME="BurlingtonFinancial/ImageFile/TeaserSummary"
ARGS_cid="TeaserImage.oid"/>
</THEN>
</IF>

29.1.4 Fourth Element: TeaserSummary

The TeaserSummary page entry invokes its root element, the template element for the TeaserSummary template. Use Oracle WebCenter Sites Explorer to open and examine it:

ElementCatalog/BurlingtonFinancial/ImageFile/TeaserSummary

Because imagefile assets are blobs stored in the WebCenter Sites database, and blobs stored in the database must be served by the BlobServer servlet rather than the ContentServer servlet, this element obtains an HTML tag that uses a BlobServer URL.

Scroll down to the following RENDER.SATELLITEBLOB tag:

<RENDER.SATELLITEBLOB BLOBTABLE=ImageFile BLOBKEY=id BLOBCOL=urlpicture BLOBWHERE=Variables.asset:id BLOBHEADER= Variables.asset:mimetype SERVICE=IMG SRC ARGS_alt= Variables.asset:alttext ARGS_hspace=5 ARGS_vspace=5 />

The tag creates an HTML <IMG SRC> tag. The SRC is the blob in the ImageFile table identified through the ID passed in with BLOBWHERE=Variables.asset:id and both its horizontal and vertical spacing are at five pixels.

When TeaserSummary is finished, LeadSummary continues.

29.1.5 Back to LeadSummary

When LeadSummary resumes, having obtained the teaser image for the first article in the TopStories collection, it uses RENDER.GETPAGEURL to obtain the URL for that article:

<RENDER.GETPAGEURL PAGENAME="BurlingtonFinancial/Article/Variables.ct"
cid="Variables.cid"
c="Article"
p="Variables.p"
OUTSTR="referURL"/>

Remember that when the MainStoryList element called the page entry for LeadSummary, it passed a ct variable set to Full. Therefore, the page name that LeadSummary is passing to RENDER.GETPAGEURL is really BurlingtonFinancial/Article/Full.

RENDER.GETPAGEURL creates the URL for the article based on the information passed in to it and then returns that URL to LeadSummary in a variable called referURL, as specified by the OUTSTR parameter.

LeadSummary uses the referURL variable in an HTML <A HREF> tag and then displays the link, the abstract of the article, and the byline:

<A class="featurehead" HREF="Variables.referURL" REPLACEALL="Variables.referURL">
<csvar NAME="Variables.asset:description"/></A> 
&nbsp;<BR/>
<span class="thumbtext"><csvar NAME="Variables.asset:abstract"/>
</span><BR/>
<span class="thumbcredit"><csvar NAME="Variables.asset:byline"/>
</span><BR/>

Note the use of the REPLACEALL tag as an attribute in the HTML <A HREF> tag. You must use this tag as an attribute when you want to use XML variables in HTML tags.

Now that LeadSummary is finished, MainStoryList continues.

29.1.6 Back to MainStoryList

Next MainStoryList loops through the rest of the articles in the TopStories collection and uses the Summary template to format them.

If you are interested, use Oracle WebCenter Sites Explorer to open and examine it:

ElementCatalog/Article/Summary

When MainStoryList is finished, Home continues.

29.1.7 Back to Home

Home resumes, with a call to the WireFeedBox page entry.

29.2 Example 2: Coding Links to the Article Assets in a Collection Asset

When an element needs URLs to create a list of hyperlinks to dynamically served WebCenter Sites pages, use the RENDER.GETPAGEURL tag.

These are the elements referred to in this example:

ElementCatalog/BurlingtonFinancial/Page/SectionFront
ElementCatalog/BurlingtonFinancial/Collection/PlainList

For the purposes of this example, the code displayed is stripped of any error checking so that you can focus on how the links are created.

This section contains the following topics:

Section 29.2.1, "First element: SectionFront"
Section 29.2.2, "Second element: PlainList"

29.2.1 First element: SectionFront

SectionFront is the template element, the root element, of the SectionFront template which is assigned to the main section pages; News, Markets, Stocks, and so on. It is invoked when a visitor clicks a link to a section.

One section of a page formatted with the SectionFront element displays a list of links to articles from the Section Highlights collection that is associated with that page asset.

Description of p_sectionfront.gif follows

Description of the illustration p_sectionfront.gif

Use Oracle WebCenter Sites Explorer to open and examine the SectionFront element:

ElementCatalog/BurlingtonFinancial/Page/SectionFront.

First, SectionFront uses the variables c and cid to load and scatter the page asset, and names it SectionFrontPage:

<ASSET.LOAD TYPE="Variables.c" OBJECTID="Variables.cid" 
NAME="SectionFrontPage"/>
<ASSET.SCATTER NAME="SectionFrontPage" PREFIX="asset"/>

The values for c and cid are passed to the SectionFront element from the link that invoked it. That link could be from the home page or any one of several other locations.

In Oracle WebCenter Sites Explorer, scroll down past several ASSET.CHILDREN tags to the one that retrieves the Section Highlights collection:

<ASSET.CHILDREN NAME="SectionFrontPage" LIST="SectionHighlights" CODE="SectionHighlight"/>

This code retrieves the collection with the CODE=SectionHighlights statement and stores it as a list, also named SectionHighlights.

Then SectionFront calls the page entry of the PlainList template (a collection template):

<RENDER.SATELLITEPAGE 
pagename="BurlingtonFinancial/Collection/PlainList"
ARGS_cid="SectionHighlights.oid" ARGS_p="Variables.asset:id"/>

This code passes in the ID of the Section Highlights collection (cid) and the ID of the current page asset (p), which is the page asset assigned the name of SectionFrontPage.

29.2.2 Second element: PlainList

The PlainList page entry invokes its root element, the template element for the PlainList template. Use Oracle WebCenter Sites Explorer to open and examine it:

ElementCatalog/BurlingtonFinancial/Collection/PlainList.

PlainList extracts the articles from the collection and presents them in a list, by their rank, with the subheadline of the article. This element assumes that the assets in the collection are articles.

PlainList uses the values in c and cid (passed in from the SectionFront element) to load and scatter the collection:

<ASSET.LOAD TYPE="Variables.c" OBJECTID="Variables.cid" NAME="PlainListCollection"/>
<ASSET.SCATTER NAME="PlainListCollection" PREFIX="asset"/>

PlainList then sets the variable ct to Full because a value for this variable was not passed in (Full is the name of an article template):

<IF COND="IsVariable.ct!=true">
<THEN>
<SETVAR NAME="ct" VALUE="Full"/>
</THEN>
</IF>

Next PlainList creates a list of all the child articles in the collection asset, listing them by their rank, and naming the list theArticles.

<ASSET.CHILDREN NAME="PlainListCollection" LIST="theArticles" OBJECTTYPE="Article" ORDER="nrank" CODE=-/>

Note that this ASSET.CHILDREN tag used the OBJECTTYPE parameter. If you use the OBJECTTYPE parameter with this tag, the resulting list of children is a join of the AssetRelationTree and the asset table for the type you specified (in this case, the Article table) and it contains data from both tables.

There is now no need for subsequent ASSET.LOAD tags because the data that the PlainList element is going to use to create the links to these articles is stored in the Article table.

PlainList loops through the list of articles, using the RENDER.GETPAGEURL tag to create a URL for each one. In this case (because the code does not use subsequent ASSET.LOAD tags for each of the children assets) the element includes a RENDER.LOGDEP tag in the loop:

<LOOP LIST="theArticles">
<RENDER.LOGDEP cid="theArticles.id" c="Article"/>
<RENDER.GETPAGEURL PAGENAME="BurlingtonFinancial/Article/
Variables.ct"
cid="theArticles.id"
c="Article"
p="Variables.p"
OUTSTR="referURL"/>

PlainList passes a cid and pagename and the asset type with ctype for each article in the collection to the RENDER.GETPAGEURL tag. Because the variable ct was set to Full, the page name being passed to the tag is actually BurlingtonFinancial/Article/Full.

The RENDER.GETPAGEURL tag returns a referURL variable for each article in the collection, as specified by the OUTSTR parameter, and then PlainList uses the value in the referURL variable to create an HTML <A HREF> link for each article.

Because the ASSET.CHILDREN tag that obtained this collection created a join between AssetRelationTree and the Article table, PlainList can use the article's subheadline field to create the link:

<A class="wirelink" HREF="Variables.referURL"
 REPLACEALL="Variables.referURL">
<csvar NAME="Variables.theArticles:subheadline"/>
</A>
</LOOP>

Note the use of the REPLACEALL tag as an attribute for this HTML tag. You must use this tag as an HTML attribute when you want to use XML variables in an HTML tags. For more information about REPLACEALL, see the Oracle Fusion Middleware WebCenter Sites Tag Reference.

29.3 Example 3: Using the ct Variable

The ct variable represents the concept of a child template. Child templates are alternate templates. Because assets are assigned a template when they are created, the identity of an asset's template (which is not the same as a default approval template) is part of the information you obtain with an ASSET.LOAD or an ASSET.CHILDREN tag.

However, sometimes you want to use a template other than an asset's default template. In such a case, you supply the name of an alternate template with the ct variable.

For example, when a visitor browses the Burlington Financial site, there are text-only versions of most of the site available to that visitor. The text-only format is not the default format and content providers do not assign text-only formats to their assets. The Burlington Financial page elements are coded to provide the ID of the alternate, text-only template when it is appropriate to do so.

Open the WebCenter Sites interface, and preview both the Burlington Financial Columnists page and the News Page. In the upper right corner of these pages, the Plain Text link is displayed.

Description of the illustration g-plaintextlink.gif

Click the Plain Text link on the Columnists page. Then click the Plain Text link on the News Page:

Description of g-plaintextversion.gif follows

Description of the illustration g-plaintextversion.gif

Every page on the site uses the same element, the TextOnlyLink element, to determine the URL embedded in the Plain Text link for that page. The TextOnlyLink element returns the correct URL for each page because the Plain Text link on each page passes the TextOnly element the information that it needs:

The ID of the page making the request
the alternate, text-only template (that is, the child template) to use for the Plain Text link

These are the elements used in this example:

ElementCatalog/BurlingtonFinancial/Page/SectionFront
ElementCatalog/BurlingtonFinancial/Page/SectionFrontText
ElementCatalog/BurlingtonFinancial/Common/TextOnlyLink
ElementCatalog/BurlingtonFinancial/Page/ColumnistFront

This section contains the following topics:

Section 29.3.1, "First Element: SectionFront"
Section 29.3.2, "Second Element: TextOnlyLink"
Section 29.3.3, "ColumnistFront"

29.3.1 First Element: SectionFront

Use Oracle WebCenter Sites Explorer to open and examine the Section Front element:

ElementCatalog/BurlingtonFinancial/Page/SectionFront.

SectionFront is the template element (root element) of the Template asset assigned to the standard section pages on the site, pages such as News, Money, Stocks, and so on.

Scroll down approximately two-thirds of the element to this CALLELEMENT tag:

<CALLELEMENT NAME="BurlingtonFinancial/Common/TextOnlyLink">
<ARGUMENT NAME="ct" VALUE="SectionFrontText"/>
<ARGUMENT NAME="assettype" VALUE="Page"/>
</CALLELEMENT>

TextOnlyLink is the element that creates the Plain Text Link. SectionFront passes it the name of the alternate template (ct=SectionFrontText) and the name of the asset type (assettype=Page).

29.3.2 Second Element: TextOnlyLink

The TextOnlyLink element executes. Use Oracle WebCenter Sites Explorer to open and examine it:

ElementCatalog/BurlingtonFinancial/Common/TextOnlyLink

First, TextOnlyLink checks to see whether there is a value for ct.

<IF COND="IsVariable.ct!=true">
<THEN>
<SETVAR NAME="ct" VALUE="Variables.asset:templateText"/>
</THEN>
</IF>

There is a value for ct because the SectionFront element passed in ct=SectionFrontText.

Next, TextOnlyLink uses a RENDER.GETPAGEURL tag to obtain a URL for the Plain Text link, passing in the page name by concatenating one based on the variables that were passed to TextOnlyLink by SectionFront.

<RENDER.GETPAGEURL PAGENAME="BurlingtonFinancial/Variables.assettype/Variables.ct"
cid="Variables.asset:id"
c="Variables.assettype"
p="Variables.p"
OUTSTR="referURL"/>

TextOnlyLink knows that ct=SectionFrontText and that assettype=Page. Therefore BurlingtonFinancial/Variables.assettype/Variables.ct means BurlingtonFinancial/Page/SectionFrontText.

Now that TextOnlyLink has a URL (in the referURL variable specified by the OUTSTR parameter), it can create the Plain Text link with an HTML <A HREF> tag:

<A class="contentlink" HREF="Variables.referURL"
REPLACEALL="Variables.referURL">
<img src="/futuretense_cs/bf/images/TextOnly.gif" width="22"
height="14" border="0" HSPACE="3"/>Plain Text</A><BR/>

Note the use of the REPLACEALL tag as an attribute for this HTML tag. You must use this tag as an HTML attribute when you want to use XML variables in an HTML tag. For more information about REPLACEALL, see the Oracle Fusion Middleware WebCenter Sites Tag Reference.

And then TextOnlyLink clears the ct variable.

<REMOVEVAR NAME="ct"/>

When a visitor clicks the Plain Text link, the article is formatted with the SectionFrontText element and then displayed in the browser.

Note:

If you are interested in the format of the plain text version of a section page, use Oracle WebCenter Sites Explorer to open and examine SectionFrontText:

ElementCatalog/BurlingtonFinancial/Page/SectionFrontText

29.3.3 ColumnistFront

Use Oracle WebCenter Sites Explorer to open and examine the ColumnistFront element:

ElementCatalog/BurlingtonFinancial/Page/ColumnistFront

This element formats the web format page that displays the stories supplied from the Burlington Financial columnists.

To create the Plain Text link in the upper right corner of a section page, ColumnistFront calls TextOnlyLink:

<CALLELEMENT NAME="BurlingtonFinancial/Common/TextOnlyLink">
<ARGUMENT NAME="ct" VALUE="ColumnistFrontText"/>
<ARGUMENT NAME="assettype" VALUE="Page"/>
</CALLELEMENT>

Based on the information passed in from ColumnistFront, this time TextOnlyLink creates a Plain Text link that takes the visitor to BurlingtonFinancial/Page/ColumnistFrontText.

29.4 Example 4: Coding Templates for Query Assets

When you use a query asset to obtain the assets that you want to display, you use the standard WebCenter Sites element name ExecuteQuery to run it.

Burlington Financial uses several query assets. This example describes a query asset named Home Wire Feed which is used to list wire feed stories on the Home page:

Description of g-wirefeedbox.gif follows

Description of the illustration g-wirefeedbox.gif

These are the elements used in this example:

ElementCatalog/BurlingtonFinancial/Page/Home
ElementCatalog/BurlingtonFinancial/Query/WireFeedBox
ElementCatalog/OpenMarket/Xcelerate/AssetType/Query/ExecuteQuery

This section contains the following topics:

Section 29.4.1, "First Element: Home"
Section 29.4.2, "Second Element: WireFeedBox"
Section 29.4.3, "Third Element: ExecuteQuery"
Section 29.4.4, "Back to WireFeedBox"

29.4.1 First Element: Home

Use Oracle WebCenter Sites Explorer to open and examine the template element for the Home page:

ElementCatalog/BurlingtonFinancial/Page/Home

First, Home loads the home page asset, names it HomePage, and then scatters the information in its fields:

<ASSET.LOAD TYPE="Variables.c" OBJECTID="Variables.cid" NAME="HomePage"/>
<ASSET.SCATTER NAME="HomePage" PREFIX="asset"/>

The values for c and cid are passed in from the Burlington Financial URL.

Scroll down past several CALLELEMENT and RENDER.SATELLITEPAGE tags to the following ASSET.CHILDREN tag:

<ASSET.CHILDREN NAME="HomePage" LIST="WireFeedStories"
CODE="WireFeed"/>

Notice that in this line of code, the OBJECTTYPE parameter is not used. CODE=WireFeed is enough information for WebCenter WebCenter Sites to locate and retrieve the query assigned to the Home page asset through the WireFeed association and there is no need to create a join between the AssetRelationTree and the Query table because all that Home needs is the ID of the query. The WireFeed query is retrieved and stored as WireFeedStories.

Next, Home calls the page entry of the WireFeedBox template, passing it the cid of the query stored as WireFeedStories:

<RENDER.SATELLITEPAGE PAGENAME="BurlingtonFinancial/Query/WireFeedBox"
ARGS_cid="WireFeedStories.oid"
ARGS_p=Variables.asset:id/>

Home passes on several pieces of information: the identity of the query with the cid=WireFeedStories.oid statement and the identity of the originating page asset, Home, with the p=Variables.asset:id statement.

29.4.2 Second Element: WireFeedBox

The WireFeedBox page entry invokes its root element, the template element for the WireFeedBox template. Use Oracle WebCenter Sites Explorer to open and examine it:

ElementCatalog/BurlingtonFinancial/Query/WireFeedBox

This element invokes the ExecuteQuery element to run the query and then displays a list of links to the article assets returned by the query.

First, WireFeedBox loads the query asset passed in from Home, names it WireFeedBoxQuery, and then retrieves the values from all of its fields with an ASSET.SCATTER statement:

<ASSET.LOAD TYPE="Variables.c" OBJECTID="Variables.cid" NAME="WireFeedBoxQuery"/>
<ASSET.SCATTER NAME="WireFeedBox" PREFIX="asset"/>

Variables.cid is the WireFeedStories.oid passed in from the Home element.

Then WireFeedBox calls the ExecuteQuery element:

<CALLELEMENT NAME="OpenMarket/Xcelerate/AssetType/Query/ExecuteQuery">
<ARGUMENT NAME="list" VALUE="ArticlesFromWireQuery"/>
<ARGUMENT NAME="assetname" VALUE="WireFeedBoxQuery"/>
<ARGUMENT NAME="ResultLimit" VALUE="8"/>
</CALLELEMENT>

WireFeedBox passed in the query asset, the name of the list to create to hold the results of the query, and a limit of 8 so that no matter how many assets the query returns to ExecuteQuery, ExecuteQuery returns only 8 of them to WireFeedBox.

29.4.3 Third Element: ExecuteQuery

The ExecuteQuery element runs the query asset.

The query assets that can be assigned to a page asset as that page's Wire Feed query are coded to return field data rather than the IDs of assets only. Therefore, ExecuteQuery returns up to eight article assets and the data from several of their fields to WireFeedBox.

Use Oracle WebCenter Sites Explorer to open and examine ElementCatalog/OpenMarket/Xcelerate/AssetType/Query/ExecuteQuery if you are interested in this element. Notice that the first line of code in the element is RENDER.UNKNOWNDEPS because there is no way of knowing which assets will be returned so there is no way to log dependencies for them.

When ExecuteQuery is finished, WireFeedBox resumes.

29.4.4 Back to WireFeedBox

WireFeedBox resumes, looping through the list of articles returned by ExecuteQuery, and obtaining a URL for each one by using a RENDER.GETPAGEURL tag.

Because there is no way of knowing which article assets will be returned by ExecuteQuery, there is a RENDER.FILTER tag included in the loop to filter out unapproved assets when the publishing method is Export to Disk:

<RENDER.FILTER LIST="ArticlesFromWireQuery" LISTVARNAME="ArticlesFromWireQuery" LISTIDCOL="id"/>
<if COND="ArticlesFromWireQuery.#numRows!=0">
<then>
<LOOP LIST="ArticlesFromWireQuery">
<RENDER.GETPAGEURL PAGENAME="BurlingtonFinancial/Article/WireStory"
cid="ArticlesFromWireQuery.id"
c="Article"
p="Variables.p"
OUTSTR="referURL"/>
<A class="wirelink" HREF="Variables.referURL" REPLACEALL="Variables.referURL"><csvar NAME="ArticlesFromWireQuery.subheadline"/></A><P/>
</LOOP>
</then>
</if>

The RENDER.GETPAGEURL tag returns a URL for each article in the list in a variable named referURL. WireFeedBox uses the value from the referURL variable to create links to the articles, using the content from their subheadline fields (which is one of the fields that the Wire Feed query returned) as the hyperlinked text.

29.5 Example 5: Displaying an Article Asset Without a Template

Burlington Financial provides an Email this article to a friend function. Here is the email form for an article:

Description of the illustration g-emailfront.gif

Obviously the Burlington Financial developers do not want the Burlington Financial content providers to assign the email form to an article as the article's Display Style (template). Therefore, there is no Template asset that points to the email element that creates the article email form.

These are the elements used in this example:

ElementCatalog/BurlingtonFinancial/Article/Full
ElementCatalog/BurlingtonFinancial/Article/AltVersionBlock
ElementCatalog/BurlingtonFinancial/Util/EmailFront

This section contains the following topics:

Section 29.5.1, "First Element: Full"
Section 29.5.2, "Second Element: AltVersionBlock"
Section 29.5.3, "Third Element: EmailFront"

29.5.1 First Element: Full

Use Oracle WebCenter Sites Explorer to open and examine the template element for the Full template:

ElementCatalog/BurlingtonFinancial/Article/Full

This element provides the formatting code for articles when they are displayed in full. It displays the following items:

A site banner
The left navigation column
A collection of related stories
The text of the article
A photo for the article
A link that prints the story
A link that emails the story

Scroll down past several RENDER.SATELLITEPAGE and CALLELEMENT tags to the following tag:

<CALLELEMENT NAME="BurlingtonFinancial/Article/AltVersionBlock"/>

29.5.2 Second Element: AltVersionBlock

Use Oracle WebCenter Sites Explorer to open and examine this element:

ElementCatalog/BurlingtonFinancial/Article/AltVersionBlock

AltVersionBlock is a short element with two RENDER.GETPAGEURL tags. The first RENDER.GETPAGEURL tag obtains the URL for the print version of an article. The second RENDER.GETPAGEURL tag obtains the URL for the email version of the story.

Because the Burlington Financial developers want a dynamic URL for the email version of the story even if the site is a static site, the second RENDER.GETPAGEURL tag uses the DYNAMIC parameter.

Scroll down to the second RENDER.GETPAGEURL tag:

<RENDER.GETPAGEURL PAGENAME="BurlingtonFinancial/Util/EmailFront" 
cid="Variables.asset:id" 
c="Article"
DYNAMIC="true"
OUTSTR="referURL"/>

AltVersionBlock passes in the pagename for the EmailFront page entry, and a value for c, and cid, and sets the DYNAMIC parameter to true. The tag creates a dynamic URL for the article (even if the publishing method is Export to Disk) and returns it in a variable named referURL, as specified by the OUTSTR parameter.

29.5.3 Third Element: EmailFront

EmailFront is the pagename that AltVersionBlock passes to the RENDER.GETPAGEURL element. Because there is no corresponding template for EmailFront, WebCenter Sites did not create a page entry in the SiteCatalog for EmailFront by default. The Burlington Financial developers created the SiteCatalog entry for this element manually through Oracle WebCenter Sites Explorer.

Use Oracle WebCenter Sites Explorer to open and examine its root element:

ElementCatalog/BurlingtonFinancial/Util/EmailFront

This element creates a form that displays the first paragraph of the article that the visitor has chosen to email.

First, EmailFront loads the article asset:

<ASSET.LOAD TYPE="Article" OBJECTID="Variables.cid" NAME="EmailFront"/>
<ASSET.SCATTER NAME="EmailFront" PREFIX="asset"/>

Then it formats several parts of the page before creating the email form. Scroll down to the HTML FORM tag:

<FORM NAME="mailform" onSubmit="return checkEmail();" METHOD="POST" ACTION=...

EmailFront then calls the LeadSummary page entry to display a summary of the article in the form:

<RENDER.SATELLITEPAGE 
ARGS_pagename="BurlingtonFinancial/Article/LeadSummary" 
ARGS_cid="Variables.cid"
ARGS_ct="Full"
ARGS_p="Variables.p"/>

For information about the LeadSummary element, see Section 29.1, "Example 1: Basic Modular Design" or use Oracle WebCenter Sites Explorer to open and examine it.

29.6 Example 6: Displaying Site Plan Information

Because the developers of the Burlington Financial sample site used the Site Plan tab in the WebCenter Sites interface to order the basic structure of the Burlington Financial site, they are able to extract information from the SitePlanTree table to create navigational features for the site.

For example, the navigation bar at the top of the Burlington Financial home page is created by extracting information about the site's structure from the SitePlanTree table.

Description of the illustration g-sitebar.gif

To extract information from the SitePlanTree table, you use the WebCenter Sites SITEPLAN tag family.

These are the elements used in this example:

ElementCatalog/BurlingtonFinancial/Article/Home
ElementCatalog/Pagelet/Common/SiteBanner
ElementCatalog/BurlingtonFinancial/Site/TopSiteBar

This section contains the following topics:

Section 29.6.1, "First Element: Home"
Section 29.6.2, "Second Element: SiteBanner"
Section 29.6.3, "Third Element: TopSiteBar"
Section 29.6.4, "Back to SiteBanner"

29.6.1 First Element: Home

Use Oracle WebCenter Sites Explorer to open and examine the template element for the Home template:

ElementCatalog/BurlingtonFinancial/Page/Home

Scroll down to the first RENDER.SATELLITEPAGE tag:

<RENDER.SATELLITEPAGE PAGENAME="BurlingtonFinancial/Pagelet/Common/SiteBanner"/>

29.6.2 Second Element: SiteBanner

The SiteBanner pagelet invokes its root element. Use Oracle WebCenter Sites Explorer to open and examine it:

ElementCatalog/BurlingtonFinancial/Common/SiteBanner

SiteBanner gathers the images for the banner (the Burlington Financial logo and an advertising image) and then calls an element that creates the navigational links to the main sections of the site.

Scroll down to this CALLELEMENT tag:

<CALLELEMENT NAME="BurlingtonFinancial/Site/TopSiteBar"/>

29.6.3 Third Element: TopSiteBar

TopSiteBar executes, creating the navigational links to the main sections in the site. Use Oracle WebCenter Sites Explorer to open and examine TopSiteBar:

ElementCatalog/BurlingtonFinancial/Site/TopSiteBar

29.6.3.1 Creating the Link for the Home Page

First, TopSiteBar loads the Home page, names it target, gets the value from its ID field, and stores that value in the output variable pageid:

<ASSET.LOAD TYPE="Page" NAME="target" FIELD="name" VALUE="Home" DEPTYPE="exists"/>
<ASSET.GET NAME="target" FIELD="id" OUTPUT="pageid"/>

Note that the ASSET.LOAD tag changes the dependency type from its default of exact to exists with the DEPTYPE parameter. For a link like this one, a link in a navigational bar, it makes more sense for the dependency to be an exists dependency.

Then TopSiteBar uses the variable pageid to obtain a URL for the Home page from a RENDER.GETPAGEURL tag:

<RENDER.GETPAGEURL PAGENAME="BurlingtonFinancial/Page/Home"
cid="Variables.pageid"
c="Page"
OUTSTR="referURL"/

Next TopSiteBar extracts the page asset's name from its Name field and uses it as the text for the hyperlink:

<ASSET.GET NAME="target" FIELD="name" OUTPUT="thepagename"/>
<A class="sectionlinks" HREF="Variables.referURL" REPLACEALL="Variables.referURL"><csvar NAME="Variables.thepagename"/></A>

29.6.3.2 Creating the Links to the Home Page's Child Pages

In the next part of the code, TopSiteBar creates links for the child pages of the Home page. In order to determine the child pages of the Home page, it must first determine the node ID of the Home page.

The node ID of a page asset is different from its object ID:

You use an object ID to extract information about an asset from asset tables.
You use a node ID to extract information about a page asset from the SitePlanTree table.

First, TopSiteBar determines the node ID of the Home page:

<ASSET.GETSITENODE NAME="target" OUTPUT="PageNodeId"/>

Then it uses that information to load the Home page as a siteplan node object:

<SITEPLAN.LOAD NAME="ParentNode" NODEID="Variables.PageNodeId"/>

With the Home page node identified and loaded, TopSiteBar can then obtain the Home page's child nodes, storing them in a list that it names PeerPages, and ordering them according to their rank:

<SITEPLAN.CHILDREN NAME="ParentNode" TYPE="PAGE" LIST="PeerPages" CODE="Placed" ORDER="nrank"/>

And now TopSiteBar loops through all the child nodes at the first level, using the RENDER.GETPAGEURL tag to create a URL for the link to each page:

<IF COND="IsList.PeerPages=true">
<THEN>
<LOOP LIST="PeerPages">&nbsp;|&nbsp;
<ASSET.LOAD NAME="ThePage" TYPE="Page"
 OBJECTID="PeerPages.oid"/>
<ASSET.GET NAME="ThePage" FIELD="name" 
OUTPUT="thepagename"/>
<ASSET.GET NAME="ThePage" FIELD="template"
OUTPUT="pagetemplate"/>
<RENDER.GETPAGEURL PAGENAME="BurlingtonFinancial/Page/
Variables.pagetemplate"
cid="PeerPages.oid"
c="Page"
OUTSTR="referURL"/>
<A class="sectionlinks" HREF="Variables.referURL"
REPLACEALL="Variables.referURL">
<csvar NAME="Variables.thepagename"/>
</A>

Notice how the page name is constructed in this example. The second ASSET.GET statement in the preceding piece of code obtains the name of the page's template from its template field. Here it is again:

<ASSET.GET NAME="ThePage" FIELD="template"
OUTPUT="pagetemplate"/>

Then, that information is used in the PAGENAME parameter passed to the RENDER.GETPAGEURL tag:

PAGENAME="BurlingtonFinancial/Page/Variables.pagetemplate"/>

Therefore, if the template for the page asset is SectionFront, this argument statement passes pagename=BurlingtonFinancial/Page/SectionFront. And if the template for the page asset is AboutUs, this argument statement passes pagename=BurlingtonFinancial/Page/AboutUs.

29.6.4 Back to SiteBanner

SiteBanner is finished after the call to TopSiteBar. The SiteBanner element is invoked on each page in the site.

Because SiteBanner has a page entry in the SiteCatalog table, the results of the navigational bar that TopSiteBar creates is cached the first time a visitor requests a page on the Burlington Financial site. This speeds up performance because the site does not have to re-invoke the TopSiteBar element for each and every page that the visitor subsequently visits.

29.7 Example 7: Displaying Non-Asset Information

Sometimes you need to render and display information that is not stored as an asset in the WebCenter Sites database. For example, the Burlington Financial site displays today's date on each page. The date is not information that can be stored as an asset.

These are the elements used in this example:

ElementCatalog/BurlingtonFinancial/Article/Home
ElementCatalog/Common/ShowMainDate

This section contains the following topics:

Section 29.7.1, "First Element: Home"
Section 29.7.2, "Second Element: ShowMainDate"

29.7.1 First Element: Home

Use Oracle WebCenter Sites Explorer to open and examine the template element for the Home template:

ElementCatalog/BurlingtonFinancial/Page/Home

Scroll down to the third CALLELEMENT tag, one that invokes the ShowMainDate element.

<CALLELEMENT NAME=BurlingtonFinancial/Common/ShowMainDate/>

29.7.2 Second Element: ShowMainDate

ShowMainDate executes. Use Oracle WebCenter Sites Explorer to open and examine it:

ElementCatalog/BurlingtonFinancial/Common/ShowMainDate

The main line of code is this one:

<span class="dateline"><csvar NAME="CS.Day CS.Mon CS.DDate, CS.Year"/></span>

It calculates the date and then returns that value to the Home element, which displays it at the top of the page, under the navigation bar and over the main list of stories.

This element performs a simple calculation and then outputs the value into the HTML code that is rendered in the browser window. There are no content assets that it formats or Template assets that use it as a root element. It also has no SiteCatalog entry because its result (the date) should be calculated each time the Home page is rendered.