Hi!
I successfully used @jmooring 's answer (from 2021: Split markdown content in two files, but don’t render shortcodes as raw text ) to split the content of a single .md file into separate section-divs.
//originally I used the older solution (2018, also by jmooring): Two div sections one markdown file - #2 by jmooring
As these topics are now closed I wanted to ask the community (or maybe @jmooring, if he is available) for some issues I noticed:
On a first glance the generated pages do look correct, but not quite…
My Problem:
In my setup, the generated
.html
seems to encapsulate the content sections with “opening” </p> and “closing” <p> tags, which is A) reversed and B) totally unnecessary and of course gets marked as invalid in some browsers behind the scenes.
Considerations:
→ Maybe this has something to do with my goldmark settings in hugo.toml
:
[markup]
[markup.goldmark]
[markup.goldmark.extensions]
[markup.goldmark.extensions.typographer] #german quotes
leftDoubleQuote = '„'
rightDoubleQuote = '“'
leftSingleQuote = '‚'
rightSingleQuote = '‘'
[markup.goldmark.parser]
# wrapStandAloneImageWithinParagraph = false
[markup.goldmark.parser.attribute]
block = true
title = true
The unnecessarily complicated solution I arrived at (after a fun learning experience ) :
→ I trimmed the p tags surrounding the section.
layouts/_default/ list.html
{{- $sectionDelimiter := "[SECTION-BREAK]" -}}
{{- $ContentSections := split .Content $sectionDelimiter -}}
{{- /* I added the following: */ -}}
{{- $sect0left := strings.TrimLeft "</p>" (index $ContentSections 0 | safeHTML) }}
{{- $sect0trim := strings.TrimRight "<p>" $sect0left | safeHTML }}
{{- $sect1left := strings.TrimLeft ...
{{- $sect1trim ...
{{- $sect2left ...
{{- $sect2trim ... and so on...
...
{{- /* ---the first section start without the "wrong" p-tag but ends this way--- */ -}}
{{- with .Page.Params.sectionheroclass }}
<section class="prose {{ . }}" id="section-hero">{{ strings.TrimRight "<p>" (index $ContentSections 0 | safeHTML) | safeHTML }}</section>
{{- end }}
{{- /* ---the following sections are handled this way:--- */ -}}
{{- with .Page.Params.section1class }}
<section class="prose {{ . }}" id="section-1">{{ $sect1trim }}</section>
{{- end }}
...
Maybe it’s this goldmark-setup or something else, I don’t know. I believe the solution from 2018 I tried earlier was better, but I think I never bothered to look at the generated html at this stage of my journey…
So could someone please help me understand what is going on behind the scenes (while rendering the markdown, I believe) so that I could clean my hacked code that I am a little bit embarrassed…