PageAdmin网站内容管理系统(CMS)交流论坛

注册

 

QQ登录

只需一步,快速开始

发新话题 回复该主题

标准官方选项卡制作教程 [复制链接]

1#
1、首先从官方网站下载用于制作选项卡的JS(说明:我使用的是style02样式
   下载地址:http://pageadmin.net/js/diy.js
2、把这个文件放入js文件夹下,并在incs\web_top.ascx里引用。
  1. <script src="/js/diy.js" type="text/javascript"></script>
复制代码
3、把官方的样式也下载了,用来找选项卡的样式的。
   下载地址:http://pageadmin.net/template/pageadmin/lanmu.css
4、用记事本打开,查找“选项卡”。把找到的两行代码复制到你的lanmu.CSS文件里。
   因为样式里用到了图片,所以必须把图片放到模板的images文件夹里,
   图片的下载地址是:http://pageadmin.net/template/pageadmin/images/sign_bg.gif    到这里,基本的准备工作已经完成。
5、进入“模块设置”里,添加你要添加的选项卡。
   这里添加的选项卡项跟平常添加的没有什么区别。如图红色框。

    
6、细心的朋友一定看到“Tab1”和“Tab2”,这两个是用来干什么的呢?
   这两个就是用来控制选项卡的显隐的。不用像之前有些同学写的还要建一个“模块样式”。
7、这里都设置好了,来看关键的一步。
   “Tab1”和“Tab2”名字是自己取的,设置为“自定义内容”。在设置之前呢,我们必须知道每个模块的Template_ID是多少,后面要用呢。这个ID的获得之前也有人说过,也很容易,我就不多说了(把鼠标放在模块输入框内就会显示)。记住他们的ID哦,最好是用纸记下来。
8、然后我们设置他的内容。
   是在“源代码”里把这段代码粘贴进去
  1.    <script type="text/javascript">
  2. Show_Template('42');
  3. HideTab('36,37,38');
  4. ShowTab('36','42');
  5. </script>
复制代码
说明:Show_Template('42');中的数字是“Tab1”的Template_ID。36、37、38为三个选项卡标签,ShowTab('36','42');这里函数里的36是你设置的默认显示标签的ID。
   如下图:

        
9、设置自定义样式。
   还是先看图吧:


图上的代码(这段代码是在官网里找到的,修改了自己的模块的ID):
  1. <div class="template_title"><span id="Tab_36" class="template_sign_tab_over" onmouseover="HideTab('36,37,38');ShowTab('36','42')">系统党建</span> <span id="Tab_37" class="template_sign_tab_out" onmouseover="HideTab('36,37,38');ShowTab('37','42')">高管论坛</span> <span id="Tab_38" class="template_sign_tab_out" onmouseover="HideTab('36,37,38');ShowTab('38','42')">专题报道</span></div>
复制代码
修改完,保存,预览效果。



如果对你有用,别忘记了回帖哦!
分享 转发
TOP
2#

天字一号!楼主辛苦,感谢分享!
TOP
3#

好东西 学习了。
TOP
4#

学习了
TOP
5#

很高明的哈
TOP
6#

学习过了,只是自定义样式下面的代码有点问题,应该是
<div class="template_title"><span id="Tab_2" class="template_sign_tab_over" onmouseover="HideTab('2,13,36,37,38,39,40,41,42');ShowTab('2','43')">企业简介</span> <span id="Tab_13" class="template_sign_tab_out" onmouseover="HideTab('2,13,36,37,38,39,40,41,42');ShowTab('13','43')">企业资质</span> <span id="Tab_36" class="template_sign_tab_out" onmouseover="HideTab('2,13,36,37,38,39,40,41,42');ShowTab('36','43')">联系我们 </span><span id="Tab_37" class="template_sign_tab_out" onmouseover="HideTab('2,13,36,37,38,39,40,41,42');ShowTab('37','43')">格力空调</span> <span id="Tab_38" class="template_sign_tab_out" onmouseover="HideTab('2,13,36,37,38,39,40,41,42');ShowTab('38','43')">大金空调</span> <span id="Tab_39" class="template_sign_tab_out" onmouseover="HideTab('2,13,36,37,38,39,40,41,42');ShowTab('39','43')">美的空调</span> <span id="Tab_40" class="template_sign_tab_out" onmouseover="HideTab('2,13,36,37,38,39,40,41,42');ShowTab('40','43')">三菱重工海尔</span> <span id="Tab_41" class="template_sign_tab_out" onmouseover="HideTab('2,13,36,37,38,39,40,41,42');ShowTab('41','43')">扬子空调</span> <span id="Tab_42" class="template_sign_tab_out" onmouseover="HideTab('2,13,36,37,38,39,40,41,42');ShowTab('42','43')">空气能热水器</span></div>

请参阅http://www.021-kongtiao.com
TOP
7#

回复 7# paullee 的帖子

其实onmouseover这个函数有写,但是被过滤掉了。
可以把你修改前的源码发下给我吗?
想研究下商业版。谢谢
Email: liuxinhuahao@qq.com
TOP
8#

这可是违规的,我一向是遵纪守法的!
TOP
9#

好贴,谢谢楼主指导,试验成功
TOP
10#

谢谢楼主的经验分享 钛合金
TOP
11#

谢谢
TOP
12#

学习了,谢谢
TOP
13#

标准官方选项卡制作,thanks
TOP
14#

感谢
TOP
15#

学习收藏了。
下面是我改的网站
http://www.zylq.co.cc/
TOP
发新话题 回复该主题