Макеты Hugo разделить контент h3 на div - PullRequest
Новая
       12

Макеты Hugo разделить контент h3 на div

0 голосов
/ 29 января 2019

Интересно, как изменить содержимое простого файла test.md для генерации .html с помощью hugo следующим образом - каждый h3 (###) и весь код впереди, до следующего h3.Проще говоря, я хотел бы разделить каждый раздел h3 на отдельную вкладку с названием, совпадающим с тегом h3.

test.md Файл выглядит следующим образом: 

---
title: "Some title"
layout: test
---


## Title

### some content
lorem ipsum 1

### some content 2
lorem ipsum 2

### some content 3
lorem ipsum 3

И желаемый вывод Гюговыглядит следующим образом: 

<h2 id="title">Title</h1>
<div class="tabs">
  <div class="tab" id="some content">
    <h3 id="some-content">some content</h2>
    <p>lorem ipsum 1</p>
  </div>
  <div class="tab" id="some content">
    <h3 id="some-content-2">some content 2</h2>
    <p>lorem ipsum 2</p>
  </div>
  <div class="tab" id="some content">
    <h3 id="some-content-3">some content 3</h2>
    <p>lorem ipsum 3</p>
  </div>
</div>

Если возможно, я хотел бы создать это с помощью шаблонов Hugo, но некоторые приемы JavaScript также приемлемы.Спасибо за любые подсказки.

1 Ответ

0 голосов
/ 09 февраля 2019

У меня была похожая функция для реализации (только с Хьюго, без JavaScript), и мне пришлось определить Гуго частичный шаблон в моей теме:

В themes/mytheme/layouts/partials/boxtext.html: 

{{ $paragraphs := split .Content "<h2 " }}

{{ range $index, $p := $paragraphs }}
    {{ $pp := trim $p " \n" }}
    {{ if (eq $index 0) }}
        {{ printf "%s\n" $pp | safeHTML }}
    {{ end }}
    {{ if and (ne $pp "") (gt $index 0) }}
    <div class="boxtext">
        {{ printf "<h2 %s\n" $pp | safeHTML }}
    </div>
    {{ end }}
{{end}}

(Это не значит, что вы должны делать то же, что и вы: адаптируйте его к вашему случаю, начиная с split .Content "<h3 " вместо h2!)

На самом деле, чтобы быть уверенным, что если не сгенерировать лишнюю строку и остаться компактной, мне пришлось переписать ее следующим образом: 

{{ $paragraphs := split .Content "<h2 " }}{{ range $index, $p := $paragraphs }}{{ $pp := trim $p " \n" }}{{ if (eq $index 0) }}{{ printf "%s\n" $pp | safeHTML }}{{ end }}{{ if and (ne $pp "") (gt $index 0) }}    <div class="boxtext">
        {{ printf "<h2 %s\n" $pp | safeHTML }}
    </div>{{ end }}{{end}}

Тогда моя страница шаблона single.html в соответствующем разделе моего сайта может обернуть HTMLкод, полученный с: {{ partial "boxtext.html" . }}

Как в: 

> cat "themes/mytheme/layouts/mysection/single.html"
{{ define "main" }}

<body id="id1">
    <div id="top">
        <ul class="menu">
        </ul>
    </div>
    <div>
        <div id="header">
            <h1>{{.Title}}</h1>
        </div>
    </div>
    <div>{{ range .Resources }}{{ if .RelPermalink }}
      <li>azza2<a href="{{ .RelPermalink }}">{{ .ResourceType | title }}</a></li>{{ else }}
      <li>{{ .ResourceType | title }} (no link, only embedded in page)</li>{{ end }}{{ end }}
    </div>
    {{ partial "boxtext.html" . }}
</body>
...