帝国CMS默认的tab选项卡切换调用不同栏目文字内容

[topvip]

修改目标：
首页内包含多个用到tab选项卡的地方，有图片选项卡，也有单纯用文字的选项卡。
希望
在左边栏显示调用网站公告和新闻资讯，tab切换，显示单纯文字内容。
在中间栏目显示默认的图片调用不变。


修改过程如下：
帝国默认图片tab选项卡代码是这样的：

<!-- tab选项卡，默认为点击变化，如需改为移动，将onmouseover改为onclick -->
<table width="100%" border="0" cellspacing="0" cellpadding="0" class="tbtn1">
<tr>
<td class="tbtncon"><ul><li class="curr" id="tab1_btn_0" onmouseover="etabit(this)">新闻</li><li id="tab1_btn_1" onmouseover="etabit(this)">图片</li><li id="tab1_btn_2" onmouseover="etabit(this)">影视</li><li id="tab1_btn_3" onmouseover="etabit(this)">FLASH</li></ul></td>
</tr>
<tr>
<td class="picList"><div id="tab1_div_0"> [phomenewspic]'news',3,6,128,90,1,20,20[/phomenewspic] 
            </div>
            <div id="tab1_div_1" style="display:none;"> [phomenewspic]'photo',3,6,128,90,1,20,20[/phomenewspic] 
            </div>
            <div id="tab1_div_2" style="display:none;"> [phomenewspic]'movie',3,6,128,90,1,20,20[/phomenewspic] 
            </div>
            <div id="tab1_div_3" style="display:none;"> [phomenewspic]'flash',3,6,128,90,1,20,20[/phomenewspic] 
            </div></td>
</tr>
</table>

发现：原来tab1_btn_0 这个tab1这个数字很关键，tab选项卡必须用数字来定义。

于是我就修改成id=tab2_btn_0 对应 div id="tab2_div_0

然后测试。

欧也，成功了。。。。。。哈哈。。。。

得出结论：
同一个页面，用多个tab选项卡调用。每个选项卡，都必须用不同的id

就是id=tab1_btn_0和 div id="tab1_div_0 这里红色的部分也要修改掉，不能重复。后面的数字当然互相对应就可以了。调用可以使用cms的所有标签，想怎么用就怎么用。哈哈。

最后，大家调用会发现，虽然调用成功了。可是如果按照默认的代码来，你想调用的文字内容排列很难看。。。。

这就需要修改文字内容的修饰语法了。。。。我是修改成和其他默认文字调用一样就行了。

修改的时候。大家要注意，表格样式标签是<table class="tbtn1"> <td class="tbtncon">这样的，需要修改的话，就要去css文件中修改对应的地方。
还有一点尤其要注意。就是<li>标签后面的class也是在css里被定义的。也可以找到对应地方修改。

最后我的最终文字栏目tab选项卡调用代码是
<!-- tab选项卡，默认为点击变化，如需改为移动，将onmouseover改为onclick -->
<table width="100%" border="0" cellspacing="0" cellpadding="0" class="tbtn1">
<tr>
<td class="tbtncon" ><ul><li class="curr" id="tab2_btn_0" onmouseover="etabit(this)">最新资讯</li><li id="tab2_btn_1" onmouseover="etabit(this)">网站公告</li></ul></td>
</tr>
<tr>
<td class="box" ><ul id="tab2_div_0">[ecmsinfo]0,6,32,0,3,2,0[/ecmsinfo]</ul>

<ul id="tab2_div_1" style="display:none;">[ecmsinfo]2,6,32,0,0,2,0[/ecmsinfo]</ul>

[ecmsinfo]0,2,18,0,5,5,1[/ecmsinfo]
</td>
</tr>
</table>
里面黑色的字部分，就是我特别定义，文字内容的样式。默认代码的div我换成了ul.因为我发现ul无序排列更适合文字内容的表达。。。。