dedecms 動態 tab 寫法 欄目 CMS 简体版
原文   原文鏈接

項目要求要dedecms動態添加選項卡而後本身寫了一個curl

 

如今須要些tab的欄目下建立子欄目 (若是是首頁須要頂級欄目)url

 

如圖我在案例下添加了3個子欄目spa

而後每一個子欄目裏面添加須要在tab裏面輸出的內容3d

而後在欄目模板中添加代碼以下code

{dede:channel type='son' row='10' currentstyle="<li class='active' role='presentation' ><a href='~typelink~' ~rel~ role='tab' data-toggle='tab'>~typename~</a></li>"}
<li><a href='[field:typeurl/]' [field:rel/]>[field:typename/]</a></li>
{/dede:channel}

這段代碼 是查詢欄目 其中 type=‘son’ 表明的就是欄目下的子欄目htm

由於這些欄目會生成htm頁面,因此每一個teb標籤都是一個頁面。blog

 

具體位置就是你teb標題的位置如圖get

下面就是teb選項卡中內容的顯示了代碼以下it

{dede:list pagesize='6'}
                <div class="col-md-4 col-sm-6 col-xs-12">
                    <div class="ind_thum">
                        <a href="[field:arcurl/]" target="_blank"><img src="[field:litpic/]" alt="[field:title/]" class="img-responsive"></a>
                        <h3 class="text-center"><a href="[field:arcurl/]" target="_blank">[field:title/]</a></h3>
                    </div>
                </div>
                {/dede:list}

完整的teb選項卡每一項動態添加內容以下圖io

完整的代碼以下

<ul role="tablist" id="myTab">  
      {dede:channel type='son' row='10' currentstyle="<li class='active' role='presentation' ><a href='~typelink~' ~rel~ role='tab' data-toggle='tab'>~typename~</a></li>"}
                <li><a href='[field:typeurl/]' [field:rel/]>[field:typename/]</a></li>
                {/dede:channel}
    </ul>    
    <!--tab-content start-->
    <div class="tab-content">
        <!--tab-pane start-->
      <div role="tabpanel" class="tab-pane fade in active" id="vall">          
          <div class="row">
            {dede:list pagesize='6'}
                <div class="col-md-4 col-sm-6 col-xs-12">
                    <div class="ind_thum">
                        <a href="[field:arcurl/]" target="_blank"><img src="[field:litpic/]" alt="[field:title/]" class="img-responsive"></a>
                        <h3 class="text-center"><a href="[field:arcurl/]" target="_blank">[field:title/]</a></h3>
                    </div>
                </div>
                {/dede:list}
        </div>
            <div class="dede_pages">
              <ul class="pagelist">
                {dede:pagelist listitem="index,end,pageno,pre,next" listsize="1"/}
              </ul>
            </div> 
      </div>
        <!--tab-pane end-->              
        <!--tab-pane start-->   

 完整的樣式:

 

 

好了  一個dedecms的動態的選項卡就作好了

相關文章
相關標籤/搜索
每日一句
    每一个你不满意的现在,都有一个你没有努力的曾经。
本站公眾號
   歡迎關注本站公眾號,獲取更多信息