如何基于Jekyll插件为Tab标签添加自定义标题

方案1：最小改动适配现有highlight标签逻辑 #

1. 调整Markdown中tabs声明语法 #

支持在highlight标签后新增title参数传入自定义标题：

{% tabs %}
{% highlight C# title="定义整数示例" %}
int value =  10;
{% endhighlight %}
{% highlight Python title="定义整数示例" %}
value = 10
{% endhighlight %}
{% endtabs %}

如果不传title参数，会自动降级为原有的语言名作为标题，兼容旧写法。

2. 修改Tab标题生成逻辑 #

找到你现有的标题生成代码，替换为以下内容，优先读取自定义标题，不存在则用默认语言名：

# 解析highlight标签传入的title参数
tab_title = @params&.include?('title=') ? @params.split('title="')[1].split('"')[0] : @displayLanguage
prefix = prefix + '<li role="presentation" class=""><a data-target="#'+ id + "-" + @lang.to_s.gsub("+", "-") +'" aria-controls="home" role="tab" data-toggle="tab" data-original-lang="'+@originalLang+'">'+ tab_title +'</a></li>'

3. 调整highlight标签参数解析规则 #

如果你的现有highlight标签解析逻辑限制了参数数量，需要修改对应逻辑，允许接收额外的title参数即可，现有TabsBlock插件无需改动。

方案2：全自定义tab标签（可选） #

如果需要更灵活的控制，可以替换原有的highlight标签为自定义tab标签，语法调整为：

{% tabs %}
{% tab title="C#示例" lang="csharp" %}
int value = 10;
{% endtab %}
{% tab title="Python示例" lang="python" %}
value = 10
{% endtab %}
{% endtabs %}

配套实现对应子标签的解析逻辑即可，适合需要在tab内放非代码内容的场景。

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