You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

MKDocs页面内可设置全局变量/宏吗?含跨页引用需求

在MKDocs中设置跨页面全局变量的方案

原生MKDocs结合Jinja2模板引擎本身不支持从页面内部设置跨页面生效的全局变量——因为Jinja2的模板渲染是单页面独立进行的,没有内置的跨页面状态存储机制,{% set myvar = 'some-value' %}这类声明仅在当前页面的渲染上下文里有效。

针对你要通过首页下拉菜单设置全局变量、供其他页面调用的需求,有两种可行的实现方向:

1. 前端JavaScript实现动态全局状态(推荐,支持用户交互修改)

MKDocs生成的是静态站点,用户交互后的状态需要在前端存储,最常用的是localStorage或sessionStorage:

步骤1:首页添加下拉菜单并存储选择值

在首页的Markdown内容中嵌入HTML和JS,监听下拉选择事件,将值存入本地存储:

<select id="siteGlobalVar">
  <option value="default">默认选项</option>
  <option value="optionA">选项A</option>
  <option value="optionB">选项B</option>
</select>

<script>
// 监听下拉菜单变化,保存值到localStorage
document.getElementById('siteGlobalVar').addEventListener('change', function(e) {
  localStorage.setItem('siteGlobalVar', e.target.value);
});

// 页面加载时恢复上次选择的值
window.addEventListener('load', function() {
  const savedValue = localStorage.getItem('siteGlobalVar');
  if (savedValue) {
    document.getElementById('siteGlobalVar').value = savedValue;
  }
});
</script>

步骤2:其他页面读取并使用全局变量

在需要调用全局变量的页面,嵌入JS读取本地存储的值,渲染到页面中:

<p>当前全局选择:<span id="globalVarDisplay"></span></p>

<script>
window.addEventListener('load', function() {
  // 读取存储的值,无值时用默认值
  const globalValue = localStorage.getItem('siteGlobalVar') || 'default';
  document.getElementById('globalVarDisplay').textContent = globalValue;
  
  // 如果需要结合Jinja2模板逻辑,也可以用这个值触发其他前端行为
});
</script>

2. 插件实现静态全局变量(仅构建时生效,不支持用户动态修改)

如果你的需求是静态全局变量(不需要用户交互修改,仅在构建时从首页配置),可以通过MKDocs插件实现:

  1. 编写一个简单的插件,读取首页的元数据(比如页面Front Matter中的变量);
  2. 将该变量注入到所有页面的Jinja2渲染上下文中,实现全局调用。

示例插件逻辑(可放入plugins/global_var_plugin.py):

from mkdocs.plugins import BasePlugin

class GlobalVarPlugin(BasePlugin):
    def on_page_context(self, context, page, config, nav):
        # 假设首页的Front Matter中有global_var字段
        if page.file.src_path == 'index.md':
            global_var = page.meta.get('global_var', 'default')
            # 将变量注入所有页面的上下文
            context['global_var'] = global_var
        return context

然后在mkdocs.yml中启用插件:

plugins:
  - global_var_plugin

之后在任意页面的模板中就可以直接调用{{ global_var }},但这种方式的变量是构建时固定的,无法响应用户的下拉选择操作。


内容的提问来源于stack exchange,提问作者Robb

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.06.24 14:25:09