Creating the Initial PCF

Size: px

Start display at page:

Download "Creating the Initial PCF"

Lynne Susan McCoy
5 years ago
Views:

Overview When creating new page templates, it is very common to begin creation from an HTML page. The HTML page contains the full structure of the content, as well as the data.

1 Overview When creating new page templates, it is very common to begin creation from an HTML page. The HTML page contains the full structure of the content, as well as the data. Deconstructing the HTML page helps to determine which data is to be in the PCF and what elements need to be part of the XSL. After the initial dissection of the files, creation of the XSL, and verification that all necessary components of the PCF exist in the file, the PCF can be converted to a TMPL. To begin creating the PCF and ultimately the TMPL, start with an HTML example page. The code rendering this page as HTML looks like this: Page 1 of 11

2 <html lang="en" xmlns=" <head> <meta name="generator" content= "HTML Tidy for Linux/x86 (vers 25 March 2009), see /> <meta http-equiv="content-type" content="text/html; charset=us-ascii" / > <meta charset="utf-8" /> <meta name="viewport" content="width=device-width; initial-scale=1.0" / > <meta name="description" content="" /> <title>gallena University - Creating a New Page</title> <link rel="stylesheet" type="text/css" media="screen" href= "/_resources/css/main.css" /> <link rel="stylesheet" type="text/css" media="screen" href= "/_resources/css/nivo-slider.css" /> <link rel="stylesheet" type="text/css" media="screen" href= "/_resources/css/prettyphoto.css" />  <script type="text/javascript" src= " <script type="text/javascript" src="/_resources/js/ jquery.nivo.slider.pack.js"> <script type="text/javascript" src="/_resources/js/ jquery.infieldlabel.min.js"> <script type="text/javascript" src="/_resources/js/jquery.scrollto.js"> <script type="text/javascript" src="/_resources/js/ jquery.prettyphoto.js"> <script type="text/javascript" src="/_resources/js/scripts.js"> <script type="text/javascript"> //<![CDATA[var page_id=" //]]> <!--[if IE 6]> <script type="text/javascript" src="js/ie6-hover-fix.js"> <script type="text/javascript" src="js/dd_belatedpng_0.0.8a-min.js"></ Page 2 of 11 script>

3 Parsing the File to Create XSL and PCF The head code, as well as the <div> structure and supporting HTML is pulled into the XSL used to style the page. Additionally, the include statements for included elements are referenced from within the XSL. For the purposes of this tutorial, assume the XSL has already been created from the parsed HTML document. Creating Initial HTML File The first step is creating a PCF with editable content areas. In the case of the above referenced example, this results in an HTML with the following initial structure: <h2 class="h-color-link">creating a New Page</h2> <p><img class="c1" src="/_resources/images/about/gulibrary.jpg" alt="student" width="150" height="127" />Six started far placing saw respect females old. Civilly why how end viewing attempt related enquire visitor. Man particular insensible celebrated conviction stimulated principles day. Sure fail or in said west. Right my front it wound cause fully am sorry if. She jointure goodness interest debating did outweigh. Is time from them full my gone in went. Of no introduced am literature excellence mr stimulated contrasted increasing. Age sold some full like rich new. Amounted repeated as believed in confined juvenile.</p> <p><img class="c2" src="/_resources/images/about/trade%20show.jpg" alt="show" width="150" height="113" />Suppose end get boy warrant general natural. Delightful met sufficient projection ask. Decisively everything principles if preference do impression of. Preserved oh so difficult repulsive on in household. In what do miss time be. Valley as be appear cannot so by. Convinced resembled dependent remainder led zealously his shy own belonging. Always length letter adieus add number moment she. Promise few compass six several old offices removal parties fat. Concluded rapturous it intention perfectly daughters is as.</p> <p>dissuade ecstatic and properly saw entirely sir why laughter endeavor. In on my jointure horrible margaret suitable he followed speedily. Indeed vanity excuse or mr lovers of on. By offer scale an stuff. Blush be sorry no sight. Sang lose of hour then he left find.</p> Starting with an HTML file extension, which will be converted to a PCF, the data included will be displayed with no styling in both preview and edit. Page 3 of 11

Preview Edit Converting the HTML File to a PCF In order to convert the file to a PCF, the file needs to be updated to be formatted in proper XML structure.

It also needs the pcf-stylesheet declaration, which declares which XSL is to be used for the transformation of the file to a styled page.

4 Preview Edit Converting the HTML File to a PCF In order to convert the file to a PCF, the file needs to be updated to be formatted in proper XML structure. This includes adding an XML declaration, defining the DOCTYPE, and adding a root node. It also needs the pcf-stylesheet declaration, which declares which XSL is to be used for the transformation of the file to a styled page. Use the Source Code Editor to make the changes. Note: For the purposes of this tutorial, it is valuable to understand the XSL that will be called is looking for a _leftnav.inc file and _properties.inc file. These need to be added to the directory prior to attempting to render the PCF in order to avoid an error. Page 4 of 11

Add the following to the HTML file in the order described: 1. The XML declaration identifies the version of XML to be used, as well as declares the encoding used on the page.

5 Add the following to the HTML file in the order described: 1. The XML declaration identifies the version of XML to be used, as well as declares the encoding used on the page. For these purposes, XML version 1.0 is used, along with UTF-8 encoding. <?xml version="1.0" encoding="utf-8"?> 2. The pcf-stylesheet declaration identifies the path to the XSL that is used to transform the data, and the extension that is appended in place of.pcf on publish. It may also include a separate site identifier if the XSL is in a different site, along with other attributes described below. It is possible to have multiple pcf-stylesheet declarations if multiple outputs are desired. For instance, if the published page should be published as an HTML file and a PDF, two pcfstylesheet declarations will be included. See an example of this after the page example in this section. <?pcf-stylesheet path="/_resources/xsl/default.xsl" extension="html" title="web"?> Attribute Name Syntax Message Description path path="/_resources/xsl/ default.xsl" Required. Defines the path to the XSL file that will be used to transform the page. extension extension="html" Required. Defines the extension that is used to replace.pcf on publish. site site="templates" Defines an alternative site where the XSL file that was defined as part of the path resides. title tite="web" Defines a friendly name, which will appear in place of the extension on the tabs shown in the preview. alternate alternate="yes" Used when there is more than one PCF-Stylesheet declaration to identify the Page 5 of 11

6 Attribute Name Syntax Message Description file as a secondary output type in order to create a preview based on the alternative output. params params="varname=string" Passes an <xsl:param> value to a top-level parameter by identifying the parameter with the same name and providing the value. publish publish="no" Prevents the defined stylesheet from publishing. This is useful for stylesheets that should only create a preview, such as a debug XSL for developers. 3. The DOCTYPE declares the root node of the document and it defines the document structure with a list of legal elements, attributes, and entities. These can be included within the DOCTYPE definition or referenced as an external document. For these purposes, an external document is referenced. <!DOCTYPE document SYSTEM " 4. The root node is the first tag of the file, as well as the final closing tag. All data and other nodes must be properly encased within this root node. This example uses <document> for the root node. In this case, the XSL being referenced is looking for /document/content in order to pull in the page s data. This path is called an XPath. To create the page templates, knowing these XPaths and following the same node structure is necessary to view content on the page. If the page were saved without a node of <content> having been added, on preview, no content would display. To avoid this, add <content> immediately following <document>, and add </content> immediately preceding </document>. After the changes are made, the file should be saved with a PCF extension in place of the HTML extension. Before After Page 6 of 11

7 Example PCF Page 7 of 11

8 <?xml version="1.0" encoding="utf-8"?> <?pcf-stylesheet path="/_resources/xsl/default.xsl" extension="html" title="web"?> <!DOCTYPE document SYSTEM " standard.dtd"> <document> <content> <h2 class="h-color-link">creating a New Page</h2> <p><img class="c1" src="/_resources/images/about/ gulibrary.jpg" alt="student" width="150" height="127" />Six started far placing saw respect females old. Civilly why how end viewing attempt related enquire visitor. Man particular insensible celebrated conviction stimulated principles day. Sure fail or in said west. Right my front it wound cause fully am sorry if. She jointure goodness interest debating did outweigh. Is time from them full my gone in went. Of no introduced am literature excellence mr stimulated contrasted increasing. Age sold some full like rich new. Amounted repeated as believed in confined juvenile.</ p> <p><img class="c2" src="/_resources/images/about/trade %20show.jpg" alt="show" width="150" height="113" />Suppose end get boy warrant general natural. Delightful met sufficient projection ask. Decisively everything principles if preference do impression of. Preserved oh so difficult repulsive on in household. In what do miss time be. Valley as be appear cannot so by. Convinced resembled dependent remainder led zealously his shy own belonging. Always length letter adieus add number moment she. Promise few compass six several old offices removal parties fat. Concluded rapturous it intention perfectly daughters is as.</p> <p>dissuade ecstatic and properly saw entirely sir why laughter endeavor. In on my jointure horrible margaret suitable he followed speedily. Indeed vanity excuse or mr lovers of on. By offer scale an stuff. Blush be sorry no sight. Sang lose of hour then he left find.</p> </content> </document> Page 8 of 11

Preview Example Using Multiple PCF-Stylesheet Declarations If multiple outputs are desired, multiple pcf-stylesheet declarations are needed.

9 Preview Example Using Multiple PCF-Stylesheet Declarations If multiple outputs are desired, multiple pcf-stylesheet declarations are needed. The rest of the PCF appears just the same, but a different XSL is used to transform the second output. When defining the additional declarations, it is valuable to include the title and alternate="yes" attributes. Having the additional declarations defined as alternate allows multiple previews to be rendered. Page 9 of 11

10 Example Code <?xml version="1.0" encoding="utf-8"?> <?pcf-stylesheet path="/_resources/xsl/default.xsl" extension="html" title="web"?> <?pcf-stylesheet path="/_resources/xsl/page2pdf.xsl" extension="pdf" title="pdf" alternate="yes"?> <!DOCTYPE document SYSTEM " standard.dtd"> <document> <content> <h2 class="h-color-link">creating a New Page</h2> <p><img class="c1" src="/_resources/images/about/ gulibrary.jpg" alt="student" width="150" height="127" />Six started far placing saw respect females old. Civilly why how end viewing attempt related enquire visitor. Man particular insensible celebrated conviction stimulated principles day. Sure fail or in said west. Right my front it wound cause fully am sorry if. She jointure goodness interest debating did outweigh. Is time from them full my gone in went. Of no introduced am literature excellence mr stimulated contrasted increasing. Age sold some full like rich new. Amounted repeated as believed in confined juvenile.</ p> <p><img class="c2" src="/_resources/images/about/trade %20show.jpg" alt="show" width="150" height="113" />Suppose end get boy warrant general natural. Delightful met sufficient projection ask. Decisively everything principles if preference do impression of. Preserved oh so difficult repulsive on in household. In what do miss time be. Valley as be appear cannot so by. Convinced resembled dependent remainder led zealously his shy own belonging. Always length letter adieus add number moment she. Promise few compass six several old offices removal parties fat. Concluded rapturous it intention perfectly daughters is as.</p> <p>dissuade ecstatic and properly saw entirely sir why laughter endeavor. In on my jointure horrible margaret suitable he followed speedily. Indeed vanity excuse or mr lovers of on. By offer scale an stuff. Blush be sorry no sight. Sang lose of hour then he left find.</p> </content> </document> Page 10 of 11

11 Example of Web Output Example of PDF Output Page 11 of 11

Understanding Page Template Components. Brandon Scheirman Instructional Designer, OmniUpdate

Understanding Page Template Components Brandon Scheirman Instructional Designer, OmniUpdate Where do PCFs come from??.pcf .PCF Agenda Implementation Process Terminology used in Template Development Hands-on