Is Magnolia-CMS the right fit for Microsites?

Magnolia CMS – typically used in Enterprise environments – is a powerful, java based CMS. The community edition comes pre-packed with an Apache Tomcat Runtime.

Is it only suitable for Big Web Portals?

The right tool for the right job.

A wise policy in the IT world. It is not enough that something can be accomplished with a certain tool. Ease of use, maintainability and time to market are key factors. Let’s have a look how Magnolia does perform in that matter:

  1. You decide the level of dynamization!
    If you only wish to “dynamize” (Making content editable in the backend) a certain section of your site, you can do this. This way, for our microsite case, one can focus on the elements which do count,  accelerate the time to market drastically.
  2. Modularity at it’s core.
    Modules can be developed isolated from each other. Work can be dispatched. Maintainability is facilitated due to reduced complexity.
  3. Industry-standard development environment
    Common Development Tools like GIT, Maven and Eclipse can be utilized.
  4. Detailed, example driven Documentation
    Should be a standard, however I’ve seen dozens of bad or outdated documentation over the years. Magnolia offers detailed documentation.

A Microsite with Magnolia

I do like to do photography in my free time. Even with my limited skills as a hobby photographer and amateur equipment, from time to time I catch some good shots. Plans to publish said photos existed since some months. The only requirement I had was to have the published images interchangeable.

Lets have a look at some code!

The Content App

The content app lets you manage (CRUD) the published images.

Fields can be specified on-the-fly:

          - name: galleryelement
              - name: jcrName
                class: info.magnolia.ui.form.field.definition.TextFieldDefinition
              - name: title
                class: info.magnolia.ui.form.field.definition.TextFieldDefinition
              - name: image
                class: info.magnolia.ui.form.field.definition.LinkFieldDefinition
                targetWorkspace: dam
                appName: assets
                label: Select image

For a full, in-deth tutorial, I recommend the following tutorial:

The Onepager Module

After having the content app installed, the only thing left is to build the front-end part. The first step is to create a html/css prototype. I decided to use a template by As I needed the gallery elements to be dynamized, the gallery part of the html markup was required to be updated:

[#if content.galleryelementsFolderRef??]
 [#assign galleryFolder = cmsfn.contentById(content.galleryelementsFolderRef, "galleryelements")]                
    [#if galleryFolder??]
        [#assign galleryList = cmsfn.children(galleryFolder, "mgnl:galleryelement")]
        [#if galleryList?has_content]
            [#list galleryList as galleryentry]                                            
                [#assign asset = damfn.getAsset(galleryentry.image!"") /]
                [#if asset??]
                    [#assign galeryTitle = galleryentry.title!asset.title! /]
                     <div class="col-md-3 portfolio-wrapper">        
                        [#if galleryentry.image?has_content]
                            [#assign imgRef = damfn.getAssetLink(galleryentry.image, "large")!]
                            [#if imgRef?has_content]
                                <a href="${imgRef}" class="b-link-stripe b-animate-go  swipebox">
                                <img src="${imgRef}" alt=""><div class="b-wrapper">
                         <h2 class="b-animate b-from-left b-delay03"><img src="${ctx.contextPath}/.resources/one-pager-module/webresources/images/plus.png" alt=""/></h2>

The End Result can be viewed here:

Full Sources are available on Github:


Even for small projects, magnolia-cms is a viable option. The biggest downside is the lack of ready-to-use templates. In exchange you gain the advanced enterprise level features of Magnolia.