首页 Dede网站模板制作指南

Dede网站模板制作指南

举报
开通vip

Dede网站模板制作指南Dede网站模板制作指南 1 目录 1. 简介 2 1.1 目的 2 1.2 参考资料 2 1.3 概述 2 1.4 系统配置 2 2. 网站安装 3 3. 网站的设计 3 3.1 模板之家的网站模板架构 3 3.2 织梦模板 4 4. 整合 6 4.1 js,images,styles: 6 4.2 制作相应的模板文件: 6 4.2.1 提取index.html中的通用的头部制作成index.htm的头部文件: 7 4.2.2 提取index.html中的通用的底部制作成footer....

Dede网站模板制作指南
Dede网站 模板 个人简介word模板免费下载关于员工迟到处罚通告模板康奈尔office模板下载康奈尔 笔记本 模板 下载软件方案模板免费下载 制作指南 1 目录 1. 简介 2 1.1 目的 2 1.2 参考资料 2 1.3 概述 2 1.4 系统配置 2 2. 网站安装 3 3. 网站的 设计 领导形象设计圆作业设计ao工艺污水处理厂设计附属工程施工组织设计清扫机器人结构设计 3 3.1 模板之家的网站模板架构 3 3.2 织梦模板 4 4. 整合 6 4.1 js,images,styles: 6 4.2 制作相应的模板文件: 6 4.2.1 提取index.html中的通用的头部制作成index.htm的头部文件: 7 4.2.2 提取index.html中的通用的底部制作成footer.htm的底部文件: 10 4.2.3 提取aboutus.html中通用的头部分制作head.htm 10 4.2.4 制作侧面通用的部分 11 4.3 Index.htm 13 4.4 index_article.htm 14 4.5 list_article.htm 15 4.6 list_image.htm 17 4.7 article_article.htm 17 4.8 article_image.htm 17 2 艾森梦主网站 1. 简介 1.1 目的 本文档为织梦网站的制作文档,主要是为了能够把模板之家的优秀网站来整合到织梦模板,以 方便快速的来实现制作网站的目的。 适用对象: Web程序开发者,项目经理,以及相关的测试人员,美工 1.2 参考资料 1.3 概述 此文档主要分为以下三部分,第一部分网站的安装,第二部分为网站的设计,第三部分其它的 相关要求及其注意问 快递公司问题件快递公司问题件货款处理关于圆的周长面积重点题型关于解方程组的题及答案关于南海问题 1.4 系统配置 操作系统:Winxp,win7,win8 可支持的浏览器:IE,firefox,chrome,safari 3 2. 网站安装 因为目前Dede已经是一个非常成熟的模板系统,所以本文不再介绍它的安装,感兴趣同 学可以直接看到本目录下quickstart.pdf文件。 3. 网站的设计 3.1 模板之家的网站模板架构 一般来说从模板之家下载的模板,其架构如下: 其主要三个文件夹是images,js,styles,主要存放着图片,js文件,和样式表。 我们打开一个index.html文件看一下,对这三个文件的引用,都是这样 4 他用的是相对的路径,这个需要后把所有路径将来都要替换成绝对路径,如下所示: 所有的images替换举例如下: 原件: 替换为: 所有js替换举例如下: 原件: 替换为: 上述黑框中主要是把上述三个文件夹放到根目录下的用法,初级版本为了省事我们将暂时先以这种方式 来介绍,后续我们将介绍动态的加载方式。 3.2 织梦模板 下载下相应的 DedeCMS-V5.7-GBK-SP1.tar或者 DedeCMS-V5.7-UTF8-SP1.tar.gz 解压如下 5 其templets的: 6 其中default即为缺省的模板,我们学习的基础可以以default为基础为进行相应的学习。 4. 整合 我们将参考default来整合: 4.1 js,images,styles: 首先把下载模板的三个文件夹: , js , Images , Styles 放到织梦系统的根目录中,并用相应的工具如: html php批量替换工具文字: UltraReplace.exe,执行3.1的动作,把所有html文件的引用js,image,style路径都换掉,如: 原件: 替换为: 4.2 制作相应的模板文件: 其主要的模板文件如下: 2014/08/15 20:36 6,314 article_article.htm:档案模板首页 7 2014/08/15 20:36 6,314 article_image.htm:档案图像首页 2014/08/15 21:30 328 footer.htm:脚文件 2014/08/15 22:12 2,754 footerslide.htm:引用的其它底部文件 2014/08/15 11:52 3,497 head.htm:引用的头文件 2014/08/15 11:52 6,714 head2.htm:引用的头文件 2014/08/17 15:20 10,772 index.htm:首页模板 2014/08/17 15:46 5,187 index_article.htm:首页档案模板 2014/08/15 17:28 6,098 list_article.htm:列表首页模板 2014/08/14 19:34 16,484 list_image - Copy.htm 2014/08/17 14:42 7,580 list_image.htm:列表图像模板 2013/08/18 11:06 1,090 说明.txt 步骤如下: 4.2.1 提取index.html中的通用的头部制作成index.htm的头部文件: 因为头部可能与里边的稍有不同,就是他有一个大的banner文件,我们可以把下边的head.htm嵌入到head2.htm或者单独也可以。 如下:本示例中是head2.htm 那么其导航栏是: 我们需要把它变成从织梦模板来引用的自动生成的,除了Home这个词之外我们都可以改变,假设我们新的目录结构如下: , 首页 , 关于我们 , 产品 , 新闻 , 技术与支持 , 联系我们 其改变如下: 我们以关于我们来举例说明上述各项的含义:
  • {dede:type typeid='1'}[field:typename /]{/dede:type}
  • 10 其中typeid为你登录后台设定的ID:如下图所示: {dede:channel type="son" typeid="1"},这样可以循环把关于我们下边的所有的项目如公司介绍等,自动加载到界面上。 4.2.2 提取index.html中的通用的底部制作成footer.htm的底部文件:
    {dede:global.cfg_powerby/}    {dede:global.cfg_beian/}
    ^ Back to Top
    其中上述黄色部分来自于织梦模板的后台: 系统->系统基本参数中的相关的设定,如果想加电话之类的,也可以直接在后边添加。 本例子中底部还有一个通用导航栏我们提取出来做为footerslide.htm 4.2.3 提取aboutus.html中通用的头部分制作head.htm 具体制作方式参考4.2.1 11 4.2.4 制作侧面通用的部分 这个可以分两部分制作,文档首页的侧边栏和图像首页的侧边栏如index_article.htm的侧边栏 其中的重要部是这部分: {dede:channel row="10" type="sun" col="1" currentstyle= "
  • ~typename~
  • " }
  • [field:typename/]
  • {/dede:channel} 他自动提取各个列表的内容和链接显示在侧面,如下例所示: 以及artile_image.htm的侧边栏: 4.3 Index.htm 这是首页的模板,其重要的地方除了头和尾之外,我只修改了让他动态的加载新闻这一项: 其头部的引用需要做如下修改,使其所有的内容都来自织梦模板,可以用标签生成器来生成。 {dede:global.cfg_webname/} 其公司的动态引用我修改如下:

    Company News

      {dede:arclist typeid=13 row=1}
    • [field:title/]

      [field:description function="cn_substr(@me,140)"/]...

      [field:pubdate function="GetDateMK(@me)"/]

    • {/dede:arclist} 14
    4.4 index_article.htm 这个模板用于在创建第一个列表的时候引用,即在后台你选择这一项的时候会用这个模板: 这里我是随便找了一个除index.html的文件,改上相应的头部、侧边栏以及尾部文件,然后最重要的 是文件中增加这一句:
    {dede:field.content/}
    有了这一句就可以自动显示你的内容了: 如图所示:你就可以在栏目内容中增加想要显示的内容了。 15 4.5 list_article.htm 这个用于新闻列表的展示等,实现这样的效果: 当你选择这个的时候会引用到: 16 其重要的自动引用如下:
    {dede:field name='position'/}
      {dede:list pagesize=12}
    • [field:pubdate function="GetDateMK(@me)"/][field:title/]
    • {/dede:list}
      {dede:pagelist listitem="info,index,end,pre,next,pageno,option" listsize="5"/} 17
    4.6 list_image.htm 此为图像列表页 其实现这个目标: 4.7 article_article.htm 这个文档当你点击新闻中的条目会自动跳转到这个模板上,其主要添加内容如下:

    {dede:field.title/}

    {dede:field name='pubdate' function='GetDateMk(@me)'/}

    {dede:field name='body'/}

    4.8 article_image.htm 目前这个文件没得弄明白,暂时没有做这个
    本文档为【Dede网站模板制作指南】,请使用软件OFFICE或WPS软件打开。作品中的文字与图均可以修改和编辑, 图片更改请在作品中右键图片并更换,文字修改请直接点击文字进行修改,也可以新增和删除文档中的内容。
    该文档来自用户分享,如有侵权行为请发邮件ishare@vip.sina.com联系网站客服,我们会及时删除。
    [版权声明] 本站所有资料为用户分享产生,若发现您的权利被侵害,请联系客服邮件isharekefu@iask.cn,我们尽快处理。
    本作品所展示的图片、画像、字体、音乐的版权可能需版权方额外授权,请谨慎使用。
    网站提供的党政主题相关内容(国旗、国徽、党徽..)目的在于配合国家政策宣传,仅限个人学习分享使用,禁止用于任何广告和商用目的。
    下载需要: 免费 已有0 人下载
    最新资料
    资料动态
    专题动态
    is_083599
    暂无简介~
    格式:doc
    大小:192KB
    软件:Word
    页数:0
    分类:生活休闲
    上传时间:2018-05-01
    浏览量:11