This page applies to Hippo Cocoon version 2.1.11 and newer

Introduction

Description

The Hippo Cocoon Project Wizard is a "quick start" application designed to help you get up and running with your own Cocoon based frontend for Hippo CMS managed content. It works according to a certain pattern, which we think is best to build a Cocoon based site on.

A typical Hippo Cocoon project

A typical Hippo Cocoon project is a Maven 1 project with the following structure:

• [MyProject]
  • [src] - project sources
    • [config] - xpatch files for Cocoon configuration
    • [site] - the actual Cocoon site
      • [dasl] - code for performing DASL queries
        • [queries] - all DASL queries
          • foo.xml - DASL query for sitemenu template "foo"
        • sitemap.xmap - sub sitemap for DASL queries
      • [resources] - site resources
        • [css] - CSS files
        • [js] - Javascript files
      • [sitemaps] - sub sitemaps for each sitemenu item
        • [foo] - files for sitemenu template "foo"
          • page.xsl - XSLT stylesheet for styling the content for this sitemenu item
          • payload.xsl - XSLT stylesheet for transforming the content for this sitemenu item into the standard payload format
          • sitemap.xmap - sub sitemap for sitemenu template foo
      • [transformers] - generic XSLT stylesheets for page layout and style
      • sitemap.xmap - the main sitemap
  • project.properties - default build configuration
  • project.xml - Maven project info and dependencies

The sitemenu

The "sitemenu" is an XML document in the repository which describes the navigational structure of a site. A typical sitemenu might look like this:

<sitemenu>
  <level1>
    <name>home</name>
    <title>Home</title>
    <datasource>/content/documents/foo.xml</datasource>
    <template>homepage</template>
    <level2>
      <name>about</name>
      <title>About us</title>
      <datasource>/content/documents/other</datasource>
      <template>default</template>
    </level2>
  </level1>
  <level1>
    <name>newsitems</name>
    <title>News</title>
    <datasource>/content/documents/news</datasource>
    <template>news</template>
  </level1>
  <level1>
    <name>agenda</name>
    <title>Events</title>
    <datasource>/content/documents/events</datasource>
    <template>theme</template>
  </level1>
</sitemenu>

Each menu item element (level1, level2, etc.) has four child elements:

• name: the name of this item as it will appear in the URI of the corresponding page
• title: the label of the item as it will be displayed in the navigation of the site
• datasource: a (relative) repository URI to be used as source for a DASL query. It can point to a folder or a single document.
• template: the type of page this is: a text page, a news overview, a list of recent changes, etc. This determines what information is to be retrieved from the repository, and how it is to be presented to the user. Each template will have its own sub sitemap in de src/site/sitemaps folder in the generated skeleton code.

The sitemenu is editable in Hippo CMS through an ordinary backend template.

For more information read the Sitemenu Input Module documentation.

What the wizard will do for you

The project wizard will analyze the sitemenu or sitemenus in the repository, and generate a Cocoon site skeleton based on the site structure defined in it/them. It will give you a base to develop your own site on.

Key of course is that you already have your sitemenu(s). You need to think about your site structure and content model first, only then will the wizard be able to generate a useful skeleton for your project.

Requirements

The Hippo Cocoon Project Wizard requires the following software to be installed:

• Maven 1.0.x
• Hippo Cocoon plugin for Maven 1 (version 2.01.01 or newer)
• Hippo Repository 1.2.x
• Hippo CMS 6.xx.xx (optional, but recommended for managing your content, including sitemenus)

Getting started

Start the Project Wizard

• Check out the Hippo Cocoon project template from SVN:

  $ svn co https://svn.hippocms.org/repos/hippo/hippo-cocoon-project-template/trunk/ myproject
  

• Go into your project folder and build the project using Maven:

  $ cd myproject
  $ maven clean cocoon:deploy
  

• Start the site:

  $ cd target/hippo-cocoon-2.1.11/bin
  $ ./wrapper -c wrapper.conf
  

• Direct your browser to http://localhost:55555. You will see the following screen:

Copy sample content (optional)

If you do not already have a sitemenu and some content in place in your repository, you can use the provided sample content and use it as a base you work from.

• Check the checkbox and provide the login information for your repository (username root and password password if your are using a default repository):

• Click next and wait for the following screen to appear:

Configure your sitemenu(s)

To generate a skeleton site (including navigation) based on your sitemenu(s), you need to specify which sitemenu(s) to use.

• Check the sitemenu(s) you want to use for your navigation. If you have more than one sitemenu, specify a prefix for each sitemenu
  (e.g. "en" for the English sitemenu, and "fr" for the French sitemenu).

• Click on "Next". Hippo Cocoon will now configure your project to use the specified sitemenu(s).

• Stop your site with Ctrl+C and rebuild it using Maven (from your project's root folder):

  $ cd ../../..
  $ maven clean cocoon:deploy
  

• Start your site again:

  $ cd target/hippo-cocoon-2.1.11/bin
  $ ./wrapper -c wrapper.conf
  

Select the location of the document types definition file

Check out the generated site skeleton!

• Now point your web browser to http://localhost:55555/home and you will see the generated site in action.

Notes

• During development, you can always rerun the wizard if you added new items or templates to your sitemenu. No existing code will ever be overwritten.
• To remove the wizard from your project, remove the file src/site/config/gettingstarted.xconf from your project and rebuild using Maven.