0
ブートストラップタブのショートコードを作成しようとしています。私は次のHTML構造を持っています。Hugoショートコードとしてのブートストラップタブ
<nav class="nav nav-tabs" id="myTab" role="tablist">
<a class="nav-item nav-link" id="{{ .Get `id` }}-tab" data-toggle="tab" href="#{{ .Get `id` }}" role="tab" aria-controls="{{ .Get `id` }}">
{{ .Get "title" }}
</a>
</nav>
<div class="tab-content" id="nav-tabContent">
<div class="tab-pane fade" id="{{ .Get `id` }}" role="tabpanel" aria-labelledby="{{ .Get `id` }}-tab">
{{ .Inner }}
</div>
</div>
構造体には、Hugoプレースホルダーも含まれています。しかし、
<a class="nav-item nav-link" id="{{ .Get `id` }}-tab" data-toggle="tab" href="#{{ .Get `id` }}" role="tab" aria-controls="{{ .Get `id` }}">
{{ .Get "title" }}
</a>
あるコードの内側部分は
<div class="tab-pane fade" id="{{ .Get `id` }}" role="tabpanel" aria-labelledby="{{ .Get `id` }}-tab">
{{ .Inner }}
</div>
が今の問題は、私のようにid
に合格しなければならないということで、ある対応するコンテンツのdivと一緒に複数回必要になります内部構造の引数であり、その親から切り離す必要があります。ショートコードを次のように使用することができます。
{% tabs %}
{% tab id = "tab-1" title = "Tab One" %}
Content in Tab 1
{% \tab %}
{% tab id = "tab-2" title = "Tab Two" %}
Content in Tab 2
{% \tab %}
{% \tabs %}
どうすればいいですか?