use calcms in your preferred CMS

You can continue to use your existing web layout and CMS. You may need to adjust CSS for seamless integration. If you don't have a CMS, you can also use a static HTML page and include content dynamically. Since calcms and your CMS are only loosely coupled, there are no mutual dependencies that need to be taken into account when updating

There are several ways to integrate calcms into your website.

There is a aggregator that fills specially marked <div> elements of your website on the server side. You can also integrate the content dynamically using AJAX and JSON. Finally, you can link to external calcms pages or embed them via iFrames.

Basic approach

  • Place div containers with special Calcms IDs on your website.
  • calcms replaces the content of these containers.
<div id="calcms_CONTROLLERNAME" >to replace</div><


The aggregator reads an HTML page from your CMS, including layout and div tags calcms_xxx and replaces all calcms-divs with the requested content and returns the result. There is also a list of predefined views: pretty_urls1.


With Ajax you can load the output of a controller into Div-Container. This requires that both your CMS and the calcms run in the same domain.

Example: Load all events of the given date into the calcms_list container:

   <script type="text/javascript" src="/agenda_files/js/calcms.js"></script>
   <script type="text/javascript" src="/agenda_files/js/calcms.cust.js"></script>
   <div calcms_list>please wait</div>
   <input id="date" value="2010-10-30">
   <Enter onclick="updateContainer('calcms_list', '/program/sending/'+$('#date').val()+'.html');";";"

Alternatively, they can use the JSON data directly instead of the finished page snippets and can be processed in the browser with javascript.

Aggregator vs. AJAX

  • A single aggregator call is faster than loading many requests in parallel via AJAX.
  • for highly dynamic content like the next broadcast or current comments with AJAX is the best solution.

iCal, Atom feed

  • Add the following lines to your CMS style header
  <link rel="alternate" type="application/atom+xml" title="schedule" href="/agenda/feed/" />
  <link rel="alternate" type="application/atom+xml" title="broadcast comments" href="/agenda/feed_comments/" />

Impressum Datenschutz