Section Page Templates
Here is the temp-dev
publication's only section
page template, group/news.jsp
:
<%@ page language="java" pageEncoding="UTF-8" contentType="text/html; charset=UTF-8" %> <%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %> <div class="news"> <div class="header"> <c:if test="${not empty pool.rootElement.areas.header.items[0]}"> <div style="${pool.rootElement.areas.header.items[0].options.border}"> <c:set var="element" value="${pool.rootElement.areas.header.items[0]}" scope="request"/> <jsp:include page="ats.jsp"/> </div> </c:if> </div> <div class="center"> <c:forEach items="${pool.rootElement.areas.center.items}" var="item"> <c:set var="element" value="${item}" scope="request"/> <c:choose> <c:when test="${item.type eq 'two-col'}"> <jsp:include page="twoCol.jsp"/> </c:when> <c:when test="${item.type eq 'three-col'}"> <jsp:include page="threeCol.jsp"/> </c:when> <c:otherwise> <jsp:include page="ats.jsp"/> </c:otherwise> </c:choose> </c:forEach> </div> <div class="right"> <ul> <c:forEach items="${pool.rootElement.areas.rightcolumn.items}" var="item"> <li><a href="${item.content.url}">${item.fields.TITLE}</a></li> </c:forEach> </ul> </div> </div>
In order to fully understand this template you need to understand
the section page structure it is operating on. This structure is defined
in the publication's layout-group
resource (and
reflected in the section page editor displayed in Content Studio). For more
about the layout-group
resource, see layout-group.
The section page structure defined in the
layout-group
resource consists of three main areas:
header
, center
and
rightcolumn
. header
is intended as
a headline area to highlight the main story, center
is the main area in which a number of different summaries are displayed,
while rightcolumn
is for lower priority stories,
displayed as a simple list of links.
The code for the header
area:
-
Checks that the area contains an item.
-
If it does, makes an HTML
div
to format the item and then creates a request scope variable calledelement
that references the item. (For more detailed information about thediv
element'sstyle
attribute, see Area and Group Options.) -
Passes control to
article/ats.jsp
(article type selector). This template calls a new template that depends on the content of theelement
variable'sarticle
.articleTypeName
property:<jsp:include page="../element/${element.article.articleTypeName}.jsp"/>
The definition of the center
area in the
layout-group
resource includes references to two
groups
called two-col
(which is
defined as containing two sub areas, left
and
right
) and three-col
(which is
defined as containing three sub areas, left
center
and right
). What this means
is that the Content Studio user can choose to insert two-column and
three-column sub-areas into the center area instead of (or as well as)
content items. The code for the center area therefore has to be able to
deal with these variations.
The code for the center
area therefore uses a
forEach
element to cycle through all the area's
items, find out whether it is a content item or a group, and take
appropriate action. Note that the variable created for each item has
request scope and has the same name (element
) as the
variable created in the header
area code. For content
items, control is passed to the same article type selector as in the
header
area code.
The code for the rightcolumn
area simply cycles
through all the area's items and creates a link to each content
item.