Instructions for building the demo The following instructions are based on WebSphere Portal 8.0/8.5. The instructions accompany the article on IBM developerWorks titled “Full Control Over Markup In WCM While Using JSPs”. Prerequisites - WebSphere Portal environment (v8.0 or v8.5) with WCM enabled Sufficient access permissions to create web content libraries Sufficient access permissions to create templates, components, site areas and content. Instructions Download the EAR file from the following location: https://dl.dropboxusercontent.com/u/19549758/WCM%20article/CustomJSPsEAR.ear From the WAS integrated console install the provided EAR file (installs to context root /wcmcustom) and start the installed EAR. From Portal Administration\Portal Content\Web Content Libraries, create two web content libraries o Design Library o Content Library From WCM (Applications\Content\Web Content Authoring) add Design Library and Content Library to the list of selected libraries (Preferences\Edit Shared Settings\Library Selection) In Design Library, create three presentation templates: o Blog Landing Page: leave blank for now o Blog Post: leave blank for now o Blog Response: leave blank for now In Design Library, create three authoring templates: o Blog Landing Page Map the template to the “Blog Landing Page” presentation template In the default Content Properties tab, scroll down to the Workflow section and deselect “Enable workflow for items created with this authoring template” o Blog Post Map the template to the “Blog Post” presentation template Check the box that says: “Create content under a new site area” Manage Elements: add “Body” (Rich text) In the default Content Properties tab, scroll down to the Workflow section and deselect “Enable workflow for items created with this authoring template” o Blog Response Map the template to the “Blog Response” presentation template In the Default Content tab, open the field properties for the name field and check the boxes for “Hide field” and “Generate name” In the Default Content tab, open the field properties for the display title field and check the boxes for “Hide field” and “Generate name”, and select generate field value from: “Name” In the Default Content Properties tab, scroll down to the Workflow section and deselect “Enable workflow for items created with this authoring template” In Design Library, create a JSP Component: o Name: JSP-Component o Path: /wcmcustom;/render/component.jsp In Design Library, create a menu component: o Name: Menu - Blog Posts o Menu criteria: Check: Authoring Templates, Location Authoring templates: /Design Library/Blog Post Location: Select “Site Areas” Check: “Include descendents” Further options: o Check “Current content” o Menu design properties Display order: Descending Results Primary Sort Key: Publish Date Formatting: Use default design fields o List Paging Options: Results per page: 5 Start page: 1 Maximum number of result pages: 1 Pages to read ahead: 1 o List Presentation Markup: Header: <style> .blogs .postTitle { font-weight: bold; font-size: 1.2em; } .blogs .info { font-size: 0.9em; color: #666666; } </style> <ul class="blogs"> Result design: <li class="post"><div class="postTitle">[Placeholder tag="titlelink"]</div> <span class="info">[Property context="autofill" type="content" format="MM/dd" field="publishdate"] - [Property context="autofill" type="content" separator="," field="authors"]</span><br/> [Property context="autofill" type="content" field="description"] [Component name="design library/jsp-component" compute="always"] </li> Footer: No result design: </ul> No blog posts found In Design Library, create a menu component: o Name: Menu - Show Responses o Menu criteria: Check: Authoring Templates, Location Authoring templates: /Design Library/Blog Response Location: Select “Site Areas” Further options: o Check “Current content” o Menu design properties Display order: Descending Results Primary Sort Key: Publish Date Formatting: Use default design fields o List Paging Options: Results per page: 3 Start page: 1 Maximum number of result pages: 1 Pages to read ahead: 1 o List Presentation Markup: Header: <div class="responses"> <ul> Result design: <li>[Property context="autofill" type="content" field="description"] <span class="info">([Property context="autofill" type="content" format="MM/dd" field="publishdate"] - [Property context="autofill" type="content" separator="," field="authors"])</span></li> Footer: </ul></div> In Design Library, edit the three presentation templates and update the code with the code below: Blog Landing Page: <h2>[Property context="current" type="content" field="title"]</h2> <div class="about">[Property context="current" type="content" field="description"]</div> <section id="blog"> [Component name="design library/menu - blog posts"] </section> Blog Post: <h2>[Property context="current" type="content" field="title"]</h2> <p>[Element context="current" type="content" key="Body"]</p> [Component name="design library/menu - show responses"] Blog Response: [Property context="current" type="content" field="description"] In Content Library, create a site area called “Blogs” In Content Library, create a content item using the template “Blog Landing Page”, provide a name, display title and description In Content Library, create two or more content items using the template “Blog Post”, provide a name, display title, description and body. Make sure the contents are created in a new site area with the same name/title as the content item. In Content Library, open the site area for a blog post and create several content items using the template “Blog Response”. Provide a description, the name and title are hidden and automatically generated. You should now be able to preview the created content items and open individual blog posts from the Blog Landing Page.
© Copyright 2024