Stories App

cd my-light-modules
mkdir -p block-examples/blocks
mkdir -p block-examples/templates/blocks
mkdir block-examples/i18n
mkdir -p block-examples/decorations/stories-app/apps/
mkdir -p block-examples/templates/pages

block-examples/blocks/quote.yaml

class: info.magnolia.editor.block.stock.FieldSetBlockDefinition
templateId: block-examples:blocks/quote
fields:
  quotation:
    class: info.magnolia.ui.form.field.definition.TextFieldDefinition
    rows: 3
  citedPerson:
    class: info.magnolia.ui.form.field.definition.TextFieldDefinition

block-examples/templates/blocks/quote.yaml

templateScript: /block-examples/templates/blocks/quote.ftl
renderType: freemarker

block-examples/templates/blocks/quote.ftl

[#if content.quotation?has_content]
<blockquote>
<p>${cmsfn.decode(content).quotation}</p>
    [#if content.citedPerson?has_content]<cite>${content.citedPerson}</cite>[/#if]
</blockquote>
[/#if]

block-examples/i18n/example-blocks_en.properties

blocks.quote.label=Quote
quote.quotation.label=Quote
quote.citedPerson.label=Cited person

block-examples/i18n/example-blocks_de.properties

blocks.quote.label=das Zitat
quote.quotation.label=das Zitat
quote.citedPerson.label=zitierte Person

block-examples/decorations/stories-app/apps/stories.yaml

subApps:
  editor:
    contentDefinition:

      blocks:
        - text
        - image
        - video
        - externalLink
        - quote

Add a title and lead text:

Add the url:

Add a new quote block:

Add the quote:

Click Save and Publish

block-examples/templates/pages/block.yaml

renderType: freemarker
title: Block Page
templateScript: block-examples/templates/pages/block.ftl

block-examples/templates/pages/block.ftl

[#assign testContent = cmsfn.contentByPath("/test", "stories") /]
[#assign blocks = cmsfn.children(testContent, "mgnl:block") /]

<!DOCTYPE html>
<html xml:lang="en" lang="en" class="no-js">
    <head>
        [@cms.page /]
    </head>
    <body>
        ${content.title!""}
        ${content.lead!""}
        [#if testContent?hasContent]
        [#assign blocks = cmsfn.children(testContent, "mgnl:block") /]
        [#list blocks as block]
            [@cms.block content=block /]
        [/#list]
        [/#if]
    </body>
</html>

block-examples/
├── blocks
│   └── quote.yaml
├── decorations
│   └── stories-app
│       └── apps
│           └── stories.yaml
├── i18n
│   ├── example-blocks_de.properties
│   └── example-blocks_en.properties
└── templates
    ├── blocks
    │   ├── quote.ftl
    │   └── quote.yaml
    └── pages
        ├── block.ftl
        └── block.yaml

Page tree

Stories App