pbootcms栏目和子栏目高亮

PbootCMS栏目与子栏目高亮实现方法

在PbootCMS开发中，栏目与子栏目高亮是一个常见需求。默认情况下，所有栏目都会保持高亮状态，但当点击子栏目时，高亮效果会消失。以下提供完整的解决方案代码。

核心代码实现

<div class="sonsort mt-4 mb-2">
    {pboot:nav num=10 parent={sort:tcode}}
        {pboot:if([nav:i]==1)}
            {pboot:2if('{sort:scode}'=='{sort:tcode}')}
                <a href="{sort:toplink}" class="btn btn-info mb-2">全部 <span class="badge badge-light">{sort:toprows}</a>
            {2else}
                <a href="{sort:toplink}" class="btn btn-light mb-2">全部 <span class="badge btn-info">{sort:toprows}</a>
            {/pboot:2if}
        {/pboot:if}
        
        {pboot:if('[nav:scode]'=='{sort:scode}')}
            <a href="[nav:link]" class="btn btn-info mb-2">[nav:name] <span class="badge badge-light">[nav:rows]</span></a>
        {else}
            <a href="[nav:link]" class="btn btn-light mb-2">[nav:name] <span class="badge btn-info">[nav:rows]</span></a>
        {/pboot:if}
    {/pboot:nav}
</div>

代码逻辑说明

该代码通过PbootCMS内置的导航标签和条件判断实现高亮效果。首先使用{pboot:nav}标签获取当前栏目的子栏目列表，parent参数指定父栏目编码。通过{pboot:if}判断当前是否为第一个栏目，如果是则输出“全部”链接。使用{pboot:2if}判断当前栏目编码是否等于顶级栏目编码，从而决定“全部”按钮的高亮状态。对于子栏目，通过对比当前导航编码与栏目编码，动态添加高亮样式类btn-info或默认样式btn-light。

注意事项

使用此代码时需确保PbootCMS版本支持{pboot:2if}标签。如果版本较旧，可替换为嵌套的{pboot:if}实现相同功能。样式类btn-info和btn-light基于Bootstrap框架，可根据实际主题样式调整。代码中的{sort:toplink}和{sort:toprows}分别表示顶级栏目链接和内容数量，确保栏目数据正确调用。