Sidebar Navigation should follow new design styles

[mapk]

The sidebar navigation has the correct background color, but the text and structure need to inherit the new styling.

Current Appearance

Proposed Appearance

Solution

• [ ] Remove bullets
• [ ] Add top and bottom dividers
• [ ] Add proper indentations
• [ ] Add accordion sections of links
• [ ] Add proper arrow icons for visual reference of an accordion
• [ ] Main title should just say "CHAPTERS"
• [ ] Use correct color blue for links, correct font size and weight

[Clorith]

Any reason not to fork the handbook wporg plugin for this, I see it handles styling, creates widgets that are needed and such (instead of reinventing the wheel, I'd rather use a for kthough as handbook pages may evolve outside of the visuals of other parts like HelpHub)?

[zzap]

On last meeting in slack it's been discussed about the criteria by which this sidebar will be populated.

The suggestion is to include people working on content and design and try to figure out what is the most helpful for the user. Related posts is keyword here.

So let's get cracking.

Obviously, posts is in the same category are somewhat related but it's fairly easy to click on category archive link and see all posts in it.

We are barely using tags and this might be the moment to start to. While we have some general sections in categories, I think we can go more narrow in labeling post content with tags, and include Personas and Experiences taxonomies to refine query and make sure all selected posts are relevant to current viewer and current post.

Any thoughts? Pinging @atachibana @mapk @Kenshino @Clorith @ntwb ... and everyone else, please do jump in.

[atachibana]

@zzap This is just my comment.

Relating articles view or Category/Tag views are useful.

But I prefer the TOC of HelpHub and marker of current articles so that Handbooks have. https://make.wordpress.org/core/handbook/best-practices/coding-standards/php/ Or, as like as PHP Help: http://php.net/manual/en/tutorial.forms.php

Current codex has many duplicated or similar articles in it, because people just does not notice other articles. If we can provide such TOC and point to the position, people want to create the new one.

For Implementation: We don't need the system for automatic TOC generation. Editing by manual is enough, I think.

[zzap]

Editing by manual is enough, I think.

We could start with it and see what's the best fit. As we would need different links on different posts it might be too much of work setting it up manually. Maybe we could have it pre-populated by some criteria with option to manually edit it.

[Kenshino]

I think a first MVP version is to just use Jetpack's Related Post functionality. See https://jetpack.com/support/related-posts/

I feel the final version would be something a combination of curated content and automation.

If curated content are selected, e.g. selecting specific articles that we know are better related inside a meta box. These 'Related Posts' selected in a manual manner would be chosen over the automated selection. Basically a manual override.

If no manual posts are set, the Related Posts will be selected automatically.

I had a consult at WCUS Contributor Day that the Related Post by Jetpack already uses ElasticSearch so we are not going to do better even if we tried to setup custom ES queries.

As for Design - @mapk

Why are we trying to use Chapter design when it's basically a list of related posts?

[mapk]

@Kenshino no need for the "Chapter." My only suggestion would be to keep the same design, but the content can be populated however.

[Kenshino]

Moving this back into Phase 1 - The content isn't very discoveryable without proper internal linking through sub-navigation elements.

[Clorith]

203 has introduced the sidebar as discussed, but what hasn't been covered here is what it's meant to include of content, and how it's intended to be populated.