Improve auto-generated previous/next topic links

[GrahamHannington]

Feature request

Description

Auto-generated prev/next links currently don't support a sidebar with a tree structure (children properties).

Currently, you need to manually define the following prev/next links:

• Next link from parent to first child
• Previous link from first child to parent
• Next link from last child of a parent to the following sibling of that parent

Proposed Solution

VuePress should infer prev/next links from the sidebar structure.

An example I developed several years ago:

https://fundisoftware.github.io/taw-sample-dashboards-jcl

The "Previous" and "Next" links (in this example, always at the top right of the page) simply traverse the TOC (sidebar) structure. I wrote this code in vanilla JavaScript.

And I defined Alt+< and Alt+> as the corresponding keyboard shortcuts.

[GrahamHannington]

I'm starting to suspect that this is user error: my problem, triggered by false expectations based on my experience with other documentation platforms.

In recent years, I've grown used to docs platforms that allow arbitrarily deep nesting of "topics" (e.g. Markdown files) in a TOC (sidebar navigation) structure.

So, as a new VuePress user, I've specified link properties on sidebar items that have children properties, like this:

              text: 'Configuring Elastic',
              link: 'elastic-config.html',
              children: [
                'elasticsearch-ilm-policy.html',
                'elasticsearch-index-template.html',
                'logstash-config.html',
                'kibana-settings.html'
              ]

and have been disappointed, as described in this feature request, that the auto-generated prev/next links don't seem to handle this structure.

I was also disappointed that VuePress doesn't highlight the "Configuring Elastic" item in the sidebar (although, I hadn't gotten around to creating an issue about it!).

And I was disappointed that I had to specify a text property for a sidebar item with children: VuePress wouldn't use the title property from the frontmatter.

All of this gave me an inkling that perhaps I wasn't using VuePress as it was designed to be used; a colleague came to the same conclusion, with the specific advice that I shouldn't be using link together with children. Rather, I should be treating a sidebar item with children similar to a part title in a book: that is, as a title only, with no associated "body" of its own.

So, I'm going to have to rethink my topic structure and topic titles. A straightforward solution is to simply move the contents of what was a "parent" topic into a new first child topic with the consistent title "Overview", although I'm not thrilled by that idea.

Thoughts?

[GrahamHannington]

Here's an example of the VuePress sidebar not highlighting the current item if it has children:

Here, "Configuring Elastic" should be highlighted in the sidebar as the current item.

[github-actions[bot]]

This issue is marked as stale because it has not had recent activity. Issues marked with stale will be closed if they have no activity within 3 days.

[Mister-Hope]

There is one thing you should know: vuepress is not equal to @vuepress/theme-default.

You may search community theme for solutions and more features.

Also we DO NOT encourage to use link in group titles as they can be collapsible.

A text title
   Intro
   Item1
   Item2

is my recommendation.

We would like you to share your ideas in discussion sperately, instead of writing all the "vuepress is suck at..." in one issue. It's hard to track and hard to reply for us.

[github-actions[bot]]

This issue is marked as stale because it has not had recent activity. Issues marked with stale will be closed if they have no activity within 3 days.

[f-w]

Pls re-open. I consider it a bug as VP v1 prev/next works across sidebar sections.