搭建博客网站是个人进入互联网世界的最常见方式之一。伴随着网站技术的发展,如何搭建博客网站已经变得非常容易了。当然,你可以选择诸如 新浪博客、CSDN、博客园 之类的大型网站,快速创建依赖于大平台的个人博客,不过这种方式的不足是言论受限太多、无法触及网站底层技术。所以,对于想要自由发挥创意、又期望对网站拥有更多主动权的话,最好还是选择自己去亲手搭建一个网站。

本文来源:魚立说。本文链接:https://www.yulisay.com/d/kljqu.html,支持微信浏览器打开。

更多精彩文章,请移步 魚立说个人网站 翻看。欢迎欣赏,吐槽不足之处。


本主题将围绕博客网站的搭建流程、不同的博客搭建技术及其流行的风格主题展开,整个系列由以下三个文章部分组成:

  • 当下流行的博客技术栈
  • Hexo 及其流行的风格主题(后更)
  • Hugo 及其流行的风格主题(后更)

快速搭建博客网站的一种基本思路是:利用 Hexo、Hugo 等技术生成静态网页,然后将这些网页部署到 GitHub Pages,后续的静态内容更新需要重新生成。也有另一种传统的基本思路是:搭建 Typecho、WordPress 等博客系统,通常会有前后端两套支撑系统。

下面就几种流行的搭站技术模式,进行了整理:

Hexo + GitHub Pages

Hexo 是基于 Node.js 技术栈开发的,是非常适合前端童鞋的一种建站选择。类似的开源博客平台,还有基于 Node.js 构建的 Ghost。关于 Hexo 的基础知识和风格主题,见本主题下一篇文章。

生成 Hexo 静态网页

安装 Hexo 运行环境,并初始化 Hexo 项目后,我们需要对 Hexo 进行全局配置,个性化你自己的博客,比如将配置 _config.yml 修改为:

# Site
title: 一个行者 | 我的个人博客
subtitle: ''
description: '拥有个人网站,就好像拥有了互联网的一小部分。'
keywords: 一个行者,个人博客
author: 一个行者
language: zh-CN
timezone: 'Asia/Shanghai'
……

然后,创建若干文章后,执行 hexo g 命令后,会在 public 文件夹中生成我们需要部署的静态网页。

部署到 Github Pages

你需要有一个 GitHub 账号,并新建一个 public 类型的 repository,直接命名为 <GitHub 用户名>.github.io。这里以我的 GitHub repository 为例,在该 repository 的 GitHub Settings 中进行如下配置:

图:GitHub Pages 配置

然后,将 public 文件夹中的资源推送到该 repository 中,等待一些时间后,便能通过 https://yulis-say.github.io 域名访问。

图:访问 GitHub Pages

一键部署

为了便捷操作,你也可以使用 Hexo 的一键部署功能。首先,需要安装 hexo-deployer-git:

npm install hexo-deployer-git --save

然后,在 _config.yml 中添加如下配置(如果有已存在的请删除):

# Deployment
deploy:
  type: git
  repo: git@github.com:your-github/your-github.github.io.git
  branch: main

运行hexo clean && hexo deploy,将 public 目录中的文件和目录推送至远端仓库和分支中。查看 https://your-github.github.io 上的网页是否部署成功。

Hugo + GitHub Pages

Hugo 是使用 Go 编写的快速而现代的静态站点生成器,是非常适合后端童鞋的一种建站选择。关于 Hugo 的基础知识和风格主题,见本主题后面的系列文章。

生成 Hugo 静态网页

安装 Hugo 运行环境,并初始化 Hugo 项目后,我们需要对 Hugo 进行全局配置,个性化你自己的博客,比如将配置 config.toml 修改为:

title = "一个行者 | 我的个人博客"
……

然后,创建若干文章后,执行 hugo -t even 命令后,会在 public 文件夹中生成我们需要部署的静态网页。

部署到 Github Pages

部署方式同 Hexo ,请见 “部署到 Github Pages” 部分,这里不再赘述。

Typecho、WordPress 等

Typecho、WordPress 等博客系统,更多的是基于传统的 HTML/CSS/JavaScript+PHP 语言开发的。类似的建站系统,还有 EmpireCMS、PHPCMS、DedeCms、Drupal、Z-Blog 等。

Typecho 快速建站

Typecho 是一个基于 PHP 的轻量级动态博客框架,在 LNMP 的基础上可以十分容易的搭建起来,并且具有良好的性能及可扩展性。

与大多数的博客程序相同,安装 Typecho 需要根据安装向导依次完成即可。将解压后的源码上传至服务器 web 目录,然后使用浏览器直接访问进行安装:

图:安装 Typecho

安装完成后,进入后台按提示更改登录密码,访问浏览器就可以看到效果了,下面是 Typecho 的前台系统和后台系统:

图:Typecho 的前台系统

图:Typecho 的后台系统

此外,Typecho 也有很多优秀的主题和插件可用,可以参考这个网站: https://typecho.me/

WordPress 快速建站

WordPress 是一种使用 PHP 语言开发的博客平台,也可以当作一个内容管理系统(CMS)来使用。免费开源,在 GNU 通用公共许可证下授权发布。

由于 WordPress 的历史较长,很久以前就被很多站长、企业使用了,因此使用教程也很丰富,这里就不再啰嗦了。需要说明的是,博客类网站的设计大多相似,因此在使用其他技术建站的时候,可以吸取来自于 WordPress 的设计思路,以及它的众多优秀博客主题。

图:WordPress 的丰富主题

参考链接

将 Hexo 部署到 GitHub Pages

Configuring a publishing source for your GitHub Pages site

Typecho 官网

WordPress 官网