Custom Page Layouts with LiveSite

LiveSite and Sitepublisher 3.1 have 2 interesting features that greatly enhance the powers of it. Let’s have a close look at these.

Custom Page Types

First feature to mention is the ‘Custom Page Types’ (dubbed ‘Doctype Support’ in the manual, such a stupid name because it clashes with the well-known html-doctype. Using this mechanism one can define a xsl-stylesheet to use for the master page-html. This is important because I believe that the html that the default page-xsl produces is not very good. It is not accessible, not standard-compliant, fuzzy code is inserted and it uses a css-stylesheet which I don’t like. In fact, I think code like this should always be custom-created.

Adding your own custom page type is very easy. Add something like below to livesite_customer_src/etc/conf/livesite_customer/pagetype-config.xml and rebuild the livesite-toolkit:

<page-types>

<page-type id="yourid" default="false">

<name>Any name</name>

<output>

<doctype/>

<method>html</method>

<content-type>text/html</content-type>

<omit-xml-declaration>true</omit-xml-declaration>

</output>

<allowed-layouts>

<layout refid="yourlayout"/>

</allowed-layouts>

</page-type>

</page-types>

<layouts>

<layout id="yourlayout">

<name>Your Layout</name>

<stylesheet>nl/contentdokter/xsl/runtime/yourstyle.xsl</stylesheet>

<class>com.interwoven.livesite.layout.impl.DivLayout</class>

</layout>

</layouts>

Now all you need to do is create your own xsl-stylesheet (under livesite_customer_src/etc/classes/nl/contentdokter/xsl/runtime/yourstyle.xsl). Two short tips on this:

1. use one of the xsl-files under httpdwebappscontent_centerWEB-INFclassescominterwovenxslruntime as a reference example

2. if your want to know how the source xml looks use this xsl-template:

<xsl:template match="/">

<xsl:copy-of select="."/>

</xsl:template>

Note that you could even, if you really have the courage, to write your own Layout-class in java. That is, however, not easy and I don’t really see a good use for it.

Custom Fixed Layouts

The second feature to mention is the ‘Custom Fixed Layouts’. Using this, you stop using the original free-flow layout of SitePublisher and instead divide your page into fixed areas in which your end-users can drop the components. A crucial feature, really, because I don’t think I will ever meet a content-editor that can be bothered with placing a component on a pixel-exact detail. Too time-consuming and error-prone.

If you want to try it out yourself, follow the chapter on this in the manual but, important, the given example has 1 or 2 annoying errors that will break it!

A perfect world

Now, in a perfect world one would be able to combine these two features:

1. create a fixed layout matching your sites styleguide

2. create a custom page-stylesheet with clean html and all custom css/js included

Well, that will work but it won’t! So yes, you can overwrite the default ‘fixed-layout’ with your own, and thus define which page-xsl to use. But you can NOT create a second (or third) layout-entry in pagetype-config for a fixed layout.

Thus is due to the fact that the (internal) java-code does a string-match in the layout-id for ‘fixed-layout’. It would have been so much better would they have added a boolean attribute to the layout-element like ‘is-fixed-layout’. But they haven’t.

Typical. :-(

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Connecting to %s