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

  • 2,610 views
Uploaded 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. …

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.

  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Be the first to comment
No Downloads

Views

Total Views
2,610
On Slideshare
0
From Embeds
0
Number of Embeds
3

Actions

Shares
Downloads
38
Comments
0
Likes
2

Embeds 0

No embeds

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
    No notes for slide

Transcript

  • 1. Michael Emmerich, Alkacon Software Workshop track How to update smoothly to OpenCms 9 30.09.2013
  • 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. Updating your OpenCms installation 3
  • 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. How to upgrade: Use the OpenCms update wizard! 5 Updating from OpenCms 8 to 9
  • 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. How to upgrade: Use the OpenCms update wizard! Switch to Containerpage-technology. 7 Updating from OpenCms 7 to 9
  • 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. 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. Building a multi-version template 10
  • 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. <html> <head> […] <cms:editable /> </head> <body> […] <cms:include element=„body“ editable=„true“> […] </body> </html> 12 Template for XML-pages
  • 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. […] <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. <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. <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. ● 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 MVT- Base <cms:template element=„head“> <html> <head> […] </head> <body> […] </cms:template> <cms:template element=„foot“> […] </body> </html> </cms:template>
  • 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 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. […] <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. […] <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. Showcase: Migrate a website to OpenCms 9 23
  • 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. ● Live Demo 25 Live Demo Template-Change Demo Demo Demo Demo デモ
  • 26. Step 1: Build multiversion template 26
  • 27. ● Live Demo 27 Live Demo Template Demo Demo Demo Demo デモ
  • 28. 28 Multiversion template - containers Header (with navigation) Footer Branding Main News
  • 29. Step 2: Use new template with XML-pages & XML-contents 29
  • 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. ● Live Demo 31 Live Demo Template-Change Demo Demo Demo Demo デモ
  • 32. Step 3: Enable OpenCms 8 & 9 sitemap, use new template with containerpages 32
  • 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. ● Live Demo 34 Live Demo Enable the sitemap Demo Demo Demo Demo デモ
  • 35. Step 4: Replace XML-pages with new XML- contents & formatters in containerpages 35
  • 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. […] <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. ● Live Demo 38 Live Demo Replace XML-pages Demo Demo Demo Demo デモ
  • 39. Step 5: Modify existing XML-contents 39
  • 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 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. ● 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 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. ● Live Demo 44 Live Demo Modify XML-contents Demo Demo Demo Demo デモ
  • 45. Step 6: Content enhancements for OpenCms 9 45
  • 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. ● Live Demo 47 Live Demo Individual Detailpages Demo Demo Demo Demo デモ
  • 48. ● Any Questions? 48 Any Questions? Fragen? Questions ? Questiones? ¿Preguntas?質問
  • 49. Michael Emmerich Alkacon Software GmbH http://www.alkacon.com http://www.opencms.org Thank you very much for your attention! 49