帝国CMS 仿站 实例记录

最近在利用免费的帝国cms来仿站建站以及做适当的修改,来达到自己的独立建站的目的。

今天开始完整记录如何利用帝国cms来仿站以及遇到问题是如何解决的!

好了,开始!

第一步:寻找要仿的目标网站。

前边找了个很简单的静态网站仿制结束了,这次找了个比较复杂的:郑力的个人主页 ,仿下来留着以后说不定会自己改版用~

目标网站:

第二步:下载网页数据。

我自己用的火狐浏览器上的Scrapbook插件,直接页面另存为,一般新建个文件夹方便归类。挨着打开目标网站的每个栏目页及内容页,基本上将这个页面完全保留在本地了。

获取仿站文件

第三步:仿站顺序整体计划、分析。

上次是从首页-栏目页-内容页。感觉效率高点的话还是从栏目页开始。在保存所有页面的时候应该已经大概对所有页面有所了解了,可以看出 简介、联系页面是2个自定义的页面,比较简单;设计、音乐、博文这3个页面是属于比较正规的栏目页面;随机保存了3个内容页分别是设计、音乐、博文对应栏目下的内容页;还有首页属于特殊页面,既有自定义内容也有栏目调用。所以通过这些了解后,对仿页面的顺序大致排列为:

简介、联系、设计、设计内容页(风影博客···)、博文、博文内容页(三十感慨···)、音乐、音乐内容页(汪峰···)、主页

第四步:本地文件整理。

打开下载的文件,网页文件存放位置见上图指示,复制路径在粘贴到文件路径里,回车就可以找到了,其他方法也可以,这里就不多说了;然后对网页文件本地化;简单提下就是把文件里的图片路径及CSS、JS文件路径替换到本地路径就可以了,不会的可以留言加我QQ或者百度下如何本地化网页;最终结果就是把所有页面都本地化处理,这里是我的分类,为了避免命名冲突,我命名为imgs、csss、jss。一个页面本地化整理完后基本就这样。

本地化网页文件存放方式

示例页面:简介 about.html、css、js、imgs 4类文件分别存放。

第五步:进入帝国后台,我喜欢先一次把所有栏目全建立完之后再开始修改。

这里有个小技巧,一般我们会想到简介和联系这2个页面用自定义页面就可以搞定,事实也是这样,但是自定义模板的url一般会显示.html后缀。这样就不太美观了。所有这里我们将除过首页和内容页外的所有页面当作栏目页面来建立。

为什么这2个页面不一样尼?别急,看看设置,因为这2个页面不需要再下面添加其他子内容了,所有我们不选终极栏目,并且在模板选项里选择页面内容式,后台低下就有说明各个模式的不同,可以看看,然后就直接将页面内容复制在下方的编辑框内,保存即可。这样在显示的时候后缀就会与栏目页的一致了!

其他栏目在建立的时候最好先建立内容模板,因为在建立列表模板时要选择对应的内容模板;不会建立模板的可以看看 怎么建立帝国cms的默认模板?

好了,好了到这里模板完全建立完毕了!可以点击栏目页面,看到的页面是不是有些熟悉尼?对的,这和我们在本地化网页时是一样的。缺失了CSS文件及其他图片。同样是因为路径不对。进入下一步!

第六步:将本地建好的文件拷贝到或者上传到网站根目录下。

这里需要特别注意下,因为我们每个页面都有独立的imgs、csss、jss文件夹,所以会产生覆盖,这时就要多留心,覆盖时同名文件是否是同一文件,图片的方面辨别,但是JS文件就要特别注意,一般我个人在这一步的时候会选择先不上传JSS文件夹,看看是否所有网页都正常 ,如果正常那就直接删除所有js即可,有影响的话则把同名文件大小比较,内容比较,判断一致后覆盖或者改名。基本上同名的文件是一致的。但是也不排除有差异。最后所有页面的imgs、csss、jss都统一集合到这3个文件夹内。这时候将首页进行更新。可以看看是不是正常。到这里,可以算一个完全静态的页面已经出来了。我是在本地制作的,打开localhost 可以看到首页已经完全正常。

第七步:栏目页路径替换。

首页正常了,但是栏目页还是有问题,为什莫尼?细心的人在拷文件的时候应该已经觉察到,栏目页静态页面是存放在对应得文件夹内的,比如contant页面是存放在contant文件夹下,那么我们在本地调试的路径就有问题了,少了一层,所有在栏目里的静态文件有调用的地方需要统一加上“ ../ ”表示返回上级路径。调整完后,每个栏目页就正常了,注意JS有用无用和覆盖的问题。(到这里我突然想到在本地化时可以将其他栏目页在一开始的时候就存放在文件夹内,这样到这一步就可以省略了)