Template Page Tags

Page tagging adds Modern Campus CMS-specific nodes to the source code of a PCF or template (TMPL) file so the system can identify editable content on a page. There are three ways to edit a PCF page.

1. Editable Region:
   
2. Page Parameters:
   
3. MultiEdit:
   

Editable RegionsLink to this section

An editable region is a block of code on a PCF page, such as a <div> or <section> , that uses a What You See Is What You Get (WYSIWYG) editor to edit page content. Editable regions are most commonly used for the main body content of the page.

Creating editable regions on a PCF requires the appropriate code in the PCF file itself to identify the region, as well as appropriate code in the page's XSL file to identify and display that region's content. There is no limit to how many editable regions appear on a PCF page.

PCF Code

Generate an editable region by placing an <ouc:div> node inside a PCF page's code with an <ouc:editor> node inside of it.

The <ouc:div> node maps out the space in the page's structure where the content will be injected and indicates to open a WYSIWYG editor. The node also specifies a unique label for the region, the group who will have access to edit the region, and the text that appears on the editable region button.

The <ouc:editor> node specifies the location of additional CSS to be applied inside the WYSIWYG editor and the location of custom styles that can be applied to the content.

The following is an example of the PCF code for an editable region:

<ouc:div label="main-content" group="Everyone" button-text="Edit"> <ouc:editor csspath="/_resources/ou/editor/wysiwyg.css" cssmenu="/_resources/ou/editor/styles.txt" wysiwyg-class="maincontent" /> </ouc:div>

Extensible Stylesheet Language (XSL) Code

Modern Campus CMS requires XSL to identify and display a region's content. XSL renders the page's unique content into the final HTML format. Without the XSL, editable regions don't appear on the page because they aren't built into the HTML for rendering.

Use an <xsl:apply-templates> node to seek out editable region code on PCF pages. For example:

<xsl:apply-templates select="ouc:div[@label='main-content']" />

Page ParametersLink to this section

Use page parameters to limit the styling options available to a content editor. When you set a parameter, content editors are prompted with a form and restricted to the fields you created. The content and settings entered into these fields are then injected into the page using XSL.

PCF Code

Generate page parameters by placing a<ouc:properties>node inside a PCF page's code with a<parameter>node inside of it. Multiple page parameters can be added within the same<ouc:properties>node, each defined by their own<parameter>node.

The<ouc:properties>node specifies a unique name for the included group of page parameters, the group who will have access to edit the parameter, and the text that appears in the parameters section of a PCF.

In the<parameter>node, use thetypeattribute to specify the type of form field for this page parameter. There are ten types of form fields available, each with their own set of attributes.

The following is an example of the PCF code for a text-type page parameter.

<ouc:properties label="config"> <parameter name="page-heading" group="Everyone" type="text" prompt="Page Heading" alt="Please enter the page heading">Page Heading</parameter> </ouc:properties>

XSL Code

Modern Campus CMS requires XSL to identify and display a page parameter's content. XSL renders the page parameter's content and/or value into the final HTML format. Without the XSL, page parameter content doesn't appear on the page because it isn't built into the HTML for rendering.

Use the custom XSL function ou:pcf-param, built into most implementations, to call the value of a page parameter. The following is an example of XSL code for a page parameter controlling the page heading:

<h1 id="page-heading"> <xsl:value-of select="ou:pcf-param('heading')"/> </h1>

MultiEditLink to this section

Use MultiEdit to limit the styling options available to a content editor. When you enable MultiEdit on a page, content editors are prompted with a form and restricted to the fields you created. The input entered into these fields is then injected into the page using XSL.

PCF Code

Generate MultiEdit by placing an <ouc:div> node inside a PCF page's code with a <ouc:multiedit> node inside of it.

The <ouc:div> node specifies a unique label for the region and the group who will have access to edit the region. Set the button text equal to hide when the <ouc:div> wraps an <ouc:multiedit> node.

In the <ouc:multiedit> node, use the type attribute to specify the type of MultiEdit form field. There are twelve types of form fields available, each with their own set of attributes.

The following is an example of the PCF code for a text-type MultiEdit field:

<ouc:div label="name" group="Everyone" button="hide"> <ouc:multiedit type="text" prompt="Student Name" alt="Enter the student's name."/> </ouc:div>

XSL Code

Modern Campus CMS requires XSL to identify and display a MultiEdit field's content. XSL renders the MultiEdit field's content and/or value into the final HTML format. Without the XSL, MultiEdit content doesn't appear on the page because it isn't built into the HTML for rendering.

Use an <xsl:apply-templates> node or an <xsl:value-of> node to seek out MultiEdit code on PCF pages. For example:

<h3> <xsl:value-of select="ouc:div[@label='name']" /> </h3>