织梦仿站系列教程.docx

织梦仿站系列教程.docx

《织梦仿站系列教程.docx》由会员分享，可在线阅读，更多相关《织梦仿站系列教程.docx（76页珍藏版）》请在冰豆网上搜索。

织梦仿站系列教程

织梦仿站系列教程第一讲——准备工作  

2011-08-2917:

56:

29|  分类：

dedecms教程|  标签：

|字号大中小 订阅

首先，我们找一个目标网站，以便我们来仿制。

经过福星网络的寻找，确定以拳击在线（QuanJ）为目标站来完成织梦模板的仿制教程。

其次，关于以后教程的一些说明：

1、将目标站网页另存为，会得到一个网站，及相关的文件夹。

里面有相关的图片，样式和JS文件。

我们需要将这些文件复制到织梦模板的相关文件夹下。

在这个系列教程中，此文件夹为templets\fuxing5。

2、我们会制作一个通用的头部和底部，以便全站调用。

所以我们会优先制作头部和底部。

3、朋友们需要有HTML知识，还有DIV+CSS的一些知识才行。

4、不断更新。

。

。

最后，希望朋友们跟着我们一步一步的做，学会织梦的仿站。

呵呵，别人的教程可是收费的哦!

织梦仿站系列教程第二讲——首页框架  

2011-08-2917:

57:

12|  分类：

dedecms教程|  标签：

|字号大中小 订阅

首先，打开目标站拳击在线（QuanJ），然后将网页保存到本地。

如图：

保存类型选择网页，全部（*.htm;*.html）。

如下图所示：

将织梦（DEDECMS）的默认模板文件夹复制一份，以备做在模板制作时做为代码参考。

然后打开保存文件夹，如下图中箭头所指的文件夹：

将文件夹中的文件归类，将CSS文件拷贝到templets\default\style目录下，将JS文件拷贝到templets\default\js，将图片文件拷贝到templets\default\images。

接着用网页编辑器软件FrontPage或者Dreamweaver打开刚刚保存的拳击在线网页文件和templets\default目录下的index.htm（首页）、head.htm（通用头部）、footer.htm（通用底部）。

还要打开刚刚备份的默认模板首页文件templets\复件default\index.htm。

先清空index.htm文件，将拳击在线网页代码拷贝到里面。

接下来，就是正式的代码修改了。

一行一行的来修改。

首先将CSS样式表的路径修改成织梦的CSS路径代码（从备份的默认首页文件中拷贝），如下图所示：

保存网页，进入织梦后台，在后台的右上部，点击网站主页，查看前台演示：

通过上图可以看出，样式是正确了，但好多图片没有显示，这主要的原因是好多图片没有下载下来，或者是图片路径没有修改，这些我们在下一讲中进行替换。

织梦仿站系列教程第三讲——路径问题  

2011-08-3011:

22:

52|  分类：

dedecms教程|  标签：

|字号大中小 订阅

在第二讲中，前台预览时，好多图片不显示，造成不显示的原因是有两个：

一是网页里调用图片的路径问题；一是样式表里调用图片的路径问题。

网页里的图片路径（在这一讲中说到的图片，是指模板中所用到的图片，不包括网站内容中用到的图片）是这样的：

1.{dede:

global.cfg_templets_skin/}/images/logo.gif 

 {dede:

global.cfg_templets_skin/}/即网站设置的当前模板的目录，即default。

为了利于区别，我们将default重命名为fuxing5。

然后进入织梦后台，依次点击系统->系统基本参数。

在右侧处的模板默认风格输入框里的内容修改为fuxing5。

如图所示：

点击确定，更新缓存。

用编辑软件打开第二讲中的所有文件，修改里面的图片路径，可以使用替换功能来批量替换图片路径，用如下代码

1.src="{dede:

global.cfg_templets_skin/}/images/ 

替换

1.src="拳击在线%20-%20QuanJi_Cn%20%20致力于打造最大最全拳击门户！

_files/ 

保存网页，查看前台。

不好，提示找不到模板文件。

我们忘记修改首页默认模板文件了！

依次点击生成->更新主页HTML。

在选择主页模板后面点击浏览，选择fuxing5目录下的index.htm。

如下图所示：

点击更新主页HTML。

再次查看前台，刷新一次！

呵呵，有点意思了，下面就缺样式表里的图片了。

打开样式表，将样式表里的图片路径由

1.BACKGROUND:

 url（yg_bg.gif） 

修改为

1.BACKGROUND:

 url（../images/yg_bg.gif） 

我们是以此图片为例，大家不要误解啊，是在图片名前加../images/。

批量替换后，再次查看前台，你会奇怪，怎么和目标站还是有区别呢？

这里告诉大家一个不幸的消息，模板里所需要的大量的图片没有下载下来，需要我们一个一个的下载下来。

最简单的方法是，在目标网站上点击右键，选择背景另存为。

这个图片的下载方法不用我教了吧？

当所有图片都下载到templets\fuxing5\images目录下后，再将刷新一下前台。

看下效果吧！

差不多都显示了！

好了，我们这第三讲也就结束了，第四讲开始真正意义上的仿站的代码修改了。

织梦仿站系列教程第四讲——首页页首代码  

2011-08-3121:

46:

34|  分类：

dedecms教程|  标签：

|字号大中小 订阅

今天，我们接上一讲，继续开始我们的仿站之路。

这一讲分两个部分，第一部分，修改首页的页首代码，即之间的代码。

有网页标题title、网页关键字keywords、网页描述description，织梦的这三项是（单指首页）：

1. 

2. 

3.

global.cfg_description/}> 

4.

global.cfg_keywords/}> 

代码解释：

网页标题调用的是网站名称，后台->系统->系统参数设置，如下图所示：

网页关键字和网页描述调用的是站点默认关键字和站点描述，后台->系统->系统参数设置。

如下图所示：

这一节内容不多，很简单。

大家不要着急，心急吃不了热豆腐。

慢慢来，下一讲我们讲通用头部的制作。

织梦仿站系列教程第五讲——通用头部

（一）  

2011-09-0120:

32:

35|  分类：

dedecms教程|  标签：

|字号大中小 订阅

上一讲修改了页首的代码，这一讲，我们讲通用头部的制作。

首先找到全站共用部分，然后把共用部分放在通用头部head.htm文件中，这样我们可以节省很多的工作量。

开始工作，查找共用部分。

我们打开拳击在线，发现全部共用部分是从最顶部到网站搜索那一行，如图所示：

我们在网页代码中查找这一部分代码，将其覆盖到head.htm文件中，替换掉的代码。

查找代码这部分任务，需要有一定的HTML知识了，大家有时间还是要看一些HTML的基础知识。

别忘记了，把共用部分复制到head.htm以后，将index.htm文件中的这部分共用代码用

1.{dede:

include filename="head.htm"/} 

来替换。

然后查看一下前台。

如果前台乱了，说明你刚才的步骤出错了，需要重新来过。

如果和第三讲时的效果一样，说明你成功了，可以继续仿站工作了。

查看head.htm代码，可以看到，拳击在线的登陆框是调用一个静态文件loginjs.htm，我们找到这个文件。

在你保存网页文件的目录中，如下图所示：

 打开后，我们发现，这个是个JS文件，我们将其转化业html文件格式。

这个好多站长工具提供此服务。

将转换后的代码复制到head.htm中，覆盖如下代码：

1.

global.cfg_templets_skin/}/images/loginjs.htm"> 

接下来就要修改这段代码使之成为织梦的登陆框代码了，这个有点复杂，我们放在下一节单独讲解。

往下走，是加入收藏等链链。

找到下面的代码：

1. 

2.

3.

4.

5.

6.

7.

8.