2014年12月快结束的几天,我开始了我的简书仿站生涯。什么是仿站,就是盗版哈,把简书的网站装进自己的服务器口袋里。问我为什么,也没有为什么,只是想做而已(练练手),我想有个自己的博客网站。
仿站的过程由@筑梦百科逍棽客带着我做,这是我第一次接触动态网页开发。本人有静态网页的基础,懂点JS,最近又在学PHP,但是对于动态网页还算零基础的。因此,逍老师负责制作然后讲解制作过程,我负责记录整理报告以及撰写网站更新日志。在不断整理报告,查阅资料以及实际操练的过程中,慢慢了解了一些事情。以下是我整理的简书仿站报告(一)的内容,其他(二)、(三)等更多内容会陆续整理出来。由于本人是初学者,在撰写的过程中对于一些专业术语难免有理解不当之处,希望各位指正包涵。
我们用的是Wordpress建站的,Wordpress是使用PHP语言开发的博客平台,PHP是一种服务器端的,嵌入Html的脚本语言。客户端的浏览器是看不见这种PHP文件的,浏览器能看见的一般都是Html、Css、JS的文件。因此PHP的动态网站不像静态网站,直接在Dreamweaver里写html文件,然后用浏览器运行就可以看见网页效果,它需要搭建环境。
仿站前要准备的事项
1.搭建服务器环境
搭建服务器环境。有两种办法,两种办法我都用了,第一种就是去找服务器厂商购买服务器和域名。我是在中国互联购买的服务器,我还购买了域名。这家的服务质量很好,除了不是24小时的客服在线QQ,其他没话说。买了服务器以后,我得到了一个服务器的IP地址,和用户名密码。然后就按照服务器厂商官网的说明,在在线客服的帮助下,把域名和IP地址关联绑定。另外,我想说,我买的服务器是香港的,不是国内的,所以网站打开的时候会比国内的要慢一点,但是不用注册备案。
第二种办法就是搭建本地服务器环境,网上有一堆教你如何搭建LAMP环境的方法(LAMP下面讲),搜一下就有了,但是有点复杂,我用的是逍老师推荐的一站式服务器搭建方法,下载PHPnow-1.5.6,然后点击Setup.cmd安装就可以了。这个本地服务器一般是用来进行测试用。初学者我建议还是用PHPnow吧。当然,你还可以用其他的一站式搭建服务器的软件。看这文《9款一键快速搭建PHP运行环境的好工具》。
2.什么是LAMP
LAMP是一种解决方案,除了这个还有WAMP、MAMP等。但是相对价格低廉,是最好的用于搭建动态网站的服务器环境。LAMP指的是Linux(操作系统)、Apache(HTTP服务器)、MySQL(数据库软件)和PHP(有时也指Perl或Python)的第一个字母组成。
3.安装Wordpress
到Wordpress官网下载WordPress安装包。然后把它放进服务器里面,如果你是购买服务器的话,就用FlashFxp,将WordPress安装包上传到自己购买的服务器上去,放在主目录下,比如我的话,主目录是wwwroot,就放在那里(不知道主目录的可以去问服务器厂商)。注意,是WordPress安装包里头的所有文件,不是整个安装包文件夹。如果你是用PHPnow安装的本地服务器,只要把WordPress的整个安装包文件夹拷贝到你的PHPnow中的【htdocs】文件夹下面就可以了。然后在地址栏中输入:127.0.0.1/wordpress 打开就可以安装了,购买服务器的,在地址栏中输入你的网站域名,打开就可以安装了。
关于WordPress怎么安装,可以百度,或者看看这篇:《WordPress入门之如何安装WordPress》。我就不讲了,很简单。但是值得注意的是,在WordPress中注册的用户名和密码最好记住,如果你是搭建的本地服务器的话,因为不能点击“忘记密码了?”重新修改,很麻烦,到时候碰到你就知道了,需要修改一些配置文件。一站式服务器搭建环境一般都是给你设置好一些配置参数,不用你自己设置。除非你不是初学者,可以去查查如何自己搭建LAMP,自己设置参数。
以上就是准备工作,下面就开始仿站啦!
WordPress建站,其实主要是建WordPress的主题。如何将静态的Html文件,变成动态的PHP文件,将静态的页面与WordPress的后台管理系统关联起来。
1.在你的主目录中找到wp-content/themes,在里面新建一个文件夹,命名为"jianshu"。
2.打开简书的首页,在浏览器菜单栏中【文件】——保存网页。就得到了一个存有简书首页所有文件的文件夹,和一个html网页文件。将html文件改成index.php,放进上面说的主目录中的jianshu文件夹中,并且把存有简书首页所有文件也全部放进去。
3.在jianshu文件夹中新建一个style.css。作为简书网页的主样式文件。把下面的代码复制进style.css中,保存。内容可以自己写,但用英文。
@charset "utf-8";
/*
Theme Name: jianshu
Theme URI:
Description: just a test blog
Author: hexiaoyin
Author URI:www.designnote.cn
Version: 1.0
Tags: Jianshu, blog
*/
4.做一张图片,大小大致是334*271px的,保存为PNG格式,命名为screenshot.png,放进jianshu文件夹中。这个图片是作为主题介绍的图片。
5.然后打开127.0.0.1/wordpress/wp-admin,(如果是本地服务器的话)。如果是购买的服务器的话,你的域名/wp-admin,比如我的话是www.designnote.cn/wp-admin。进入登入后台,输入你注册的WordPress用户名和密码登陆你的WP后台。选择【外观】-【主题】,就可以看到你刚刚建的主题了,启用它就可以了。
6.打开127.0.0.1/wordpress/(本地服务器的话),购买服务器的话,打开你的域名,看看简书首页有没有了。你可能会发现页面有是有了,但是内容散架了,或者图片不显示之类的,这是图片、或者CSS文件等的相对地址错误了,这是下次要讲的内容。
今天就介绍到这里,下一篇介绍简书首页怎么做~
下一篇:
《简书仿站报告(二):如何实现首页基础功能》
《简书仿站报告(三):关于WordPress建站的原理二三事》
《简书仿站报告(四):如何制作文章详情页》