如何利用Typecho搭建一个PLOG

为什么要搭建Plog? 点我展开/收起内容

Blog,这是最原始的博客形式,以文字为主要内容。 然后随着技术进步,出现了视频博客 Vlog。它吸收了音视频元素,内容更丰富生动。 最后随着生活快节奏的快速增长,由于长视频拍摄和观看时间成本较高,人们转而更喜欢随时将生活中的瞬间进行抓拍。所以图片博客 Plog 就应运而生了。 既然是纯图片类型的站点,那我们这次就选择Typecho的一个主题-TimePlus,在这里感谢Github开源社区的张洪Heo大神的贡献。

环境准备:

  • VPS一台 最低配置1核1G 带宽1M即可
  • 服务器系统:本文演示的系统是ubuntu20.04(LTS)
  • 是否备案:如果服务器在国外,站点无须备案;如果服务器在国内,网站必须备案。
  • 域名一个
  • 图床一个(又拍云、阿里云oss、腾讯云cos、七牛云等)
  • 为了便于后期的升级维护以及卸载,利用docker+Nginx Proxy Manager来部署Typecho
  • 安装好Docker、Docker-compose、Nginx Proxy Manager(安装教程
  • SSH工具:FinalShell官网

部署过程:

一、系统初始化,更新索引

#更新索引库
sudo apt-get update

二、创建Typecho容器

#在root目录下递归的创建一些文件夹,如果父目录不存在则先创建出来
mkdir -p /root/data/docker_workspace/typecho

#进入到typecho目录下
cd /root/data/docker_workspace/typecho

三、创建mysql.env文件

#创建mysql.env文件
touch mysql.env

将如下内容复制进去保存(记住这些自定义的配置信息,后面安装需要填写)

#以下4个参数请自行修改
MYSQL_ROOT_PASSWORD=root
MYSQL_DATABASE=typecho_db
MYSQL_USER=typecho
MYSQL_PASSWORD=password

四、PHP的安装

#确保在typecho路径下
cd /root/data/docker_workspace/typecho

#创建php文件夹
mkdir php

#进入php文件夹
cd php

#创建Dockerfile文件
touch Dockerfile

将如下内容复制进去保存

#如果使用MySQL作为Typecho的数据库,需要安装此扩展,并设置buffer为4kb,即一个内存页

FROM php:7.3.29-fpm
RUN apt-get update \
    && docker-php-ext-install pdo_mysql \
    && echo "output_buffering = 4096" > /usr/local/etc/php/conf.d/php.ini \
    && echo "date.timezone = PRC" >> /usr/local/etc/php/conf.d/php.ini

五、安装nginx(Nginx Proxy Manager前期也必须安装)

#确保进入typecho文件夹路径
cd /root/data/docker_workspace/typecho

#创建nginx文件夹
mkdir nginx

#进入该文件
cd nginx

#创建default.conf文件
touch default.conf

将如下内容复制进去保存

# 配置一个默认的HTTP服务器块,监听80端口
server {
    listen 80 default_server;
    # 设置网站根目录
    root /var/www/html;
    # 默认文档文件为index.php
    index index.php;

    # 记录访问日志到指定文件
    access_log /var/log/nginx/typecho_access.log main;

    # 如果请求的文件不存在,将请求重写到index.php处理
    if (!-e $request_filename) {
        rewrite ^(.*)$ /index.php$1 last;
    }

    # 处理网站根目录下的请求
    location / {
        # 指定默认文档文件列表
        index index.html index.htm index.php;

        # 如果请求的文件不存在,将请求重写到index.php处理
        if (!-e $request_filename) {
            rewrite . /index.php last;
        }
    }

    # 处理以.php结尾的文件请求
    location ~ \.php(.*)$ {
        # 将请求转发到PHP-FPM服务器
        fastcgi_pass   php:9500;
        # 指定fastcgi的默认索引文件为index.php
        fastcgi_index  index.php;
        # 设置PATH_TRANSLATED变量
        fastcgi_param  PATH_TRANSLATED $document_root$fastcgi_path_info;
        # 分割fastcgi的路径信息
        fastcgi_split_path_info  ^((?U).+\.php)(/?.+)$;
        # 设置PATH_INFO变量
        fastcgi_param  PATH_INFO  $fastcgi_path_info;
        # 设置SCRIPT_NAME变量
        fastcgi_param  SCRIPT_NAME $fastcgi_script_name;
        # 设置SCRIPT_FILENAME变量
        fastcgi_param  SCRIPT_FILENAME $document_root$fastcgi_script_name;
        # 包含fastcgi参数
        include        fastcgi_params;
    }
}

六、Typecho源码下载

#确保进入下面的路径
cd /root/data/docker_workspace/typecho

#创建typecho文件夹
touch typecho

#下载typecho源代码
wget https://github.com/typecho/typecho/releases/download/v1.2.0/typecho.zip

#安装zip依赖工具
apt install zip -y 

#解压缩下载好的源码包
unzip typecho.zip

七、配置typecho的docker环境依赖文件

version: "3"

services:
  nginx:
    image: nginx
    ports:
      - "8550:80"    # 左边可以改成任意没使用的端口 
    restart: always
    environment:
      - TZ=Asia/Shanghai
    volumes:
      - ./typecho:/var/www/html
      - ./nginx:/etc/nginx/conf.d
      - ./logs:/var/log/nginx
    depends_on:
      - php
    networks:
      - web

  php:
    build: php
    restart: always
    expose:
      - "9500"       
    volumes:
      - ./typecho:/var/www/html
    environment:
      - TZ=Asia/Shanghai
    depends_on:
      - mysql
    networks:
      - web

  mysql:
    image: mysql:5.7
    restart: always
    environment:
      - TZ=Asia/Shanghai
    expose:
      - "3506"  
    volumes:
      - ./mysql/data:/var/lib/mysql
      - ./mysql/logs:/var/log/mysql
      - ./mysql/conf:/etc/mysql/conf.d
    env_file:
      - mysql.env
    networks:
      - web

networks:
  web:
#查看8550端口是否被占用,回车后没有任何显示,则说明没有被占用,反之请更换端口
lsof -i:8550  

八、启动Typecho容器

docker-compose up -d 

九、php自定义的端口9500添加到防火墙规则中(VPS管理后台也要开通这个端口)

sudo ufw allow 9500

十、Nginx Proxy Manager开启反代

  • 去域名供应商后台先将域名解析到服务器上
  • 进入Nginx Proxy Manager后台将绑定域名和端口,申请ssl证书

十一、Typecho管理后台访问

网页通过绑定的域名或者ip:9500的方式访问

十二、Typecho后台配置

数据库地址:mysql
数据库用户名:typecho
数据库密码:参考第三步的mysql.env配置信息
数据库名:typecho_db

点击确认,开始安装的按钮

十三、初始化配置报错😭

  • 点击安装后会报错,请按照提示操作。现将复制的代码保存到一边,等会要用

根据报错提示手动创建config.inc.php文件

#确保进入如下路径
cd /root/data/docker_workspace/typecho/typecho

#创建config.inc.php文件
touch config.inc.php
  • 将前面复制的报错代码拷贝到config.inc.php文件中保存,然后回到报错页面就可以继续了

十四、下载Typecho主题

TimePlus主题下载

十五、上传主题到服务器里

  • 将解压后的主题文件夹上传到Typecho的/usr/themes/下

十六、TimePlus主题使用😁

  • 在Typecho后台导航栏的【控制台】->【外观】界面中,启用TimePlus主题。
  • 在Typecho后台导航栏点击【撰写】,在自定义字段中填写图片地址。并填写文章标题和内容,即对应为图片的标题和简介。
  • 在Typecho后台导航栏的【设置】->【阅读】调整每页文章显示替换为 999
  • 图片优化教程

十七、Typecho后续更新

# 进入docker-compose所在的文件夹
cd /root/data/docker_workspace/typecho  

# 拉取最新的镜像
docker-compose pull    

# 重新更新当前镜像
docker-compose up -d   

十八、Typecho卸载

# 切换到root
sudo -i  

# 进入typecho文件夹
cd /root/data/docker_workspace/typecho 

# 停止typecho容器,此时不会删除映射到本地的数据
docker-compose down    

# 完全删除映射到本地的数据
rm -rf /root/data/docker_workspace/typecho