逐梦论坛 - Powered by Discuz! Board

标题: [LeadBBS相关] [蚂蚁][模板教程]从官方的S=1延伸到多栏模板制作《二》 [打印本页]

作者: shillan 时间: 2006-2-16 18:31 标题: [蚂蚁][模板教程]从官方的S=1延伸到多栏模板制作《二》

从官方的s=1延伸到多栏模板制作
                     ---傻瓜模板教程

教材目的，不会js代码就使用现成代码来改

我们知道，当我们访问http://玉米/bbs/boards.asp?s=1是论坛首页的简捷模式。再通过查看首页的代码就知道该样式是调用模板
function displayboard(boardid,boardassort,boardname,assortname)
.................
inc/templet/" & gbl_templetid & "_1.js"
.................
和
         if(num>0){for(n=num;n<5;n++)document.write("<td width=20%> </td>");}

这俩段来实现该简捷模式。

查看以上代码，提示我们进入文件夹：inc/templet/下，该文件夹是模板js文件，打开文件
1_0.js

我们复制该文件所有代码，制作一个新的模板进行测试，测试结果，使用新做的模板完全符合s=1时的简捷模式。

该代码如下：
function displayboard(boardid,boardassort,boardname,assortname)
{
   var n;
   if(currentassosrt!=boardassort)
   {
         currentassosrt = boardassort
         if(flag == 1)
         {
               if(num>0){for(n=num;n<5;n++)document.write("<td width=20%> </td>");}
               document.write("</table>");
               document.write("<br>");
         }
         else
         {
               if(gbl_tableheadstring != "")document.write("<table width=" + def_bbs_screenwidth + " border=0 cellspacing=0 cellpadding=0 align=center><tr><td>" + gbl_tableheadstring + "</td></tr></table>");
         }
         document.write("<table width=" + def_bbs_screenwidth + " border=0 cellspacing=1 cellpadding=5 align=center bgcolor=#cccccc class=tbone><tr bgcolor=#666699><td colspan=5 class=tbhead><img src=images/blank.gif width=2 height=3><br><a href=boards.asp?assort=" + boardassort + "><b><font color=white class=headfont>" + assortname + "</font></b></a></td></tr>");
         flag = 1;
         num=0;
   }
   if((num%5)==0)document.write("<tr bgcolor=#f7f7f7 class=tbbg9>");
   document.write("<td width=20%><a href=board/board.asp?boardid=" + boardid + ">" + boardname + "</a></td>");
   num+=1;
   if(num>4)num=0;
}

稍具有html基础的朋友通过分析以上的代码都知道，该语句将版块横列为5块。每块为20%。tr延伸td为5格，及colspan=5

有了这样的思路，我们可以任意调整以上的5和20%将模板样式定为n栏了。

有了这样的思路，我们再参考：http://w.leadbbs.com/a/a.asp?b=10&id=2211933&e=1&eid=40
或http://qjpz.com/bbs/announce/announce.asp?boardid=3062&id=64136
该模板制作教程，对上面的代码进行填充。

双栏模板代码参考：http://w.leadbbs.com/a/a.asp?b=10&id=2240674

附录：通过以上深入的了解，我们将首页制作成左边是一竖型的深长表格，右边是论坛的各类版块已不是不可能。更多的将首页布置为任意的模式，需要你具有丰富的想象力和深厚的html基础加简单的js修改知识，leadbbs的模板会更加丰富多彩。

原帖地址：http://w.leadbbs.com/a/a.asp?b=10&id=2245567

欢迎光临逐梦论坛 (http://temp2023.zhumeng.org/)