Michael Emmerich, Alkacon Software
Workshop track
How to update smoothly
to OpenCms 9
30.09.2013
● Updating your OpenCms installation
● Building a multi-version template
● Show differences between different template tec...
Updating your OpenCms
installation
3
Good news:
Your existing OpenCms 8.x webapp will
run in OpenCms 9 – without any changes

(Ok, at least if you do not use ...
How to upgrade:
Use the OpenCms update wizard!
5
Updating from OpenCms 8 to 9
Good news:
Your existing OpenCms 7.x webapp will
run in OpenCms 9 – most likely without
any changes 
We will see this in ...
How to upgrade:
Use the OpenCms update wizard!
Switch to Containerpage-technology.
7
Updating from OpenCms 7 to 9
Because of several API changes between
OpenCms 6 and newer versions, your
existing OpenCms 6.x webapp will require
some ch...
How to upgrade:
Make a fresh OpenCms 9 installation and
import your modules and content
Switch to Containerpage-technology...
Building a multi-version
template
10
Different technologies in different OpenCms versions
require different templates:
● XML-Pages (OpenCms 6 and 7)
● XML-Cont...
<html>
<head>
[…]
<cms:editable />
</head>
<body>
[…]
<cms:include element=„body“ editable=„true“>
[…]
</body>
</html>
12
...
<cms:template element=„head“>
<html>
<head>
[…]
<cms:editable />
</head>
<body>
[…]
</cms:template>
<cms:template element=...
[…]
<cms:include property=„template“ element=„head“ />
[…]
// your JSTL/JSP code is here
[…]
<cms:include property =„templ...
<cms:template element=„head“>
<html>
<head>
[…]
<cms:editable />
</head>
<body>
[…]
</cms:template>
<cms:template element=...
<html>
<head>
[…]
<cms:enable-ade />
<cms:headincludes type="css" />
<cms:headincludes type="javascript" />
</head>
<body>...
● Provide a „Base-Template“ with HTML for a common
head and foot
● Individual template files for V6/7 and V8/9 include
com...
18
MVT- Base
<cms:template element=„head“>
<html>
<head>
[…]
</head>
<body>
[…]
</cms:template>
<cms:template element=„foo...
19
MVT– OpenCms 6 and 7
<cms:template element=„head“>
<cms:include file=„[Path_to_Base_Template]“ element=„head“ >
</cms:t...
20
MVT – OpenCms 8 and 9
<cms:include file=„[Path_to_Base_Template]“ element=„head“ >
<cms:container name=„left“ type=„lef...
[…]
<cms:include file=„…“ element=„head“ >
<cms:param name=„version“ value=„7“ />
</cms:include>
[…]
21
MVT – Direct Edit ...
[…]
<head>
[…]
<c:choose>
<c:when test=“${param.verison eq ‘8‘}“ >
<cms:enable-ade />
<cms:headincludes type="css" />
<cms...
Showcase:
Migrate a website to OpenCms 9
23
● Start with:
● OpenCms 6/7 Website, XML-pages & XML-contents,
running on OpenCms 9
● 6 Steps to do:
1. Build new multiver...
● Live Demo
25
Live Demo Template-Change
Demo
Demo Demo
Demo
デモ
Step 1:
Build multiversion template
26
● Live Demo
27
Live Demo Template
Demo
Demo Demo
Demo
デモ
28
Multiversion template - containers
Header (with navigation)
Footer
Branding
Main
News
Step 2:
Use new template with XML-pages
& XML-contents
29
● If the template was defined at the site folder:
● Change the template at the site folder
● If template was set on each p...
● Live Demo
31
Live Demo Template-Change
Demo
Demo Demo
Demo
デモ
Step 3:
Enable OpenCms 8 & 9 sitemap,
use new template with
containerpages
32
● How to make our site Sitemap & ADE enabled
(Hen & egg problem):
● Change the site folder to a subsitemap
● Create a „sit...
● Live Demo
34
Live Demo Enable the sitemap
Demo
Demo Demo
Demo
デモ
Step 4:
Replace XML-pages with new XML-
contents & formatters in
containerpages
35
● Create new module with simple XSD as
replacement
● Title, Text, Image in our example
● Add resourcetype in opencms-modul...
[…]
<xsd:appinfo>
[…]
<mappings>
<mapping element="Title" mapto="property:Title" />
<mapping element="Title" mapto="urlNam...
● Live Demo
38
Live Demo Replace XML-pages
Demo
Demo Demo
Demo
デモ
Step 5:
Modify existing XML-contents
39
● Modify the existing XSD
● Formatter, Title and URL mapping
● Write formatter
● Use old detail.jsp for it
● Register the ...
41
Transformation into formatter
OpenCms 6 & 7 (Detail-JSP)
[…]
<cms:include property="template"
element="head" />
<cms:co...
● Typical example: News list
● Move existing news contents to new location under
„.content“
● Define Function Elements
● C...
43
Configurable Dynamic Elements
[…]
<c:set var="newspath" value="/.content/news/" />
<c:if test="${not empty cms.element....
● Live Demo
44
Live Demo Modify XML-contents
Demo
Demo Demo
Demo
デモ
Step 6:
Content enhancements for
OpenCms 9
45
● New feature in OpenCms 9: Individual
Detailpages
● Add new container in template:
46
Individual Detailpages
[…]
<div id=...
● Live Demo
47
Live Demo Individual Detailpages
Demo
Demo Demo
Demo
デモ
● Any Questions?
48
Any Questions?
Fragen?
Questions ?
Questiones?
¿Preguntas?質問
Michael Emmerich
Alkacon Software GmbH
http://www.alkacon.com
http://www.opencms.org
Thank you very much for your
attentio...
Upcoming SlideShare
Loading in …5
×

OpenCms Days 2013 - How to update smoothly to OpenCms 9ms 9

3,499 views
3,407 views

Published on

OpenCms 9 provides great new features that build on the success of the “Advanced Direct Edit” (ADE) concept introduced with version 8. Updating from OpenCms 8 to version 9 is easy and straightforward. Updating from OpenCms 7 to 9 is also easy, but you won’t be able to use the ADE features without modifying your existing templates .

In this workshop, Michael will share over 2 years of project experience updating OpenCms 7 installations to the ADE template standard. He will show how to create templates that work with version 7 and version 9 content, using shared layout and code. Using this approach, he will explain a step by step method to update a version 7 website, so that it uses all the ADE features of version 9 in the end.

Michael will also show how to add features introduced in version 9 such as individual detail containers to your existing OpenCms 8 installation.

Published in: Technology, News & Politics
0 Comments
3 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
3,499
On SlideShare
0
From Embeds
0
Number of Embeds
3
Actions
Shares
0
Downloads
46
Comments
0
Likes
3
Embeds 0
No embeds

No notes for slide

OpenCms Days 2013 - How to update smoothly to OpenCms 9ms 9

  1. 1. Michael Emmerich, Alkacon Software Workshop track How to update smoothly to OpenCms 9 30.09.2013
  2. 2. ● Updating your OpenCms installation ● Building a multi-version template ● Show differences between different template technologies in OpenCms 6,7,8 and 9 ● How to make a template that can be used for all template technologies ● Showcase: Modify a website build with xmlpages and xmlcontents into containerpages for OpenCms 9. ● Make a smooth transition from xmlpages and xmlxontents to continerpages ● Use both technologies at the same time ● Adjust existing xmlcontents 2 Agenda
  3. 3. Updating your OpenCms installation 3
  4. 4. Good news: Your existing OpenCms 8.x webapp will run in OpenCms 9 – without any changes  (Ok, at least if you do not use OpenCms 8.0…) 4 Updating from OpenCms 8 to 9
  5. 5. How to upgrade: Use the OpenCms update wizard! 5 Updating from OpenCms 8 to 9
  6. 6. Good news: Your existing OpenCms 7.x webapp will run in OpenCms 9 – most likely without any changes  We will see this in the showcase later 6 Updating from OpenCms 7 to 9
  7. 7. How to upgrade: Use the OpenCms update wizard! Switch to Containerpage-technology. 7 Updating from OpenCms 7 to 9
  8. 8. Because of several API changes between OpenCms 6 and newer versions, your existing OpenCms 6.x webapp will require some changes to run in OpenCms 9 8 Updating from OpenCms 6 to 9
  9. 9. How to upgrade: Make a fresh OpenCms 9 installation and import your modules and content Switch to Containerpage-technology. 9 Updating from OpenCms 6 to 9
  10. 10. Building a multi-version template 10
  11. 11. Different technologies in different OpenCms versions require different templates: ● XML-Pages (OpenCms 6 and 7) ● XML-Contents (OpenCms 6 and 7) ● Containerpages (OpenCms 8 and 9) Make a template that can be used for all those technologies Allows smooth transition between different technologies 11 Multi version template
  12. 12. <html> <head> […] <cms:editable /> </head> <body> […] <cms:include element=„body“ editable=„true“> […] </body> </html> 12 Template for XML-pages
  13. 13. <cms:template element=„head“> <html> <head> […] <cms:editable /> </head> <body> […] </cms:template> <cms:template element=„foot“> […] </body> </html> </cms:template> 13 Template for XML-contents
  14. 14. […] <cms:include property=„template“ element=„head“ /> […] // your JSTL/JSP code is here […] <cms:include property =„template“ element=„foot“ /> […] 14 Template for XML-contents Usage in JSPs:
  15. 15. <cms:template element=„head“> <html> <head> […] <cms:editable /> </head> <body> […] </cms:template> <cms:template element=„body“> <cms:include element=„body“ editable=„true“> </cms:template> <cms:template element=„foot“> […] </body> </html> </cms:template> 15 Template for XML-contents/pages
  16. 16. <html> <head> […] <cms:enable-ade /> <cms:headincludes type="css" /> <cms:headincludes type="javascript" /> </head> <body> […] <cms:container name=„main“ type=„name“ … /> […] </body> </html> 16 Template for Containerpages
  17. 17. ● Provide a „Base-Template“ with HTML for a common head and foot ● Individual template files for V6/7 and V8/9 include componentes of the base template ● „Main content area“ defined individual in V6/7 and V8/9 template file ● Important: Different direct edit tags required for pre- containerpage and containerpag template file  Parallel usage of both version, smooth content transition possible 17 Multi-version template (MVT)
  18. 18. 18 MVT- Base <cms:template element=„head“> <html> <head> […] </head> <body> […] </cms:template> <cms:template element=„foot“> […] </body> </html> </cms:template>
  19. 19. 19 MVT– OpenCms 6 and 7 <cms:template element=„head“> <cms:include file=„[Path_to_Base_Template]“ element=„head“ > </cms:template> <cms:template element=„body“> <cms:include element=„body“ editable=„true“> </cms:template> <cms:template element=„foot“> <cms:include file=„[Path_to_Base_Template]“ element=„foot“> </cms:template>
  20. 20. 20 MVT – OpenCms 8 and 9 <cms:include file=„[Path_to_Base_Template]“ element=„head“ > <cms:container name=„left“ type=„left“ … /> <cms:container name=„main“ type=„main“ … /> <cms:container name=„right“ type=„right“ … /> <cms:include file=„[Path_to_Base_Template]“ element=„foot“>
  21. 21. […] <cms:include file=„…“ element=„head“ > <cms:param name=„version“ value=„7“ /> </cms:include> […] 21 MVT – Direct Edit Version Switch […] <cms:include file=„…“ element=„head“ > <cms:param name=„version“ value=„8“ /> </cms:include> […] Usage in template files for containerpages Usage in template files for xml-contents
  22. 22. […] <head> […] <c:choose> <c:when test=“${param.verison eq ‘8‘}“ > <cms:enable-ade /> <cms:headincludes type="css" /> <cms:headincludes type="javascript" /> </c:when> <c:otherwise> <cms:editable /> </c:otherwise> </c:choose> </head> […] 22 MVT – Direct Edit Version Switch
  23. 23. Showcase: Migrate a website to OpenCms 9 23
  24. 24. ● Start with: ● OpenCms 6/7 Website, XML-pages & XML-contents, running on OpenCms 9 ● 6 Steps to do: 1. Build new multiversion template 2. Use new template with XML-pages & XML-contents 3. Enable OpenCms 8/9 sitemap, use new template with container pages 4. Replace XML-pages with new XML-contents & formatters in containerpages 5. Modifiy exisiting XML-contents 6. Content enhancements for OpenCms 9 24 Migrate a website to OpenCms 9
  25. 25. ● Live Demo 25 Live Demo Template-Change Demo Demo Demo Demo デモ
  26. 26. Step 1: Build multiversion template 26
  27. 27. ● Live Demo 27 Live Demo Template Demo Demo Demo Demo デモ
  28. 28. 28 Multiversion template - containers Header (with navigation) Footer Branding Main News
  29. 29. Step 2: Use new template with XML-pages & XML-contents 29
  30. 30. ● If the template was defined at the site folder: ● Change the template at the site folder ● If template was set on each page: ● Use the content-tool to change the template property value 30 Changeing the template
  31. 31. ● Live Demo 31 Live Demo Template-Change Demo Demo Demo Demo デモ
  32. 32. Step 3: Enable OpenCms 8 & 9 sitemap, use new template with containerpages 32
  33. 33. ● How to make our site Sitemap & ADE enabled (Hen & egg problem): ● Change the site folder to a subsitemap ● Create a „sitemap content folder“ in the site, the name MUST be „.content“ ● Inside, create a folder named „.new“ ● Inside, create a model page (containerpage) ● Set the template property of our model page to the new template ● Configure the model page in the sitemap configuration  DONE, we now can use the sitemap to create new pages 33 Enable the sitemap
  34. 34. ● Live Demo 34 Live Demo Enable the sitemap Demo Demo Demo Demo デモ
  35. 35. Step 4: Replace XML-pages with new XML- contents & formatters in containerpages 35
  36. 36. ● Create new module with simple XSD as replacement ● Title, Text, Image in our example ● Add resourcetype in opencms-modules.xml ● Write formatter ● Register the content in the Module-config („.config“ file) new content can now be used 36 Replace XML-pages
  37. 37. […] <xsd:appinfo> […] <mappings> <mapping element="Title" mapto="property:Title" /> <mapping element="Title" mapto="urlName" /> </mappings> […] <formatters> <formatter type="main" uri="/system/modules/org.opencms.mun.article/formatters/ main.jsp" searchcontent="true" /> </formatters> </xsd:appinfo> […] 37 Replace XML-pages
  38. 38. ● Live Demo 38 Live Demo Replace XML-pages Demo Demo Demo Demo デモ
  39. 39. Step 5: Modify existing XML-contents 39
  40. 40. ● Modify the existing XSD ● Formatter, Title and URL mapping ● Write formatter ● Use old detail.jsp for it ● Register the content in the Module-config („.config“ file) Modified content can now be used 40 Modify XML-contents
  41. 41. 41 Transformation into formatter OpenCms 6 & 7 (Detail-JSP) […] <cms:include property="template" element="head" /> <cms:contentload collector="singleFile" param="%(opencms.uri)" editable="true"> <cms:contentaccess var="content" scope="page" /> […] ${content.value.Title} […] </cms:contentload> <cms:include property="template" element="foot" /> OpenCms 8 & 9(Formatter) […] <!–- no template-include --> <cms:formatter var="content" val="value"> <!– no init of contentaccess --> […] ${content.value.Title} […] </cms:formatter> <!–- no template-include -->
  42. 42. ● Typical example: News list ● Move existing news contents to new location under „.content“ ● Define Function Elements ● Can be inserted via Drag&Drop (Dynamic Functions) ● Reuse existing JSPs ● Optional: Make them configurable via settings ● Define Setting in Function Element ● Access setting in JSP ● Define Detailpages 42 Lists of XML contents
  43. 43. 43 Configurable Dynamic Elements […] <c:set var="newspath" value="/.content/news/" /> <c:if test="${not empty cms.element.settings.Path}"> <c:set var="newspath" value="${cms.element.settings.Path}" /> </c:if> […] <cms:contentload collector="allInFolderDateAsc" param="${newspath}news_%(number).html|news|150" editable="true" > […]
  44. 44. ● Live Demo 44 Live Demo Modify XML-contents Demo Demo Demo Demo デモ
  45. 45. Step 6: Content enhancements for OpenCms 9 45
  46. 46. ● New feature in OpenCms 9: Individual Detailpages ● Add new container in template: 46 Individual Detailpages […] <div id="contents"> <cms:container name="branding" type="branding" width="600" detailview="false"/> <cms:container name="brandingDetail" type="branding" width="600" detailonly="true“ <div class="body clearfix"> <cms:container name="main" type="main" width="600" detailview="true"/> </div> </div> […] ● Add individual contents on detailpage
  47. 47. ● Live Demo 47 Live Demo Individual Detailpages Demo Demo Demo Demo デモ
  48. 48. ● Any Questions? 48 Any Questions? Fragen? Questions ? Questiones? ¿Preguntas?質問
  49. 49. Michael Emmerich Alkacon Software GmbH http://www.alkacon.com http://www.opencms.org Thank you very much for your attention! 49

×