1. Why the Official Navbar Is Not Used
The official Docsify Navbar is designed to provide navigation among pages within a documentation site. Setting loadNavbar: true and adding _navbar.md generates .app-nav from Markdown inside #app. Its links assume Docsify hash routing, and on narrow screens they can be integrated into the sidebar. This arrangement is appropriate for presenting pages within a single documentation site.
Real Terms instead requires cross-site navigation. The links connect the emotiongraphics.jp home page, Real Terms at /ai/, Significant Bit at /docs/, and About. They therefore use regular origin-relative URLs instead of Docsify #/… routes. The navigation also has a fixed height of 64px and hides while the page is scrolled downward. On narrow screens, the appearance and language controls are placed in a hamburger menu shared with the VitePress implementation. The logo links to the eMotionGraphics publisher home page rather than to Real Terms itself.
Using the official Navbar together with the site navigation would create the following conflicts.
- Height
The vendor CSS defines--navbar-heightas4em. The site navigation uses a height of 64px and applies the same value to the contentpadding-topand the fixed sidebartop. Placing both navigation elements on the page would cause the content and sidebar offsets to differ. - Stacking order
.app-navhas az-indexof 20, while the sidebar uses 60. The site navigation uses 40 in its normal state and 60 while its menu is open. Adding the official Navbar would therefore introduce conflicts with the narrow-screen overlay. - Narrow screens
Docsify can hide.app-navand integrate its links into the sidebar. In contrast, the hamburger menu shared with VitePress is a full-screen panel whose role differs from search and the article table of contents. Combining them would obscure the distinction between navigation across sites and navigation within the documentation.
For these reasons, the Real Terms $docsify configuration enables loadSidebar: true and does not specify loadNavbar. It does not include _navbar.md or use a Navbar plugin. The only libraries loaded by the HTML shell are the project-local docsify.min.js and the official search.min.js.
The site navigation consists of two files.
site/app.jsensureSiteNav()generatesheader.eg-site-navand is called by the DocsifysiteChromeplugin.site/theme.css
TheSite navbar (eMotionGraphics chrome)section defines fixed positioning, visibility while scrolling, and the hamburger menu used at widths of 768px and below.
Docsify remains responsible for the sidebar, search, hash routing, auto2top, and article rendering. Cross-site navigation is kept outside its rendering area. The next chapter explains when the site navigation is generated and where it is inserted.