Backend

Komponenten

22. Februar 2021 / Stephan Post

Previous - Next Navigation

umgesetzt in layouts

{% set allNaviPages = collections.all | eleventyNavigation %}
{{ naviPagesParent | previous(page, parent, allNaviPages) | safe }}

{{ naviPagesParent | next(page, parent, allNaviPages) | safe }}

dadurch werden dann die nunjucks-Filter ext/tu/filter/prev-next-nav.js aufgerufen welche in der .eleventy.js konfiguriert sind.

  eleventyConfig.addNunjucksFilter("previous", function(navPages, page, parent, allNaviPages) {
return prevNextNav.getPrevious(navPages, page, parent, allNaviPages)
});
eleventyConfig.addNunjucksFilter("next", function(navPages, page, parent, allNaviPages) {
return prevNextNav.getNext(navPages, page, parent, allNaviPages)
});

Zugriff von *.ejs auf globale variablen

In den context per eleventy-config.js injected functions

Aufruf mit this.function.

Metadaten der Seite

Aufruf mit locals

Collections

sind im context immer per Collections vorhanden

length = <%= collections.all.length %><br>

page.eleventyNavigation.key = <%= locals.eleventyNavigation.key %><br>

this.en.findBreadcrumbEntries(collections.all, locals.eleventyNavigation.key)

nunjucks Filter

arbeiten auf html-content

hero.js

html picture elemente erhalten die params als css Klassen und werden danach selektiert 'tu-hero [options]}'

Startup Crashes

Bei nachfolgendem Fehler war das Problem das der Ordner src/highlights kein highlights.11tydata.js enthielt und somit die Navigation nicht berechnet wurde und es daher beim Aufruf von prev-next-nav.js zum Problem kam das die Seite im Parent (Home) nicht gefunden werden kann und dann -1 / undefined für das previous objekt zurück gibt.

Error writing templates: (more in DEBUG output)
> Having trouble writing template: _site/highlights/index.html

`TemplateWriterWriteError` was thrown
> (./src/_includes/layouts/page/test-layout.njk) [Line 16, Column 78]
TypeError: Cannot read property 'url' of undefined
DRAFT
Weiterlesen: