Repository navigation
Add sidebar nav to jquery.com pages #266
Description
We have the pages directly on jquery.com. See also https://jquery.com/wp-sitemap-posts-page-1.xml.
| Page | Primary navigation | Secondary |
|---|---|---|
| Browser Support | Browser Support |
.. |
| Download | Download |
.. |
| Meetups | .. | .. |
| Upgrade Guides | .. | Linked from Version Support, Linked from API Documentation: Home, Linked from API Documentation: Category Version 4.0 |
| Upgrade Guide: 1.9, 3.0, 3.5, 4.0 | .. | Linked from Upgrade Guides |
| License | .. | .. |
| Team | .. | Top > OpenJS > jQuery Team |
| Support | Main nav > Version Support |
Top > Support > Chat |
| History | .. | .. |
The "License", "Team", "Support", and "History" pages were recently imported from jquery.org per jquery/jquery.org#139.
While "Support" was added to the main nav (as "Version Support"), several of the above are hard to discover. Requiring either browsing the Top nav, or finding it indirectly via other pages, or via typeahead search suggestions.
I suggest we enable the sidebar on these pages. This is similar to what we do on other jQuery sites (api.jquery.com, blog.jquery.com, and learn.jquery.com). And for jQuery UI, it was always done on the main site as well (e.g. https://jqueryui.com/about/).
For jQuery UI, while the sidebar has always been enabled there, including on these kinds of meta pages, those meta pages were not themselves linked from that same sidebar. I fixed that in jquery/jqueryui.com#229 a few months ago.
Once we have a solution for navigating to these pages (whether the proposed sidebar, or something else), I'd be interested in importing a "Brand Guidelines" page of sorts as well, after which we could potentially phase out https://brand.jquery.org/. I did this for QUnit at https://qunitjs.com/brand/.
Thoughts?
Preview
This is an example of what it might look like:
| Page | Screenshot |
|---|---|
| API (unchanged) |  |
| Blog (unchanged) |  |
| Support (after) |  |
| Support (before) |  |
| Team (after) |  |
| Team (before) |  |
Note that the default page layout is already mobile-friendly. It renders similar to before on mobile when above the fold (except left-aligned instead of centered, and with a bit more room for content on mobile). The sidebar is an appendix in mobile.
| Before | After |
|---|---|
 |
 |
 |
 |
Activity
All: Add various pages to a new "Project" meta category
mgol commentedon Jun 10, 2026
At least from the screenshots, the before state with centered headings & a bit more padding looks nicer to me. The padding is smaller on smaller devices and I don't feel it's too large on iOS; see the screenshot of the current state on iPhone 15 Pro running iOS 26.5:
Krinkle commentedon Jun 16, 2026
@mgol OK. I'm happy to change that.
Note that this is not a new style or new combination. If I understand correctly, the majority of our pages have a sidebar and with left-aligned text and narrower spacing. Should we change these more generally?
The jquery.com meta pages are among the last pages that use the "contentfull" template (which is more spacious, centred, and no sidebar).
mgol commentedon Aug 31, 2026
@Krinkle I'm not married to this centered header look on mobile, but horizontal paddings on your "after" screenshots seem small to me; compare that to the following screenshot of the
.add()page you linked, done on an iPhone 15 Pro:All: Add various pages to a new "Project" meta category
mgol commentedon Aug 31, 2026
@Krinkle I merged #267; I also wanted to merge jquery/jquery-wp-content#490, but I'll first wait to hear your thoughts here.