Page with articles

For this, we need

• a page
• a section
• two data sources.

Create a page

First, we create a new page (“Blueprints” → ”Pages” → “Create new”):

• Name → “News”
• Parameters → title (we will need this parameter later in the data sources)

Create a section

Next, we create a new section (“Blueprints” → “Sections“ → “Create new”):

• Name → “Articles”
• Navigation Group → “News”

Next, we add the following fields to the section:

• a field “Text Input” named “Title” and required
• a field “Textarea” named “Teaser”
• a field “Textarea” named ‘Content’
• a field “Checkbox” named “online”
• a field “Date” named “Published on”

Immediately afterwards, create the first article (“News” → “Articles”):

• Title: “Hello world! 💪”
• Teaser: “This is our first article.”
• Content: “The content goes here.”
• Online: marked

Create data sources

DS 1 Article overview

To display all articles on the page, we need a data source that retrieves all published articles from the database.

To do this, we create a new data source (“Blueprints” → “Data Sources” → “Create new”).

1. Name this data source “News: Latest articles”.

2. Enter the title ($title) as the “Forbidden Parameter”.

3. To display only articles that have actually been published, we need two additional filters:

   • “Online (Checkbox)” → yes
   • “Published on (Date)” → equal to or earlier than now

4. Set the sorting to the field “Published on” → desc.

5. For pagination, see the example “Pagination”.

6. Under “Included Elements”, select the following fields:

   • Title
   • Teaser
   • Date

7. Attach this data source to the page “News”.

8. Create the data source by clicking the button “Create Data Source”.

DS 2 Single article

To display a single article on the page, another data source is required.

To do this, we create a new data source again (“Blueprints” → “Data Sources” → “Create new”).

1. We name this data source “News: Single article”.

2. This time we need a “Required Parameter” → $title.

3. Under “Error Conditions,” we set a redirect to the 404 error page if “No results are found”.

4. To display this one article, we need three additional filters this time:

   • “Online (Checkbox)” → yes
   • “Published on (Date)” → equal to or earlier than now
   • “Title (Text Input)” → {$title}

5. Under “Included Elements” select the following fields:

   • Title
   • Teaser
   • Content
   • Date

6. Attach this data source to the page “News”.

7. Create the data source by clicking the button “Create Data Source”.

Test data sources

With these two data sources, the page is flexible: an overview is shown by default, and a single article is displayed when a title parameter is present.

When you debug the page “News” (https://example.net/news/?debug) in the front-end, our first article (with title, teaser, and date) should now be rendered as entry in the XML.

Please also note the error message in the data source news-single-article: Data source not executed, required parameter is missing.

<data>
  <params>
    ...
  </params>
  <events />
  <news-latest-articles>
    <section id="1" handle="articles">Articles</section>
      <entry id="1">
        <title handle="hello-world">Hello world! 💪</title>
        <teaser mode="formatted"><p>This is our first article.</p></teaser>
        <date iso="2025-04-12T09:56:00+02:00" timestamp="1744444560" time="09:56" weekday="6" offset="+0200">2025-04-12</date>
      </entry>
  </news-latest-articles>
  <news-single-article>
    <section id="1" handle="articles">Articles</section>
    <error required-param="$title">Data source not executed, required parameter is missing.</error>
  </news-single-article>
</data> 

When debugging the first article (https://example.net/news/hello-world/?debug) in the front-end, our first article (with title, teaser, content, and date) should now be displayed in the data source news-single-article.

Please also note the error message in the data source news-latest-articles: Data source not executed, forbidden parameter was found.

              <data>
  <params>
    ...
  </params>
  <events />
  <news-latest-articles>
    <section id="1" handle="articles">Articles</section>
    <error forbidden-param="$title">Data source not executed, forbidden parameter was found.</error>
  </news-latest-articles>
  <news-single-article>
    <section id="1" handle="articles">Articles</section>
    <entry id="1">
      <title handle="hello-world">Hello world! 💪</title>
      <teaser mode="formatted"><p>This is our first article.</p></teaser>
      <content mode="formatted"><p>The content goes here.</p></content>
      <date iso="2025-04-12T09:56:00+02:00" timestamp="1744444560" time="09:56" weekday="6" offset="+0200">2025-04-12</date>
    </entry>
  </news-single-article>
</data>
            

Template

In your page template, you can test the two nodes and then transfer them to the templates:

              <xsl:choose>
  <xsl:when test="normalize-space(/data/news-latest-articles/entry)">
    <xsl:apply-templates select="/data/news-latest-articles/entry" mode="latest-articles" />
  </xsl:when>
  <xsl:when test="normalize-space(/data/news-single-article/entry)">
    <xsl:apply-templates select="/data/news-single-article/entry" mode="single-article" />
  </xsl:when>
</xsl:choose>
            

Then insert the two matching templates:

              <xsl:template match="entry" mode="latest-articles">
  <article>
      <h2>
        <xsl:value-of select="title" />
      </h2>
    <xsl:copy-of select="teaser/*" />
    <a href="/news/{title/@handle}/">Read more</a>
  </article>
</xsl:template>

<xsl:template match="entry" mode="single-article">
  <article>
    <h1>
      <xsl:value-of select="title" />
    </h1>
    <xsl:copy-of select="teaser/*" />
    <xsl:copy-of select="content/*" />
  </article>
</xsl:template>