How to create a new page

Objective

Developers are familiar with the concept of a page, which in other frameworks might be a file sitting on server (e.g. /home.php, /home.jsp, etc... ), a servlet or some other mechanism which cause the Web browser to return content for a URL. In Berlioz, a page is effectively a service which is delivered as HTML.

This tutorial demonstrate how to create a simple page taking the example of an FAQ. Even if you're not a Java developer you can create new services in order to stub out the pages in your system.

Tutorial

Step 1: Berlioz base

Download  and setup Berlioz base from Github . Make sure that you can get Berlioz base running. You should be able to see the home page at:

http://localhost:8099/ 

Step 2: Create a new service

To create a new service, we are going to edit the services configuration located at /WEB-INF/config/services.html.

Add the following to your service.html file b:

<!-- FAQ -->
<service id="faq" method="get">
  <url pattern="/faq" />
  <generator target="html" name="bundles" class="org.pageseeder.berlioz.bundler.GetWebBundles" />
  <generator target="main" name="faq" />
</service>

Here is what the code above means:

• We are creating an service identified by 'faq'
• It matches the /faq URI (i.e. faq.html, faq.xml, faq.src and faq.json when using the standard mapping).
• We use an empty generator named 'faq' (this is because we are not concerned with the content at this stage)

You should be able to access your new service at:

http://localhost:8099/faq.src 

And the following:

<?xml version="1.0" encoding="utf-8"?>
<root service="faq" group="default">
  <header> ... </header>
   <content generator="org.pageseeder.berlioz.bundler.GetWebBundles"
                 name="bundles" target="html" etag="1449805646280"
               status="ok"> ... </content>
   <content generator="org.pageseeder.berlioz.generator.NoContent"
                 name="faq" target="main" etag="nocontent" 
               status="ok"></content>
</root>

If you get this, you have successfully created the new service.

Step 3: Create XSLT

If you try to access the HTML version of this page at http://localhost:8099/faq.html , it will be mostly blank because we haven't create a template for the service.

Let's create a new XSLT module: /WEB-INF/xslt/default/faq.xsl.

And copy the following content:

<?xml version="1.0"?>
<xsl:stylesheet version="2.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">

<xsl:template match="content[@name='faq']" mode="content">
  <h1>Frequently Asked Questions</h1>
  <p>Welcome to our frequently asked questions</p>
</xsl:template>

</xsl:stylesheet>

Step 4: Include XSLT module

If you try to access the HTML pages, nothing's changed because we haven't included the XSLT module in the principal XSLT module: /WEB-INF/xslt/default.xsl.

So let's add an import rule to include our new template by inserting the following line into the our principal XSLT module (before the <xsl:output> element)

<xsl:import href="default/faq.xsl"/>

Now, if you refresh the HTML page, you will see that our template was included:

http://localhost:8099/faq.html

Created on 11 December 2015 , last edited on 11 December 2015 at 15:07