Customising toc in HTML

Customising toc in HTML

[Thomas Hodgson]

[-- Attachment #1.1: Type: text/plain, Size: 854 bytes --]

Hi,

I'm wondering whether there's a way to change the HTML for a table of 
contents. In particular, I'm wondering whether I could have something like 
this, instead of a unordered list:

```
<nav>
<span><a href="#section-one">Section one</a></span>
<span><a href="#section-two">Section two</a></span>
</nav>
```


(I'm thinking about using <https://readable-css.freedomtowrite.org/>, so I 
want the TOC to fit what will work with that.)

Tom

-- 
You received this message because you are subscribed to the Google Groups "pandoc-discuss" group.
To unsubscribe from this group and stop receiving emails from it, send an email to pandoc-discuss+unsubscribe-/JYPxA39Uh5TLH3MbocFF+G/Ez6ZCGd0@public.gmane.org
To view this discussion on the web visit https://groups.google.com/d/msgid/pandoc-discuss/6035b070-9f83-41e3-b392-5f6970e36757n%40googlegroups.com.

[-- Attachment #1.2: Type: text/html, Size: 1332 bytes --]

Re: Customising toc in HTML

[Thomas Hodgson]

[-- Attachment #1.1: Type: text/plain, Size: 1174 bytes --]

The best solution I have found is to put this in my metadata:

```
table-of-contents: <span>[Section one](#section-one)</span><span>[Section 
two](#section-two)</span>
```

Which works, but has to be updated by hand.

On Sunday, 12 February 2023 at 15:16:48 UTC+1 Thomas Hodgson wrote:

> Hi,
>
> I'm wondering whether there's a way to change the HTML for a table of 
> contents. In particular, I'm wondering whether I could have something like 
> this, instead of a unordered list:
>
> ```
> <nav>
> <span><a href="#section-one">Section one</a></span>
> <span><a href="#section-two">Section two</a></span>
> </nav>
> ```
>
>
> (I'm thinking about using <https://readable-css.freedomtowrite.org/>, so 
> I want the TOC to fit what will work with that.)
>
> Tom
>

-- 
You received this message because you are subscribed to the Google Groups "pandoc-discuss" group.
To unsubscribe from this group and stop receiving emails from it, send an email to pandoc-discuss+unsubscribe-/JYPxA39Uh5TLH3MbocFF+G/Ez6ZCGd0@public.gmane.org
To view this discussion on the web visit https://groups.google.com/d/msgid/pandoc-discuss/b1b171d9-87c7-4bac-8ab4-a0473c401519n%40googlegroups.com.

[-- Attachment #1.2: Type: text/html, Size: 2227 bytes --]

Re: Customising toc in HTML

[Bastien DUMONT]

You can use a filter to generate programmatically the content of table-of-contents. Here is a proof of concept (to be improved if you want e.g. to take account of the header levels):

```
local toc_inlines = {}

local function feed_toc_inlines(header)
  table.insert(toc_inlines,
               pandoc.Span(pandoc.Link(header.content, '#' .. header.identifier)))
  table.insert(toc_inlines, pandoc.RawInline('html', '\n'))
end

local function set_metadata(meta)
  meta['table-of-contents'] = toc_inlines
  return meta
end

return {
  { Header = feed_toc_inlines },
  { Meta = set_metadata }
}
```

However, I don't use HTML generation a lot—there may be a better way.


Le Tuesday 14 February 2023 à 05:20:59AM, Thomas Hodgson a écrit :
> The best solution I have found is to put this in my metadata:
> 
> ```
> table-of-contents: <span>[Section one](#section-one)</span><span>[Section two]
> (#section-two)</span>
> ```
> 
> Which works, but has to be updated by hand.
> 
> On Sunday, 12 February 2023 at 15:16:48 UTC+1 Thomas Hodgson wrote:
> 
>     Hi,
> 
>     I'm wondering whether there's a way to change the HTML for a table of
>     contents. In particular, I'm wondering whether I could have something like
>     this, instead of a unordered list:
> 
>     ```
>     <nav>
>     <span><a href="#section-one">Section one</a></span>
>     <span><a href="#section-two">Section two</a></span>
>     </nav>
>     ```
> 
> 
>     (I'm thinking about using <[1]https://readable-css.freedomtowrite.org/>, so
>     I want the TOC to fit what will work with that.)
> 
>     Tom
> 
> --
> You received this message because you are subscribed to the Google Groups
> "pandoc-discuss" group.
> To unsubscribe from this group and stop receiving emails from it, send an email
> to [2]pandoc-discuss+unsubscribe-/JYPxA39Uh5TLH3MbocFF+G/Ez6ZCGd0@public.gmane.org
> To view this discussion on the web visit [3]https://groups.google.com/d/msgid/
> pandoc-discuss/b1b171d9-87c7-4bac-8ab4-a0473c401519n%40googlegroups.com.
> 
> References:
> 
> [1] https://readable-css.freedomtowrite.org/
> [2] mailto:pandoc-discuss+unsubscribe-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
> [3] https://groups.google.com/d/msgid/pandoc-discuss/b1b171d9-87c7-4bac-8ab4-a0473c401519n%40googlegroups.com?utm_medium=email&utm_source=footer

-- 
You received this message because you are subscribed to the Google Groups "pandoc-discuss" group.
To unsubscribe from this group and stop receiving emails from it, send an email to pandoc-discuss+unsubscribe-/JYPxA39Uh5TLH3MbocFF+G/Ez6ZCGd0@public.gmane.org
To view this discussion on the web visit https://groups.google.com/d/msgid/pandoc-discuss/Y%2BuoJldDeeG4Yksr%40localhost.

Re: Customising toc in HTML

[Thomas Hodgson]

[-- Attachment #1.1: Type: text/plain, Size: 3034 bytes --]

Thank you!

I added an `if header.level == 2` conditional, and it does exactly what I 
want.

On Tuesday, 14 February 2023 at 16:26:38 UTC+1 Bastien DUMONT wrote:

> You can use a filter to generate programmatically the content of 
> table-of-contents. Here is a proof of concept (to be improved if you want 
> e.g. to take account of the header levels):
>
> ```
> local toc_inlines = {}
>
> local function feed_toc_inlines(header)
> table.insert(toc_inlines,
> pandoc.Span(pandoc.Link(header.content, '#' .. header.identifier)))
> table.insert(toc_inlines, pandoc.RawInline('html', '\n'))
> end
>
> local function set_metadata(meta)
> meta['table-of-contents'] = toc_inlines
> return meta
> end
>
> return {
> { Header = feed_toc_inlines },
> { Meta = set_metadata }
> }
> ```
>
> However, I don't use HTML generation a lot—there may be a better way.
>
>
> Le Tuesday 14 February 2023 à 05:20:59AM, Thomas Hodgson a écrit :
> > The best solution I have found is to put this in my metadata:
> > 
> > ```
> > table-of-contents: <span>[Section 
> one](#section-one)</span><span>[Section two]
> > (#section-two)</span>
> > ```
> > 
> > Which works, but has to be updated by hand.
> > 
> > On Sunday, 12 February 2023 at 15:16:48 UTC+1 Thomas Hodgson wrote:
> > 
> > Hi,
> > 
> > I'm wondering whether there's a way to change the HTML for a table of
> > contents. In particular, I'm wondering whether I could have something 
> like
> > this, instead of a unordered list:
> > 
> > ```
> > <nav>
> > <span><a href="#section-one">Section one</a></span>
> > <span><a href="#section-two">Section two</a></span>
> > </nav>
> > ```
> > 
> > 
> > (I'm thinking about using <[1]https://readable-css.freedomtowrite.org/>, 
> so
> > I want the TOC to fit what will work with that.)
> > 
> > Tom
> > 
> > --
> > You received this message because you are subscribed to the Google Groups
> > "pandoc-discuss" group.
> > To unsubscribe from this group and stop receiving emails from it, send 
> an email
> > to [2]pandoc-discus...-/JYPxA39Uh5TLH3MbocFF+G/Ez6ZCGd0@public.gmane.org
> > To view this discussion on the web visit [3]
> https://groups.google.com/d/msgid/
> > pandoc-discuss/b1b171d9-87c7-4bac-8ab4-a0473c401519n%40googlegroups.com.
> > 
> > References:
> > 
> > [1] https://readable-css.freedomtowrite.org/
> > [2] mailto:pandoc-discus...-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
> > [3] 
> https://groups.google.com/d/msgid/pandoc-discuss/b1b171d9-87c7-4bac-8ab4-a0473c401519n%40googlegroups.com?utm_medium=email&utm_source=footer
>
>

-- 
You received this message because you are subscribed to the Google Groups "pandoc-discuss" group.
To unsubscribe from this group and stop receiving emails from it, send an email to pandoc-discuss+unsubscribe-/JYPxA39Uh5TLH3MbocFF+G/Ez6ZCGd0@public.gmane.org
To view this discussion on the web visit https://groups.google.com/d/msgid/pandoc-discuss/9538ff1d-de89-4f74-92f1-d59a9028664bn%40googlegroups.com.

[-- Attachment #1.2: Type: text/html, Size: 5645 bytes --]