gokarna-theme / gokarna-hugo

A minimal opinionated theme for Hugo
https://gokarna-hugo.netlify.app
GNU General Public License v3.0
378 stars 146 forks source link

Cannot get TOC to show on page type #208

Closed acyberrain closed 9 months ago

acyberrain commented 10 months ago

Hello, I'm having issues getting showTableOfContents = "true" to work on type = "page". Works flawlessly on type = "post". Thoughts are much appreciated, thank you!

toc.html is default:

{{ if .Params.ShowTableOfContents }}
<aside class="post-toc">
    <nav id="toc">
        {{ .TableOfContents }}
    </nav>
</aside>
{{ end }}

single.html:

{{ define "main" }}
    {{ if eq .Type "post" }}
        {{- partial "post.html" . -}}
        {{- partial "toc.html" . -}}
    {{ end }}

    {{ if eq .Type "page" }}
        {{- partial "page.html" . -}}
        {{- partial "toc.html" . -}}
    {{ end }}
{{ end }}

hugo.toml:

[markup]
  [markup.tableOfContents]
    startLevel = 1
    ordered = false
    endLevel = 3
mansoorbarri commented 9 months ago

can you show your page document? I tried reproducing the error but it works fine

bludhaven.md

---
title: Blüdhaven
type: page
showTableOfContents: true
---

### History

Blüdhaven was a former whaling town, which was officially incorporated as a "Commonwealth" in 1912. The town had a generally poor socio-economic populace, owing in part to failed efforts to transform itself into a manufacturing and shipping center.

output: image

acyberrain commented 9 months ago

Hey @mansoorbarri -- here is page.html:

<div class="post container">

    <div class="post-header-section">
        <h1>{{ .Title }}</h1>
    </div>

    <div class="post-content">
        <p>
            {{ .Content }}
        </p>
    </div>

    {{ if .Site.Params.ShowBackToTopButton }}
    <svg id="btt-button" class="arrow-logo" xmlns="http://www.w3.org/2000/svg" height="1em" viewBox="0 0 384 512" onclick="topFunction()" title="Go to top">
        <!-- Your arrow SVG path or elements go here -->
        <path d="M177 159.7l136 136c9.4 9.4 9.4 24.6 0 33.9l-22.6 22.6c-9.4 9.4-24.6 9.4-33.9 0L160 255.9l-96.4 96.4c-9.4 9.4-24.6 9.4-33.9 0L7 329.7c-9.4-9.4-9.4-24.6 0-33.9l136-136c9.4-9.5 24.6-9.5 34-.1z"/>
    </svg>
    {{ end }}
    <script>
        let backToTopButton = document.getElementById("btt-button");

        window.onscroll = function() {
            scrollFunction()
        };

        function scrollFunction() {
            if (document.body.scrollTop > 20 || document.documentElement.scrollTop > 20) {
                backToTopButton.style.display = "block";
            } else {
                backToTopButton.style.display = "none";
            }
        }

        function topFunction() {
            smoothScrollToTop();
        }

        function smoothScrollToTop() {
            const scrollToTop = () => {
                const c = document.documentElement.scrollTop || document.body.scrollTop;
                if (c > 0) {
                    window.requestAnimationFrame(scrollToTop);
                    window.scrollTo(0, c - c / 8);
                }
            };
            scrollToTop();
        }
    </script>   

</div>
mansoorbarri commented 9 months ago

can you share your md file which is using type: page like I shared bludhaven.md

acyberrain commented 9 months ago

@mansoorbarri -- Apologies, misread. Here is ..\content\cyber\_index.md:

+++
title = "Cyber"
type = "page"
ShowTableOfContents = "true"
+++
The Cyber section is split into multiple parts, which you can click on any of these links to navigate into:

Results in: image

Whereas nested under this in ..\content\cyber\transition\index.md works fine:

+++
title = "Transitioning to Cyber"
type = "page"
showTableOfContents = "true"
+++

---

## Preamble
The world of cybersecurity

Resulting in:

image

mansoorbarri commented 9 months ago

are there any headings on the page titled "cyber"?

acyberrain commented 9 months ago

@mansoorbarri -- Yes. Full page excerpt:

+++
title = "Cyber"
type = "page"
ShowTableOfContents = "true"
+++
The Cyber section is split into multiple parts, which you can click on any of these links to navigate into:

# Career
Items.

## Sub-items
Test it out.

# Threat
Items again.

## More Sub-items
More testing it out.

image

mansoorbarri commented 9 months ago

seems fine here, can you share your repository please?

acyberrain commented 9 months ago

@mansoorbarri -- added you to acrwiki repo as a collaborator. Note that the headings I showed above are on my local-only, as this is a prod repo so I had to use a list instead. Thank you!

mansoorbarri commented 9 months ago

it seems to be working if you change your file name from _index.md to index.md. I am not entirely sure why this happens but my educated guess would be that _index.md pages are usually used to list articles & TOC wouldn't be needed for listing various articles.

More info: https://gohugo.io/content-management/organization/#index-pages-_indexmd

Screenshot of it working: image

+++
title = "Cyber"
type = "page"
ShowTableOfContents = true
+++

## toc test

The Cyber section is split into multiple parts, which you can click on any of these links to navigate into:
1. [**Career Observations**](transition/){{< badge after="WIP" >}}
    - Last Updated: {{< badge before="🕐 11 Jan 2024" >}}
    - Transitioning into cyber can be daunting, in addition to growing within it or moving around specialties. Review this page for thoughts on different disciplines within the cyber field, what education you should consider (certifications/degree programs/courses), and my experience with going from public to private sector.
1. [**Threat Analysis**](analysis/){{< badge after="WIP" >}} 
    - Empty right now.
    - Blog-style organization in here with random threats I look at, around one to two posts every 3 months. A lot of phishing usually. No, this isn't derived from my corporate work, and does not represent my employer's analysis capabilities. This is entirely open source stuff that I just dabble in as I see it or as it's sent to me. My day job consumes the majority of my deep-dive thinking.p
acyberrain commented 9 months ago

@mansoorbarri -- Fascinating, I have been trying to figure this out for weeks and the underscore did not occur to me. Different filenames create this result, but then you can't use the files as your index. index.md works as intended when underscore is removed. Thank you!!