注意:此文档中出现所有的类,都是公司内部的,也就是说,只是给公司内部人员培训的一篇文章而已,如果其他的人看到了,

看不懂里面的类,那是因为这都是我公司内部的框架。

首先是进入我们的系统的后台,然后选择相对应的站点。

 

 

ASP.NET CMS模板培训教程

这样就可以在对应的站点下面,去进行对应的的操作了。

本文只会去解释一些基础的功能。

站点管理

如下图所示:

ASP.NET CMS模板培训教程

 

这个是建立站点,上图显示了几个站点那么这里就有几个站点。

我们随便打开一个站点来做解释,其中*号的是必填项:

站点名称:站点的名称

站点标题:英文字母组成

虚拟目录:在服务器上的虚拟目录的名称(不可重名)

站点网址:英文名称,访问站点的地址,比如一个站点叫WWW.XXX.COM,子站点地址为NHXC,则这个网站的访问地址为wwww.xxx.com/NHXC

IIS设置:一般选择第一个,因为为虚拟目录(上面设置过)

注意:为了以后维护方便,建议把站点标题,虚拟目录,站点网址设为同样的。

 ASP.NET CMS模板培训教程

 

信息类别

这里的信息类别是和栏目相关的,这里做一下简单的介绍。

ASP.NET CMS模板培训教程

这里的信息类别,和站点设计下的栏目管理下的一一对应。

ASP.NET CMS模板培训教程

稍后会讲到这个信息类别的作用。

下面是信息类别的界面,唯一需要注意的地方就是父类别别选错了,要注意下

ASP.NET CMS模板培训教程

此类别下的后面几个功能因为很少用到,暂时不做介绍

站点设计

栏目管理

下面是概览图

ASP.NET CMS模板培训教程

 

下面就几个基本的功能点进行介绍:

新增栏目:在当前选择的栏目下新增子栏目

ASP.NET CMS模板培训教程

栏目标题:栏目的标题

关联类别:里面有类别,专题,推荐,头版头条等,一般情况下选择"类别",

选择类别以后,右边的按钮由灰色变成可选状态,单击选择按钮,如下图,选择对应的类别,这个类别,就是站群管理下信息类别里新增的类别,记得要一一对应哦。

ASP.NET CMS模板培训教程

 

设置好了类别以后就会出现如下的界面。

可以看到信息类别和栏目是一一对应的

ASP.NET CMS模板培训教程

 

设置栏目模板:设置栏目的显示所用到的模板,后面的模板章节会提到。下面为预览图:

ASP.NET CMS模板培训教程

设置内容模板:设置此栏目下的文章的内容所对应的模板,下面为预览图:

ASP.NET CMS模板培训教程

 

其中的分配按钮和设置栏目模板是一个意思,内容模板一样的

ASP.NET CMS模板培训教程

 但是有一点要记住,如果你新建了一个栏目,要把这个栏目显示出来,必须分配栏目模板和内容模板,这点要记住。

 

模板编辑

这是是重中之重,也是会最详细解释的一个地方。

这么多模板,是不是眼花了呢,别急,我的打算是结合模板的实例来进行代码的讲解。

ASP.NET CMS模板培训教程

下面开讲吧:

新增:新增一个模板文件夹

修改:修改模板文件夹的名称

删除:删除一个模板文件夹(注意:这里如果删除了文件夹,文件夹下的模板都会被删除,删除前一定要慎重考虑,因为没了模板文件,网站会显示不出来)

排序:给文件夹排序

新增模板:在选中的文件夹中新增一个模板文件。

删除模板:删除一个模板文件。

ASP.NET CMS模板培训教程

 我们随便打开一个文件夹,比如改版热点专题下面的天心文明创建,我们就可以打开相应的文件夹并查看里面的模板文件。

ASP.NET CMS模板培训教程

点一下预览按钮的话,会弹出新窗口,可以进行模板的预览,不然我们点击这个天心文明创建首页模板。

ASP.NET CMS模板培训教程

 

想要编写模板,我们首先需要了解哪些东西是动态生成的,哪些是静态的。只有明白了哪些是动态生成的,我们才能编写出自己需要的模板。

如下图:

1,2,3,4我已经标示出来了,当然还有更多的模块,我这里只是做一个示例而已。我们来分析一下下面一张图。

1.很明显是一个导航栏,这个导航栏对应着“栏目”,也就是说在这个大栏目下的一些子栏目,我在后台添加了哪些栏目,这里就会显示哪些栏目。

2.图片导航栏:对应着某个栏目下的文章的一个图片的跳转URL(后面会提到),后面会做详细的介绍。

3.很明显,就是一个文章的列表,列出了这个栏目下的文章有哪些,后面跟着日期,4和3类似,就不一一介绍了

ASP.NET CMS模板培训教程

 

下面开始介绍一下,模板的具体编写,我先把功能点一一罗列出来,我们再用几个例子来结束。

选择天心文明创建,点击新增模板。

打开新增模板对话框。

ASP.NET CMS模板培训教程

选择模板:如果你把一个模板写好了,想嵌套到另一个页面里面(比如首页),你就可以选择模板,说白一点,就是把你选择的模板里的内容100%的原封不动的嵌套到其他的文件里,当然你也可以选择不用模板,但是,这样维护起来就很困难了哦~~

选择好模板以后,点击插入按钮,就可以插入一段模板代码了。

ASP.NET CMS模板培训教程

代码如下:

<%=Include( "~/模板文件夹/改版热点专题/天心金融/机构职责数据源.tpl" )%>

这在首页里很常见哦,下面我先贴一段首页模板的代码出来大家就懂了。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312"/>
<title>天心文明创建</title>
<link rel="stylesheet" type="text/css" href="~/txwmcj/css/style.css"/>

<script type="text/javascript" src="~/txwmcj/js/jquery.js"></script>

</head>

<body>
    <div class="header"><img src="~/txwmcj/images/hbg.jpg" width="1002" height="296" title="" /></div>
<div  align="center">
<img src="~/images/banner1.jpg" width="1000" height="90" />
</div>
    <div class="imenu">
        <ul>
         <%=Include( "~/模板文件夹/改版热点专题/天心文明创建/首页菜单导航栏.tpl" )%>
            </ul>
    </div>
    
    <div class="content">
        <div class="conDiv">
        <!-------one---------->
             <div class="cdiv">
             
                <div class="showimg rightbox">
                    <!--  <img START>-->           
                     <div id="slideBox">
                    
   <%=Include( "~/模板文件夹/改版热点专题/天心文明创建/图片新闻数据源.tpl" )%>        
                                              
                    </div>
                    <!--  <img END>-->
                </div>
                    
              
                
                <div class="bobao">

<%=Include( "~/模板文件夹/改版热点专题/天心文明创建/文明播报数据源.tpl" )%>
                   
                </div>
                
                <div class="jieri">
                    <div class="jieri_info">
<%=Include( "~/模板文件夹/改版热点专题/天心文明创建/我们的节日数据源.tpl" )%>
                  </div>
                    <div class="av2">
                        <a href="~/Intercourse/LeadMail/Default.aspx" target="_blank"><img src="~/txwmcj/images/img1.jpg" width="234" height="64" title="" /></a>
                        <a href="~/i/27a29abfe4e242b59fd8e8b65dc0ee.html" target="_blank"><img src="~/txwmcj/images/img2.jpg" width="234" height="64" title="" /></a>
                    </div>
                </div>
             </div>
        <!-------one--end-------->
         <!-------2---------->
             <div class="cdiv">
             <!--cdivLeft-->
                 <div class="cdivLeft">
                    <div class="av"><img src="~/txwmcj/images/av2.jpg" width="660" height="52" title="" /></div>
                   
                    <div class="item">
                         <%=Include( "~/模板文件夹/改版热点专题/天心文明创建/文明城市数据源.tpl" )%>
                        
                    </div>
                    <div class="item">
                        
<%=Include( "~/模板文件夹/改版热点专题/天心文明创建/文明村镇数据源.tpl" )%>
                      
                    </div>
                     <div class="item">
<%=Include( "~/模板文件夹/改版热点专题/天心文明创建/文明单位数据源.tpl" )%>                        
                    </div>
                     <div class="item">
<%=Include( "~/模板文件夹/改版热点专题/天心文明创建/文明社区数据源.tpl" )%>
                    </div>
                </div>
              <!--cdivLeft--end-->
              <!--cdivRight-->   
                <div class="cdivRight">
                    <div class="news">
                        <%=Include( "~/模板文件夹/改版热点专题/天心文明创建/通知公告数据源.tpl" )%>
                    </div>
                    <div class="news">
                        <%=Include( "~/模板文件夹/改版热点专题/天心文明创建/道德模范数据源.tpl" )%>
                    </div>
                    <div class="news" style=" background:url(~/txwmcj/images/box4.jpg) no-repeat;">
                        <%=Include( "~/模板文件夹/改版热点专题/天心文明创建/志愿服务数据源.tpl" )%>
                    </div>
                </div>
                <!--cdivRight--end-->
                
             </div>
        <!-------2--end-------->
        <div class="foot">
            <center>
     <p>主办单位:天心区人民政府  承办单位:天心区人民政府电子政务管理办公室  联系电话:0731-85899000</p>
    <p>备案序号:湘ICP备09003224号 最佳使用效果:1024*768分辨率/建议使用微软公司IE6或以上</p>
            </center>
        </div>
        </div>
    </div>
    
<script type="text/javascript" src="~/txwmcj/js/showbox.js"></script>
</body>
</html>
首页代码

相关文章: