Antora默认UI：点击菜单项时保持导航菜单展开

方法一：让导航菜单始终展开 #

如果不需要折叠功能，直接强制所有子菜单保持展开：

1. 在Antora项目根目录创建supplemental-ui/css文件夹，新建custom.css文件，写入以下代码：

/* 强制展开所有折叠的子菜单 */
.nav-menu .nav-item.has-children.is-collapsed > .nav-menu {
  display: block;
}
/* 可选：隐藏折叠/展开切换按钮 */
.nav-item-toggle {
  display: none;
}

2. 重新构建站点，所有子菜单会一直处于展开状态，若添加了第二行代码，折叠按钮会被隐藏。

方法二：保留导航菜单的展开状态 #

通过浏览器本地存储localStorage记录用户的展开操作，页面切换后自动恢复之前的状态：

1. 在项目根目录创建supplemental-ui/js文件夹，新建custom.js文件，写入：

document.addEventListener('DOMContentLoaded', () => {
  // 页面加载时恢复之前的展开状态
  document.querySelectorAll('.nav-item.has-children').forEach(item => {
    const itemKey = `nav_${item.getAttribute('data-ref') || item.textContent.trim()}`;
    if (localStorage.getItem(itemKey) === 'expanded') {
      item.classList.remove('is-collapsed');
      item.classList.add('is-expanded');
    }
  });

  // 点击折叠按钮时保存当前状态
  document.querySelectorAll('.nav-item-toggle').forEach(toggleBtn => {
    toggleBtn.addEventListener('click', (e) => {
      const parentItem = e.target.closest('.nav-item.has-children');
      const itemKey = `nav_${parentItem.getAttribute('data-ref') || parentItem.textContent.trim()}`;
      if (parentItem.classList.contains('is-expanded')) {
        parentItem.classList.add('is-collapsed');
        parentItem.classList.remove('is-expanded');
        localStorage.setItem(itemKey, 'collapsed');
      } else {
        parentItem.classList.remove('is-collapsed');
        parentItem.classList.add('is-expanded');
        localStorage.setItem(itemKey, 'expanded');
      }
    });
  });
});

2. 创建supplemental-ui/partials文件夹，新建footer-scripts.hbs文件，写入以下内容（确保自定义JS被加载）：

<script src="{{uiRootPath}}/js/vendor/jquery.js"></script>
<script src="{{uiRootPath}}/js/vendor/clipboard.js"></script>
<script src="{{uiRootPath}}/js/site.js"></script>
<script src="{{uiRootPath}}/js/custom.js"></script>

注：这里保留了默认UI的原有JS引入，仅添加了自定义JS的加载代码。
3. 重新构建站点，之后展开的菜单在页面切换、刷新后都会保持展开状态。

注意事项 #

• 以上操作依赖Antora的**补充UI（supplemental-ui）**机制，无需下载或修改整个默认UI包，仅需添加对应文件即可。
• 重新构建站点时，Antora会自动将补充UI文件合并到默认UI中生效。

内容的提问来源于stack exchange，提问作者Noor Muhammed