Content Management System

Copyright © 2005 Liferay, LLC

All Rights Reserved.No material may be reproduced electronically or in print without written

permission from Liferay, LLC.

Content Management System

Structure – An XML definition of the dynamic parts of the article/content. These parts may be text, a text box, a text Area (HTML), an image, a boolean flag ( true or false), a selection list, or a multiple selection list.

Template – An XSL Transformation (or VM) of the XML structure; it defines the layout of the article. Templates are typically attached to structures.

Article – The actual content of the web page is placed here ( e.g. the Liferay home page article, http://www.liferay.com ). An article is attached to a structure and a template.

Outline

1. Adding a structure and a template

2. Adding an article

3. Article “lifecycle”a. Structure and Template (typically done by webmaster)

b. Written (typically done by writer)

c. Edited and Approved (typically done by editor)

d. Displayed in journal content (typically done by webmaster)

Structure

The Structure is the XML definition of the dynamic content on a page and is amorphous (it is given a layout by the template).

A Structure can contain any number of the following elements:

text boolean

text box selection list

text area multiple selection list

image

Structure

text areaLiferay is the industry leader for open source solutions. Companies of all sizes and industries are turning to open source solutions for reliable and cost-effective measures to increase performance, reliability, and flexibility. Liferay stands at the forefront of OSS technology and is a trusted source for companies worldwide. Our unique and cost-effective solutions have garnered us the attention of the industry as being a cutting-edge company that enterprises can depend on…

image

text (title)Enterprise, Open Source, For Life.

Adding a StructureIn the Journal portlet :(If the portlet is not included, click on add content , CMS, and include

the Journal portlet. )

1. Click on “Structures”2. Click on “Add”3. Add the following information:

Structure Id: A-SAMPLE-STRUCTUREName: A-SAMPLE-STRUCTUREDescription: A-SAMPLE-STRUCTURE

4. Click “Add Row”5. Type in “main-text” for the name and select “Text Area” for the

type

6. Click on “Update” in the pop up window7. Click on Save to save the structure

Adding a TemplateIn the Journal portlet :

1. Click on “Templates”

2. Click on the “Add” button

3. Press Select next to Structure

4. Search for “A-SAMPLE-STRUCTURE” and click the corresponding id

5. Add the following information:Template Id: A-SAMPLE-TEMPLATEName: A-SAMPLE-TEMPLATEDescription: A-SAMPLE-TEMPLATE

Adding a Template ( Continued )

6. Click on the “Launch Editor” button

7. Replace the pop up window information with the following:

<?xml version="1.0"?><xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform" version="1.0"><xsl:output method="html" omit-xml-declaration="yes"/> <xsl:template match="/" > <xsl:value-of disable-output-escaping="yes" select="root/dynamic-

element[@name='main-text']/dynamic-content"/> </xsl:template></xsl:stylesheet>

Note: Notice how the name is ‘main-text’, which matches the name of the xml dynamic content

8. Click on the Update button in the popup window

9. Click the “Save” button to save the template

XSLT Example Overview <?xml version="1.0"?><xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform" version="1.0"><xsl:output method="html" omit-xml-declaration="yes"/> <xsl:template match="/"> <xsl:value-of disable-output-escaping="yes" select="root/dynamic-

element[@name='main-text']/dynamic-content"/> </xsl:template></xsl:stylesheet>

<xsl:stylesheet> - declares the XSL stylesheet<xsl:import> - imports the contents from one stylesheet to another<xsl:output> - defines the format of the output document, in this case, an html

document<xsl:template> - contains rules to apply to a specific node<xsl:value-of> - extracts the value of the XML element and displays it to the output

* http://www.w3schools.com/xsl

Adding an ArticleIn the Journal portlet :

1. Click on “Articles”2. Click on the “Add” button3. Click select next to structure4. Search for “A-SAMPLE-STRUCTURE” and click the corresponding “Choose

Structure” button

5. Add the following information:Article Id: A-SAMPLE-ARTICLEArticle Title: A-SAMPLE-ARTICLEContent: A-SAMPLE-ARTICLEMain Text: A-SAMPLE-ARTICLE!

6. Click the “Preview” button to preview the article7. Click the “Save” button to save the article

OR

7. Click the “Save and Approve” button to also approve the articleNow your new article, “A-SAMPLE-ARTICLE” can be selected to be displayed. Normally, only the Administrator will have permission to approve articles.

Approving an Article

• Articles must be approved before they can be published into a Journal Content Portlet.

• The current test user (test@liferay.com) has full permissions to add new articles and approve them, but these permissions are usually given to different users (ie: writer and editor).

• A user can edits the article an increment the version for this article. However, only approved versions can be selected to be published in Journal Content Portlets.

Journal Content Portlets

• Journal Portlet – used to administer (create, edit, approve, etc) Articles, Structures and Templates.

• Journal Content Portlet – used to display articles. These can be thought of as containers for Journal Articles.

• To have your Journal Article displayed on a page, you will need to add a Journal Content Portlet and click on the “Select Article” icon inside the portlet to select which article you want to display.

Viewing your Article

1. Go to the “CMS (Private)” community

2. Click on Add Content and select “Journal Content” from the cms section, click the “Add” button next to it

3. Now in the Journal Content portlet, click the “Select Article” button

4. A listing of Journal Articles should be displayed under Article ID

5. Select your article (If you cant locate your article, go back to the Journal portlet and check to make sure that your article has been approved). It should be added to the “Displaying Article Pages” list on the top of the page and click the “Save” button. If your template has correct syntax, A “You have successfully updated the setup.” message should be displayed at the top.

6. Click on the CMS navigation link and your article will be displayed in the Journal Content Portlet.

Exercise 1 – XSLT

• Create your own structure, template and article using a XSLT template

1. Create a new Structure called “aaa-image-image-text”Two Image rows called “image1” and “image2”Text Area row called “body”

2. Create a new Template called “aaa-training-xsl”Use XSLT Script (“trainingtemplate.xsl”)

3. Create a new Article called “aaa-training”Use structure “aaa-image-image-text” Use template “aaa-training-xsl”Use images and text provided in “source” folder.Click “Save and Approve”

• Go to guest community and change a journal content portlet to use your newly created article

Usage of Structure and Templates

• Structures are very basic elements. They just define the bare elements and are meant to be reused.

• Example: There are about 200 articles in the Liferay website, which are all built off of just 10 structures. These 10 structures are laid out using about 15 templates.

Exercise 2 - Velocity• Create a new VM template and change the article to use this VM

template. It should be the same.

1. Create a new Template called “aaa-training-vm1”Reuse the structure “aaa-image-image-text”Use VM Script (“trainingtemplate.vm”)

2. Change the Article to use this new VM TemplateUse template “aaa-training-vm1”Use images and text provided in “CMS Exercise” folder.

3. View the Journal Content, though the article is using a different template, the article should look the same

• Then create a second VM template and change the article to use this VM template, the article should look different

1. Create a new Template called “aaa-training-vm2”Reuse the structure “aaa-image-image-text”Modify the VM script (“trainingtemplate.vm”) so that the images are on the left

and right of the text (hint: you can use a 3 column table)2. Change your article to user this new template (click “Preview” to quickly

see changes)

Review

• The components (image, text, list) of an Article are defined in the Structure.

• The layout of these components are defined in the Template via XSLT or VM

• Articles are displayed via the Journal Content Portlet

• Articles must be approved before they can be selected to be displayed

• When an article has been edited and the version has been incremented, only the approved version will be selectable for display

Reference

XMLhttp://www.w3schools.com/xml/default.asp

XSLThttp://www.w3schools.com/xsl/

Velocityhttp://jakarta.apache.org/velocity/docs/vtl-reference-guide.html

Javascripthttp://www.w3schools.com/js/default.asp

Revision History

?/?/2006 - ?

• Created slides

11/7/2006 - Scott Lee

• Added slides for VM templates

• Modified Exercises to show how structures are meant to be reused, different templates can be selected to change the article layout, and how versioning and article approval works