Written by The Jahia Team
   Estimated reading time:

Rendering Explained

A node is rendered based on its assigned View(s). Jahia views are contructed as Java Server Pages (JSP) scripts that render the node's content.

If, for example, a default view is defined for jnt:news, it will be generated in /jnt_news/html/news.jsp.

In this path, /jnt_news corresponds to the rendering folder, /html to the output format, and news.jsp to the content type default view script filename.

By default, scripts provided by Jahia are written as JSPs leveraging Jahia and JSP Standard Library (JSTL) TagLibs.  

However, it is possible to use other scripting languages covered by the JSR283 standard, such as Velocity, Freemarker, and Groovy.

Note that each nodetype may be associated with one or several views:

  • The default view is called "[type].jsp". E.g.  jnt:news has the default view news.jsp.
  • Additional views are named using the convention: “[type].[key].jsp”, where [key] corresponds to the name given to the alternative view. If, for example,  a "details" view is created for jnt:news, it is named: news.details.jsp.

Different views can have different purposes:

  • Run custom logic
  • Render property values in different configurations
  • Enable different output formats such as: HTML,  CSV,  and RSS

Accessing Properties

In order to display the properties of a node, a reference is used. Jahia exposes this reference in the view scope with the currentNode variable.

Displaying the properties of a node in a view is done with one of the following methods. Note that "propertyName" applies to the currentNode context of the view.:

  • Using an EL expression:
${currentNode.properties.propertyName.format}

or

${currentNode.properties['propertyName'].format}
  • Jahia TagLibs are used for displaying a property value or storing it in a variable:
<%@ taglib prefix="jcr" uri="http://www.jahia.org/tags/jcr" %> 
<jcr:nodeProperty node="${currentNode}" name="propertyName" var="varName"/>
${varName.format}

Displaying Properties

Output Formats

Note the follwing list of available output format for displaying properties in a View:

Text:

${currentNode.properties.textProperty.string}

Integer:

${currentNode.properties.integerProperty.long}

Decimal:    

${currentNode.properties.decimalProperty.double}

Boolean:    

${currentNode.properties.booleanProperty.boolean}

Date

${currentNode.properties.dateProperty.time}

In the case of a date property, the default output format can be changed. The fmt:formatDate function provides more comprehensive date formatting:

<fmt:formatDate pattern=”MM/dd/yyyy"value="${currentNode.properties.dateProperty.time}" />

Weak Reference

${currentNode.properties.referencePropertyName.node}

This enables the referencing of a different node. This is useful when properties for different nodes needs to be rendered in a single view.

ChoiceList

Properties loaded directly from Choicelist Properties remain raw values.

The jcr:nodePropertyRenderer tag is used to perform an operation on a property before displaying it.  This tag is often used on choicelists to render values appropriately:

<%@ taglib prefix="jcr" uri="http://www.jahia.org/tags/jcr" %>
<jcr:nodePropertyRenderer node="${currentNode}" 
		name="propertyName" renderer="rendererName"/>

Examples of renderers:

  • ResourceBundle
    [jnt:myComponent] > jnt:content, jmix:structuredContent
        - myField(string, choicelist[resourceBundle]) = 'val1' < 'val1', 'val2'
    
    
    <jcr:nodePropertyRenderer node="${currentNode}" name=”myField" renderer="resourceBundle"/>
  • Country
    [jnt:myComponent] > jnt:content, jmix:structuredContent
        - nationality(string, choicelist[country])
    
    
    <jcr:nodePropertyRenderer node="${currentNode}" name=”nationality" renderer=”country"/>

Example: Default Component View

  1. The list of of Content Types under definitions.cnd is expanded.
  2. Content Type is right-clicked and "Add view mynt:myComponent" is selected, as shown below:
    create-new-view.png
  3. In the Jahia Studio view editor window, the following line is added to the file for displaying the component property title :
    <h2>${currentNode.properties.title.string}</h2>
  4. The following is generated in Jahia Studio:
    create-new-view-basic-comp-example.png
  5. The "Save" button is clicked and the output type for the view is set to html:
    save-default-view.png
  6. The view name is left unaltered as it is first and default for myComponent. Note that for additional views, a custom name would be used.
  7. Once the view is saved, the former error “No render set for node of type mynt:myComponent” is replaced with the rendering result of the newly created view:
    title-view-result.png

Exercise: Create a View

Refer to the previous example for reference.

  1. Create a default view for the Employee component.
  2. Add lines to the View for displaying each the Employee's properties.
  3. Verify, in Edit mode, that the view correctly displayd all the Employee's properties on the webpage.