Update Question: Custom Page Inspector not loading

Hi,

I’ve just updated from version 3.3. to version 7.3.

After updating all NodeTypes, all content elements work as desired.

What does not really work is a Custom Page for NewsArticle.
Here the inspector on the right side is only shown after a reload of the NewsArticle.
If I now switch to another NewsArticle page, no inspector is displayed there either, and I have to do a reload again for it to be displayed.

The reload is unfortunately not a viable workaround. We are talking about almost 40 pages here. I can’t switch to afx either.

Did I forget something in my code?

This is my code:

NodeTypes.NewsArticle.yaml

'Custom.Package:NewsArticle':
  superTypes:
    'Neos.Neos:Document': true
  ui:
    label: 'News Article'
    icon: icon-reorder
    position: 300
    group: customNews
    inlineEditable: true
    inspector:
      groups:
        styling:
          label: Informations
  properties:
    newsDate:
      type: DateTime
      defaultValue: 'today midnight'
      ui:
        label: 'Publishing Date'
        inspector:
          group: 'styling'
          position: 10
          editorOptions:
            format: d.m.Y
    title:
      type: string
      ui:
        label: Title
        inspector:
          group: 'styling'
        inlineEditable: true
        position: 100
        inline:
          editorOptions:
            placeholder: Title
    link:
      type: string
      ui:
        label: Link
        position: 600
        inspector:
          group: 'styling'
          editor: Neos.Neos/Inspector/Editors/LinkEditor
          editorOptions:
            assets: false
            rows: 1
    checkbox:
      type: boolean
      defaultValue: false
      ui:
        label: 'Open Link in new Tab'
        inspector:
          group: 'styling'
          editor: Neos.Neos/Inspector/Editors/BooleanEditor
    text:
      type: string
      ui:
        label: Description
        inspector:
          group: 'styling'
        inlineEditable: true
        inline:
          editorOptions:
            formatting:
              strong: true
              em: true
              sub: false
              sup: false
              p: true
              h1: false
              h2: false
              h3: false
              h4: false
              h5: false
              h6: false
              code: false
              removeFormat: true
              a: true
              underline: true
            autoparagraph: true
    image:
      type: Neos\Media\Domain\Model\ImageInterface
      ui:
        label: Bild
        reloadIfChanged: true
        position: 300
        inlineEditable: true
        inspector:
          group: 'styling'
          editorOptions:
            features:
              crop: true
              resize: true
    category:
      type: reference
      ui:
        label: Category
        inspector:
          group: 'styling'
          editor: Neos.Neos/Inspector/Editors/ReferenceEditor
          editorOptions:
            nodeTypes:
              - 'Custom.Package:NewsCategory'

NewsArticle.fusion

prototype(Custom.Package:NewsArticle) < prototype(Custom.Package:DefaultPage) {
  bodyTag {
    attributes.class = 'no-NewsArticle-backend'
  }

  body {
    templatePath = 'resource://Custom.Package/Private/Templates/Page/NewsArticle.html'
    sectionName = 'body'

    title = ${q(node).property('title')}
    text = ${q(node).property('text')}
    image = ${q(node).property('image')}
    link = ${q(node).property('link')}
    checkbox = ${q(node).property('checkbox')}
    category = ${q(node).property('category')}
    newsDate = ${q(node).property('newsDate')}
  }
}

NewsArticle.html

<!DOCTYPE html>
{namespace neos=Neos\Neos\ViewHelpers}
{namespace media=Neos\Media\ViewHelpers}

<html>
<head>
	<f:section name="metadata">
		<meta charset="utf-8" />
		<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
	</f:section>

	<f:section name="stylesheets">
		<link href="{f:uri.resource(path: 'Styles/default.css', package: 'Custom.Package')}" rel="stylesheet" type="text/css" />
	</f:section>
	<f:section name="headScripts">
		<!-- Put your scripts inclusions for the head here, they will be included in your website by Fusion -->
	</f:section>
</head>
<body>
<f:section name="body">
	<div id="no-Backend-news" style="background-color: #149b5a;height:100%;">
		<div class="container">
			<div class="row">
				<div class="col-xs-12 col-md-12">
					<div class="no-Teaserbox-wrapper no-Teaserbox-underline no-Teaserbox-background-white">
						<div class="card">
							<div class="card-block">
								<div class="col-md- neos-contentcollection">
									<neos:contentElement.wrap node="{node}">
										<div class="no-News-title">
											<h3>
                        {neos:contentElement.editable(property: 'title', tag:'strong')}
                      </h3>
										</div>
									</neos:contentElement.wrap>
									<figure class="no-News-image">
										<f:if condition="{image}">
                      <media:image image="{image}" alt="{title}" class="img-fluid" maximumWidth="450" />
                    </f:if>
									</figure>
									<neos:contentElement.wrap node="{node}">
										<div class="no-News-text">
                      {neos:contentElement.editable(property: 'text', tag:'p')}
										</div>
									</neos:contentElement.wrap>
									<f:if condition="{link}">
										<a href="{link}" class="btn btn-primary" >Mehr erfahren</a>
									</f:if>
								</div>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>

</f:section>
<f:section name="bodyScripts">
</f:section>
</body>
</html>

DefaultPage.fusion

prototype(Custom.Package:DefaultPage) < prototype(Neos.Neos:Page) {
  head {
      stylesheets.site = Neos.Fusion:Template {
          templatePath = 'resource://Custom.Package/Private/Templates/Page/Default.html'
          sectionName = 'stylesheets'
      }

      javascripts.site = Neos.Fusion:Template {
          templatePath = 'resource://Custom.Package/Private/Templates/Page/Default.html'
          sectionName = 'headScripts'
      }

      metadata = Neos.Fusion:Template {
          templatePath = 'resource://Custom.Package/Private/Templates/Page/Default.html'
          sectionName = 'metadata'
          title = ${q(node).property('title')}
      }


      titleTag {
          default = ${q(node).property('title')}
          content = ${q(node).property('titleOverride') ? q(node).property('titleOverride') : this.default}
      }

      alternateLanguageLinks >
  }

  body {
    templatePath = 'resource://Custom.Package/Private/Templates/Page/Default.html'
    sectionName = 'body'
    headerimage = ${q(documentNode).property('headerimage')}
    contact = ${q(documentNode).children().find('#26a1d148-2d31-4745-b555-bece132b47b3').get(0)}
    imprint = ${q(documentNode).children().find('#3338ae24-dded-4bef-8af7-18b8d2a543ac').get(0)}

    parts {
        menu = Neos.Neos:Menu {
            entryLevel = 1
            maximumLevels = 3
        }

        mobile {
            menu = Neos.Neos:Menu {
                templatePath = 'resource://Custom.Package/Private/Templates/Partials/MobileMenu.html'
                entryLevel = 1
                maximumLevels = 3
            }
        }
    }

    // These are your content areas, you can define as many as you want, just name them and the nodePath.
    content {
        // The default content section
        header = Neos.Neos:ContentCollection {
            nodePath = 'header'
        }
        // The default content section
        main = Neos.Neos:PrimaryContent {
            nodePath = 'main'
        }
    }

    footer = Neos.Neos:ContentCollection {
        nodePath = ${q(site).children('footer').property('_path')}
        collection = ${q(site).children('footer').children()}
    }

    javascripts.site = Neos.Fusion:Template {
        templatePath = 'resource://Custom.Package/Private/Templates/Page/Default.html'
        sectionName = 'bodyScripts'
    }

  }
}

Thanks,
Damian

Hi,

I would advise you to take the Node Type Definition Reference and check for each and every attribute in your yaml, if it is positioned correctly, the spelling and if it makes sense.
Besides positioning, you could also check if the editorOptions are correct (e.g. for newsDate you use editorOptions-format, but also the default text editor) and if you use inline/inspector at the same time (e.g. your property title). I also like to use apostrophs explicitly for things like labels.
Another thing I noticed is that your styling-group only has the label as attribute. If you haven’t defined it elsewhere, you also have to specify the tab where it is shown. The tab in return also has to be specified, if you don’t use the general one.

I found that often when having some mysterious problem like this, I had some property in the wrong position. For me, it was always in the yaml-file and not in the fusion-file.

I hope some thing of this long list will help :slight_smile: