[SOLVED] Editing a shared footer across all pages - How to build in the new way since Neos 4 with process functionality?

Community Newcomer's Corner
1

I have a NodeTypes.Document.Homepage.yaml with:

V.S:Document.Homepage':
  superTypes:
    'V.S:Document.Page': true
  childNodes:
    main: ...
    footer: ...

furthermore I have a Homepage.fusion file:

prototype(V.S:Document.Homepage) < prototype(V.S:Document.Page) {
    body {
        @process.layout =V.S:Component.Template.HomepageLayout
        main = Neos.Neos:ContentCollection {
            nodePath = 'main'
        }
        footer = Neos.Neos:ContentCollection {
            nodePath = 'footer'
        }
        renderer = afx`
            <main>
                {props.main}
                {props.footer}
            </main>
        `
    }
}

Then I have a Page.fusion file:

........    
body = V.S:Component.Template.Default {
        @context.node = ${this.node}
    .....
        footer = V.S:Document.Fragment.Content.Footer

          renderer = afx`
            {props.main}
            {props.footer}

          `
        }
......

The Footer.fusion looks like:

prototype(V.S:Document.Fragment.Content.Footer) < prototype(Neos.Fusion:Component) {
    renderer = Neos.Neos:ContentCollection {
        nodePath = ${q(site).children('footer').property('_path')}
        collection = ${q(site).children('footer').children()}
    }
}

This setup works fine. But now I would like to use the new notation

// A shared footer which can be edited from all pages
// You need to define this for every page type
prototype(Vendor.Site:Document.Page) {
	body {
		# we define a new property where we render the footer
		footer = Neos.Neos:ContentComponent {
			# set the correct node for inline editing on subpages
			@context.node = ${site}

			# get all items from the root node footer
			collection = ${q(site).children('footer').children()}
		}

		# we append the footer as part of the body content
		# this might change depending on what/how you render the body content
		body.@process.appendFooter = ${value + this.footer}
	}
}

I don’t know, how it is correctly to build it in my project.
My Page.fusion starts with:

prototype(V.S:Document.Page) < prototype(Neos.Neos:Page) {
........
body = V.S:Component.Template.Default {
    @context.node = ${this.node}
..........

vs

prototype(V.S:Document.Page) {
	body {

Where should I put the new code in?
Replacing the Footer.fusion code doesn’t work.

It would be fine to have a full example of this functionality with all fragments.

Thank you in advance.

2

Why not define footer = V.S:Document.Fragment.Content.Footer in V.S:Document.Page that way all document types that are derived from that should inherit the editable footer.

3

I had defined it on the V.S:Document.Page as:

body = V.S:Component.Template.Default {
    @context.node = ${this.node}
.......
    content = Neos.Fusion:Component {
      main = Neos.Neos:PrimaryContent {
        nodePath = 'main'
      }

    footer = V.S:Document.Fragment.Content.Footer

      renderer = afx`
        {props.main}
        {props.footer}
      `
    }
.......
}

Now I see, footer is included on content.
I changed it to:

body = V.S:Component.Template.Default {
    @context.node = ${this.node}
.......
    footer = Neos.Neos:ContentComponent {
          # set the correct node for inline editing on subpages
          @context.node = ${site}

          # get all items from the root node footer
          collection = ${q(site).children('footer').children()}
        }

        # we append the footer as part of the body content
        # this might change depending on what/how you render the body content
        body.@process.appendFooter = ${value + this.footer}


    content = Neos.Fusion:Component {
      main = Neos.Neos:PrimaryContent {
        nodePath = 'main'
      }


      renderer = afx`
        {props.main}
        {props.footer}
      `
    }
.......
}

At the moment, I get the error:

# An exception was thrown while Neos tried to render your page

No Fusion object found in path "root<Neos.Fusion:Case>
/documentType<Neos.Fusion:Matcher>
/element<V.S:Document.Page>
/body<V.S:Component.Template.Default>
/footer<Neos.Neos:ContentComponent>/renderer"
Please make sure to define one in your Fusion configuration.

root<Neos.Fusion:Case>/
 documentType<Neos.Fusion:Matcher>/
  element<V.S:Document.Page>/
   body<V.S:Component.Template.Default>/
    footer<Neos.Neos:ContentComponent>/
4

Back to the initiative example:

// A shared footer which can be edited from all pages
// You need to define this for every page type
prototype(Vendor.Site:Document.Page) {
	body {
		# we define a new property where we render the footer
		footer = Neos.Neos:ContentComponent {
			# set the correct node for inline editing on subpages
			@context.node = ${site}

			# get all items from the root node footer
			collection = ${q(site).children('footer').children()}
		}

		# we append the footer as part of the body content
		# this might change depending on what/how you render the body content
		body.@process.appendFooter = ${value + this.footer}
	}
}

Can this be right? One line collection Where is the loop? Isn’t it collection part of Neos.Fusion:Collection and Neos.Neos:ContentCollection ?

Continuously, I don’t understand this code.

5

Looks like typo. Imho Neos.Neos:ContentCollection would be correct.

6

Good morning Martin,
do you think, Roland Schütz can correct this on the tutorial?

7

This works for me.

prototype(A.S:Document.Page) {
	body {
		# we define a new property where we render the footer
		footercontent = Neos.Neos:ContentComponent {

			# get all items from the root node footer
			footer = Neos.Neos:ContentCollection {
			        nodePath = ${q(site).children('footer').property('_path')}
			        collection = ${q(site).children('footer').children()}
			}
			    renderer = afx`
                   {props.footer}
			    `
		}
	}
	# we append the footer as part of the body content
	# this might change depending on what/how you render the body content
	body.@process.appendFooter = ${value + this.footercontent}
}

It would be very kind, if Roland Schütz could correct that in the tutorial.

8

I will tell him, may take some time