有风模板及部分教程(模板暂提供)

支持楼主。。。。支持姚明，支持法国人

支持支持!!!!!

不错的风格!!!!!!

是很不错的...........

昨天看了有风的论坛,里面说了仿制的问题,所以在这里再次声明一下,无意侵权 使用.

下面说一下首页的制作:
在此之前我们先要了解制作的过程.
第一:了解首页的构架,建议大家先分析首页分几个模块,我提供首页的模板下载.这个东西跟盖房子么什么区别,先打地基,有了地基就可以往里面添加内容了.
第二:地基有了,剩下就是往里面添加调用了,我说明的时候会附带说明一下文章的调用问题,有一些我还是不太了解,所以大家多搜集一些调用方面的知识吧.
第三:美化--css,css方面我么法说的那么详细,这个我也在学习中,大家一起共勉吧.


步入正题:
第一:顶部

1. <div id="header">
   
2.   <h1><a href="http://www.exdoc.cn">花意圃,花卉博客-展示花卉的家园</a></h1>
   
3.   <h2>花卉栽培、花店经营、花卉欣赏、家庭养花、花卉博客、相册、论坛等多方位服务</h2>
   
4.   <div id="search">
   
5.   <form id="searchForm" action="http://www.exdoc.cn/batch.search.php" method="post">
   
6.       <input type="text" name="searchkey" id="searchkey" class="editBox searchBox" />
   
7.       <select name="type" id="type" class="selectList">
   
8.         <option value="" selected="selected">全部</option>
   
9.         <option value="news">资讯</option>
   
10.         <option value="blog">博客</option>
    
11.         <option value="image">相册</option>
    
12.       </select>
    
13.       <button type="submit" name="subjectsearch" id="subjectsearch" value="true">搜索</button>
    
14.     </form>
    
15.   </div>
    
16. </div>
    
17. <div class="blank"></div>
    
18. <div id="menu">
    
19. <ul>
    
20.       <li><a href="http://www.exdoc.cn"title="首页"><em class="menuL"></em><strong>首页</strong><em class="menuR"></em></a></li>
    
21.       <li><a title=资讯 href="#action/news#"><em class="menuL"></em><strong>资讯</strong><em class="menuR"></em><!--[if IE 7]><!--></a><!--<![endif]-->
    
22.     <!--[if lte IE 6]><table><tr><td><![endif]-->
    
23.       <!--{if !empty($channels['types']['news'])}-->
    
24.       <!--{block name="category" parameter="type/news/isroot/1/ischannel/2/order/c.displayorder/limit/0,100/cachetime/10800/cachename/category/tpl/data"}-->
    
25.   
    
26.    <ul>
    
27.     <!--{loop $_SBLOCK['category'] $value}-->
    
28.     <li><a href="$value[url]">$value[name]</a></li>
    
29.     <!--{/loop}-->
    
30.    </ul>
    
31.   
    
32.    <!--[if lte IE 6]></td></tr></table></a><![endif]-->
    
33.       </li>
    
34.       <li><a title=博客 href="#action/bolg#"><em class="menuL"></em><strong>博客</strong><em class="menuR"></em><!--[if IE 7]><!--></a><!--<![endif]-->
    
35.    <!--[if lte IE 6]><table><tr><td><![endif]-->
    
36.   
    
37.           <!--{block name="category" parameter="type/blog/isroot/1/ischannel/2/order/c.displayorder/limit/0,100/cachetime/10800/cachename/category/tpl/data"}-->
    
38.   
    
39.    <ul>
    
40.     <!--{loop $_SBLOCK['category'] $value}-->
    
41.     <li><a href="$value[url]">$value[name]</a></li>
    
42.     <!--{/loop}-->
    
43.    </ul>
    
44.    
    
45.    <!--[if lte IE 6]></td></tr></table></a><![endif]-->
    
46.     </li>
    
47.       <li><a title=相册 href="#action/image#"><em class="menuL"></em><strong>相册</strong><em class="menuR"></em><!--[if IE 7]><!--></a><!--<![endif]-->
    
48.    <!--[if lte IE 6]><table><tr><td><![endif]-->      
    
49.    
    
50.       <!--{block name="category" parameter="type/image/isroot/1/ischannel/2/order/c.displayorder/limit/0,100/cachetime/93600/cachename/category/tpl/data"}-->
    
51.   
    
52.    <ul>
    
53.     <!--{loop $_SBLOCK['category'] $value}-->
    
54.     <li><a href="$value[url]">$value[name]</a></li>
    
55.     <!--{/loop}-->
    
56.    </ul>
    
57.   
    
58.       <!--{/if}-->
    
59.    <!--[if lte IE 6]></td></tr></table></a><![endif]-->
    
60.    </li>
    
61.       <li><a title=论坛 href="#action/bbs#"><em class="menuL"></em><strong>论坛</strong><em class="menuR"></em><!--[if IE 7]><!--></a><!--<![endif]-->
    
62.    <!--[if lte IE 6]><table><tr><td><![endif]-->
    
63.       <!--{block name="bbsforum" parameter="type/forum/limit/0,100/order/f.displayorder/cachetime/11500/cachename/bbsforum/tpl/data"}-->
    
64.   
    
65.    <ul>
    
66.     <!--{loop $_SBLOCK['bbsforum'] $value}-->
    
67.     <li><a href="$value[url]">$value[name]</a></li>
    
68.     <!--{/loop}-->
    
69.    </ul>
    
70.   
    
71.     <!--[if lte IE 6]></td></tr></table></a><![endif]-->
    
72.     </li>
    
73.       <li><a title=搜索 href="#action/search#"><em class="menuL"></em><strong>搜索</strong><em class="menuR"></em></a></li>
    
74.   </ul>
    
75. </div>
    
76. <div id="submenu"></div>

复制代码

需要说明的是:
<header>包括{header,blank,menu,submenu}
头部:id="header"包括{h1,h2,search}
<!--头部-->
      <h1>.....</h1>                /*首页名称关键字*/
      <h2>.....</h2>                /*关键字*/
      id="search"                   /*搜索窗口*/
空位:class="blank"                  /*填充用*/

频道栏:id="menu"
<!--频道栏目-->
      
空位:id="submenu"                   /*填充用*/


需要学习的地方:

1. <div id="search">
   
2.   <form id="searchForm" action="http://www.exdoc.cn/batch.search.php" method="post">
   
3.       <input type="text" name="searchkey" id="searchkey" class="editBox searchBox" />
   
4.       <select name="type" id="type" class="selectList">
   
5.         <option value="" selected="selected">全部</option>
   
6.         <option value="news">资讯</option>
   
7.         <option value="blog">博客</option>
   
8.         <option value="image">相册</option>
   
9.       </select>
   
10.       <button type="submit" name="subjectsearch" id="subjectsearch" value="true">搜索</button>
    
11.     </form>
    
12.   </div>

复制代码

form的用法.-----自己找一些资料看看吧
要实现搜索栏效果的话,需要有一个"selectbox.htc"这个我也么研究过,我提供下载自己参考吧[local]selectbox[/local]

栏目窗口的效果:资讯类

1. <li><a title=资讯 href="#action/news#"><em class="menuL"></em><strong>资讯</strong><em class="menuR"></em><!--[if IE 7]><!--></a><!--<![endif]-->
   
2.     <!--[if lte IE 6]><table><tr><td><![endif]-->
   
3.       <!--{if !empty($channels['types']['news'])}-->
   
4.       <!--{block name="category" parameter="type/news/isroot/1/ischannel/2/order/c.displayorder/limit/0,100/cachetime/10800/cachename/category/tpl/data"}-->
   
5.   
   
6.    <ul>
   
7.     <!--{loop $_SBLOCK['category'] $value}-->
   
8.     <li><a href="$value[url]">$value[name]</a></li>
   
9.     <!--{/loop}-->
   
10.    </ul>
    
11.   
    
12.    <!--[if lte IE 6]></td></tr></table></a><![endif]-->
    
13.       </li>

复制代码

其他类别自己看吧.
先把首页模板和css提供,后面的说明,以后继续说吧,[local]首页模板及css[/local]

[ 本帖最后由 showzly 于 2007-7-11 10:29 编辑 ]

不错不错，多出点教程以及学习的经验对我这样的新手是很有帮助的

分页显示文章标题的设置在:
<title>$title  $_SCONFIG[seotitle]- Powered By SupeSite</title>
这个$title 就可以显示出文章标题了



如下的栏目样式:

代码:

1. <div id="columnMenu">
   
2.   <!--{block name="category" parameter="type/news/isroot/1/ischannel/2/order/c.displayorder/limit/0,100/cachetime/10800/cachename/category/tpl/data"}-->
   
3.     <!--{loop $_SBLOCK['category'] $value}-->
   
4.     <ul><li><a href="$value[url]" target="_self">$value[name]</a></li></ul>
   
5.     <!--{/loop}-->
   
6. </div>

复制代码

css代码:

1. /******* Column Catogories *****************/
   
2. #columnMenu {
   
3. height: 24px;
   
4. border-bottom: 1px solid #65ab31;
   
5. }
   
6. #columnMenu ul {
   
7. float: right;
   
8. width: auto;
   
9. }
   
10. #columnMenu li {
    
11. display: inline;
    
12. float: left;
    
13. margin-left: 1px;
    
14. }
    
15. #columnMenu li a {
    
16. display: block;
    
17. width: 80px;
    
18. background: url(../images/channel_menu.gif);
    
19. text-align: center;
    
20. line-height: 24px;
    
21. }
    
22. #columnMenu li a.thisCat {
    
23. background: url(../images/channel_menu_hover.gif);
    
24. color: #fff;
    
25. }
    
26. #columnMenu li a:hover {
    
27. background: url(../images/channel_menu_hover.gif);
    
28. color: #fff;
    
29. text-decoration: none;
    
30. }

复制代码

网站格调很清爽，对新手来说正是个学习的好机会，谢谢分享~~:)

多谢楼上的支持

下面继续更新,
今天说一下网站内容调用的问题

拿资讯类来说吧.

这里可以看到我的二级栏目

先说图片区域的调用.
这个图片我是调用的,资讯-市场动态里面的4级内容:
下面看代码

1. <!--{block name="spacenews" parameter="grade/4/showattach/1/showdetail/1/catid/1/order/i.dateline DESC/limit/0,1/subjectlen/34/subjectdot/1/messagelen/80/messagedot/1/cachetime/18600/cachename/headnews/tpl/data"}-->
   
2.       <!--{loop $_SBLOCK['headnews'] $value}-->
   
3.       <!--{if !empty($value['a_thumbpath'])}-->
   
4.       <a href="$value[url]"><img src="$value[a_thumbpath]" alt="" /></a>
   
5.       <!--{/if}-->
   
6.       <!--{/loop}-->

复制代码

说明:
先引用一下别人的成果

1、 name="spacenews"     意思是规定调用资讯模块的内容
2、 grade/4/             调用审核等级为4的内容
3、 showattach/1         是否显示图片附件1为显示 0 为不显示
3、 showdetail/1         是否显示缩略信息1为显示 0为不显示
4、 order/i.dateline     按照发布时间排序
5、 limit/0,1            0是从头一条开始 1是调用1条
6、 subjectlen/34        调用标题的字节数
7、 subjectdot/1         标题是够显示省略号1为显示 0 为不显示
8、 messagelen/80        缩略内容显示字节数
9、 messagedot/1         缩略内容是否显示省略号
10、cachetime/18600      缓存更新时间
11、cachename/headnews   调用变量的名称
12、dateline/2592000     调用的时间范围
13、catid/1,2            调用的频道限制

然后我们具体来看:
1.block name="spacenews      /*调用资讯栏目*/
2.parameter="grade/4             /*文章等级为4级*/
3.showattach/1                        /*显示缩略附件*/
4./showdetail/1                        /*显示缩略信息*/
5./catid/1                                 /*调用频道为1*/ 我的1频道是 "市场动态"*
6./order/i.dateline DESC         /*按发布时间排序*/
7./limit/0,1                                /*调用1条文章*/
8./subjectlen/34                       /*调用标题的字节数为34个字节*/
9./subjectdot/1                         /*标题显示省略号*/
10./messagelen/80                  /*缩略内容显示80个字节数*/
11./messagedot/1                    /*缩略内容显示省略号*/
12./cachetime/18600               /*缓存更新时间为18600秒*/
13./cachename/headnews/tpl/data           /*调用变量名称*/


后面的{loop $_SBLOCK['headnews'] $value}大家去看论坛里面的文章吧,说的比较详细了.
这个如果会调用了,那其他的向,相册,博客,商品,都可以自己去作了.
catid频道可以去调用模块导航里面自己找的.



图片调用说完了,下面我们看:推荐标题调用

1. <!--{block name="spacenews" parameter="grade/5/showattach/1/showdetail/1/catid/1/order/i.dateline DESC/limit/0,1/subjectlen/34/subjectdot/1/messagelen/80/messagedot/1/cachetime/18600/cachename/headnews/tpl/data"}-->
   
2.     <!--{loop $_SBLOCK['headnews'] $value}-->
   
3.     <h5><a href="$value[url]">$value[subject]</a></h5>
   
4.     <p><strong>$value[message]</strong></p>
   
5.     <!--{/loop}-->

复制代码

上面的调用看懂了的话,这个就简单多了,要说明的就是:调用等级为5级grade/5,调用频道为catid/1"市场动态"



最后说文章列表调用那个:

1. <!--{block name="spacenews" parameter="grade/1,2,3,4,5/catid/1/order/i.dateline DESC/limit/0,10/cachetime/900/cachename/dt/tpl/subject_li"}--><!--市场动态-->

复制代码

说明:等级为1,2,3,4,5.调用频道1里面的所有内容,文章为10条limit.0,10


OK啦!二级频道文章,调用全部结束

[ 本帖最后由 showzly 于 2007-7-12 16:41 编辑 ]

你们都喜欢幻灯啊。呵呵