UCH模板制作通杀贴—新手入门级

       本人也是昨天刚开始研究UCH的主页模板的，给大家点经验也说说我的制作方式。同时也会给大家点模板制作上的简单方法。希望能对做模板的新手有帮助。那些和我一样穷的站长我想会用的上的。希望能顶一下这个贴。其实顶一下也只是想让更多的人学到东西而已于我根本没什么好处。下面就开始吧！
        我昨天主要研究了主页的制作和改良。这里我感觉uch的模板还有很多问题有待优化和解决。因为并不是全站都采用的div+css制作。本人现在一看table就迷糊。基本都是用div+css来做的，也希望KG能早点迈入XHTML的开发大军中吧！
         首先我们要做的是有一个上手快、安装简单、全中文、体积小并且能编辑多种脚本的文本工具这里我给大家提供一个附件里免费下载吧！然后打开我们要学习和改良的uch的主页模板目录地址如下/template/default/index.htm 完整的主页是三个文件分别是header.htm、footer.htm 这样一看就知道我们修改起来和调用起来一定很方便制作过程也可以有不同的人来做不同的东西，这样制作速度就快了。
下面我主要对index.htm进行细致的讲解和研究。
把inedx.htm的代码粘上来给大家说说，用DW进行格式化99行还不多应该能一个帖子解决。我直接在代码中一注释的形式给大家讲解。

1. 
   
2. <!-- 这个不用说就是调用我们上面提到的 header.htm了。其实你自己也可以做一个header.htm然后传到刚才的目录，在这里调用一下。灵活运用就是把header换名字，自己做一个head.htm文件在这里调用的格式就是[<!--{template head}-->] 这样是不是就简单了-->
   
3. <!--{template header}-->
   
4. 
   
5. <div class="Login">
   
6.   <div class="Login-l">
   
7.      <SCRIPT src="template/default/image/flash/wslz.js"
   
8.                   type=text/javascript></SCRIPT>
   
9.      <DIV>
   
10.       <DIV>
    
11.          <DIV id=sasFlashFocus27></DIV>
    
12. <!-- 这里的js是赢在校园的主页flash幻灯片调用如果大家需要我打个包给大家
    
13. 你到时候用就知道复制我的代码到你的站然后把需要的文件按照目录结构传上去好了搞定。
    
14. -->
    
15.          <SCRIPT>
    
16.                         var sohuFlash2 = new sohuFlash("template/default/image/flash/wslz.swf", "0", 540, 252, "0");
    
17.                         sohuFlash2.addParam("quality", "high");
    
18.                         sohuFlash2.addParam("wmode", "opaque");
    
19.                         sohuFlash2.addVariable("image","template/default/image/flash/001.jpg|template/default/image/flash/002.jpg|template/default/image/flash/003.jpg|template/default/image/flash/004.jpg|");
    
20.                         sohuFlash2.addVariable("url","index.php|index.php|");
    
21.                         sohuFlash2.addVariable("info", "烽火某地人社交网络");
    
22.                         sohuFlash2.addVariable("stopTime","5000");
    
23.                         sohuFlash2.write("sasFlashFocus27");
    
24.                         </SCRIPT>
    
25.        </DIV>
    
26.     </DIV>
    
27.    </div>
    
28.   <div class="Logon-r">
    
29. 
    
30. <!-- 这里就是登陆框的调用，和header的调用是一样的，我们也可以自己做一个然后调用到这里 -->
    
31. 
    
32.      <!--{template login}-->
    
33.    </div>
    
34. </div>
    
35. <div class="c_form" style="padding: 10px 20px;">
    
36.   <table cellpadding="0" cellspacing="0" class="formtable">
    
37.     <tr>
    
38.       <td width="450" valign="top"> <table cellspacing="2" cellpadding="2" width="100%">
    
39.           <tr>
    
40.             <td class="h_status" style="font-size:14px;">欢迎您，已经有 <a href="network.php?ac=space"><strong>$spacecount</strong> 位成员</a> 入住家园了！</td>
    
41.           </tr>
    
42.           <tr>
    
43.             <td> <a href="do.php?ac=register" class="r_option" style="display: block; margin: 0 auto 2em; width: 100px; border: 1px solid #486B26; background: #76A14F; line-height: 30px; font-size: 14px; text-align: center; text-decoration: none;"><strong style="display: block; border-top: 1px solid #9EBC84; color: #FFF; padding: 0 0.5em;">立即注册</strong></a>
    
44.               <ul>
    
45.                 <li>在这里，您可以用<a href="help.php?ac=doing">迷你博客</a>记录生活中的点点滴滴</li>
    
46.                 <li>方便快捷地<a href="help.php?ac=blog">发布日志</a>、<a href="help.php?ac=album">上传图片</a></li>
    
47.                 <li>与好友们一起<a href="help.php?ac=share">分享信息</a>、<a href="help.php?ac=mtag">讨论感兴趣的话题</a></li>
    
48.                 <li>更可轻松快捷了解<a href="help.php?ac=home">好友最新动态</a></li>
    
49.               </ul></td>
    
50.           </tr>
    
51.         </table>
    
52.         <!--{if $onlinelist}-->
    
53.         <div class="box">
    
54.           <h3>这些朋友当前正在访问</h3>
    
55.           <div class="box_action">他们就在您的附近</div>
    
56.           <ul class="avatar_list s_clear">
    
57.             <!--{loop $onlinelist $key $value}-->
    
58.             <li> <a href="space.php?uid=$value[uid]" title="{$_SN[$value[uid]]}" target="_blank"><img src="<!--{avatar($value[uid],small)}-->" class="avatar" /></a>
    
59.               <p><a href="space.php?uid=$value[uid]">{$_SN[$value[uid]]}</a></p>
    
60.             </li>
    
61.             <!--{/loop}-->
    
62.           </ul>
    
63.         </div>
    
64.         <!--{/if}-->
    
65.         <!--{if $hotspacelist}-->
    
66.         <div class="box">
    
67.           <h3>热门成员推荐</h3>
    
68.           <div class="box_action"> 您也许认识他们
    
69.             <p class="action"><a href="network.php?ac=space">寻找好友</a></p>
    
70.           </div>
    
71.           <ul class="avatar_list s_clear">
    
72.             <!--{loop $hotspacelist $key $value}-->
    
73.             <li> <a href="space.php?uid=$value[uid]" title="{$_SN[$value[uid]]}" target="_blank"><img src="<!--{avatar($value[uid],small)}-->" class="avatar" /></a>
    
74.               <p><a href="space.php?uid=$value[uid]">{$_SN[$value[uid]]}</a></p>
    
75.             </li>
    
76.             <!--{/loop}-->
    
77.           </ul>
    
78.         </div>
    
79.         <!--{/if}-->
    
80.         <!--{if $newfeed}-->
    
81.         <div class="box">
    
82.           <h3>看看大家现在正在做什么…</h3>
    
83.           <div class="box_action"> 您也来参与吧 </div>
    
84.           <div id="index_feed" class="box feed">
    
85.             <ul>
    
86.               <!--{loop $newfeed $value}-->
    
87.               <!--{template space_feed_li}-->
    
88.               <!--{/loop}-->
    
89.             </ul>
    
90.           </div>
    
91.           <p>&nbsp;&nbsp;<a href="network.php">&gt;&gt;查看更多</a></p>
    
92.         </div>
    
93.         <!--{/if}--> </td>
    
94.       <td valign="top"> <div class="index_narrow">
    
95.           <!--{template do_reg}-->
    
96.           <br>
    
97.         </div>
    
98.         <!--{if $_SGLOBAL['ad']['rightside']}-->
    
99.         <br>
    
100.         <div class="index_narrow" style="padding:0.5em;">
     
101.           <!--{ad/rightside}-->
     
102.         </div>
     
103.         <!--{/if}--> </td>
     
104.     </tr>
     
105.   </table>
     
106. </div>
     
107. <!-- 这个不用说了是footer 的调用。 -->
     
108. <!--{template footer}-->
     
109. 
     
110. 
     
111. 
     

复制代码

大约能改的对于新手也就是这些了。
其他比如整体的结构要对css文件进行修改后续在给大家说吧！也不是特别的难。
还有一点在自己做的模板调用之前你的模板格式一定要是xxxx.htm的要不调用可能会出错哦！
有什么不明白的可以跟贴，我们大家一起交流一起探讨希望能给大家点思路也希望大家的回帖能让我学的更多。
东西附件里下吧！
我把我修改的主页给大家传上来本地测试的可以自己看看然后试着改改。
手写工具安装很简单一直下一步就可以。功能大家自己开发吧！不错的工具。
时间比较紧所以就说这么多。等时间过了在细致的说。大家别骂我哦！

辛苦了，沙发。

太感谢了.
(::40::) (::40::) (::40::)

顶了再看 :lol

强大啊    :lol

辛苦了， 支持。。。。

自己也来顶一个

讲解的很详细，不错。

支持，不错