dotCMS - Open Source Content Management System, Ondemand CMS, and Professional Support

Create a Customized Web Page

A web page in the dotCMS is the combination of the following re-usable ingredients:

• A Template that provides the framework for the positioning of columns and Containers through the combination of  HTML and Velocity code.
• Structures format Content fields. If a Structure does not exist for the desired type of Content, a Structure must be created before the Container can be configured properly.
• Containers determine display of fields from a type of Content, if any, Content Contributors are allowed to place in the Containers on the web page.
• Content which is displayed and formatted by the Containers that allow content contribution.  Remember that Content can be displayed on an HTML page but lives in the Content Repository (database).  Deleting an HTML page will never delete a piece of Content.

Creating a completely customized webpage requires the following steps that are aggregated in this tutorial for your convenience:

1. When designing your web page, in addition to graphical esthetics, decide what functionality and the kind of Content will be needed for each section of the web page.
2. Make sure there is a Structure for each type of Content that will be needed on the page.  See the Creating a Content Structure Type documentation for information on creating new Structures.
3. Create any new Containers needed by your web page design that will determine which fields from Structures will be exposed on the web page for a type of Content.  See the Adding a Container documentation for more information.
4. In addition to the images and HTML controlling the design of your Template, use Velocity code to parse the desired Containers in your Template.  For documentation and examples, see the Adding a Template documentation.
5. Create a new web page that uses the new Template that you have created.  See the Adding an HTML Page documentation.
6. Open the HTML page and add new or re-used content.  See the documentation on how to Add New Content to an HTML Page.