ghost更新啦~5.x 搭建ghost博客

下山
1,318 阅读4分钟

持续创作，加速成长！这是我参与「掘金日新计划 · 6 月更文挑战」的第2天，点击查看活动详情

面向人群

  • 想搭建博客的同学
  • 有云服务器但不知道干嘛用的同学
  • 没有操作过服务器的同学
  • 没有docker经验同学

这里你将学到，服务器 -> 宝塔 -> docker -> 搭建ghost -> 定制博客主题

背景

作为以敲代码为主要社会活动的码畜，怎么能没有自己的博客呢？

准备

CVM/Lighthouse、域名 (需完成备案的域名)、宝塔

这里强烈建议没有服务器操作经验或者是不想折腾的前端同学，使用宝塔来操作你的服务器，真的很方便。不要把时间浪费在百度上。你可以利用宝塔轻松完成网站部署、Nginx反向代理、docker安装、文件上传/下载...

开始

给域名免费申请证书

这里以腾讯云为例，申请域名的免费证书，大家可以登录腾讯云账号，到证书控制台申请，大概十几分钟就可以申请下来，可以查看官方文档

然后在证书列表下载对应Nginx的证书

image.png

安装宝塔

若安装docker出现问题 AttributeError: 'NoneType' object has no attribute 'containers'

rm -f /var/lib/rpm/__db*
rpm --rebuilddb 
yum -y update

这里已centos为例，登入服务器之后运行

yum install -y wget && wget -O install.sh http://download.bt.cn/install/install_6.0.sh && sh install.sh ed8484bec

等待安装完成，依照提示，就可以登录宝塔面板了

image.png

安装Nginx和docker管理器

在软件商店里，搜索安装Docker管理器和Nginx，直接安装就好了。 image.png

安装完成之后，在软件商店里的已安装中，勾选首页显示

安装ghost

在宝塔首页，打开docker管理器，在镜像搜索里搜索ghost及mysql，并拉取这两个镜像

image.png

先安装MySQL

image.png

等待MySQL安装完成之后，开始安装ghost，打开终端

ghost安装也可以参考ghost官方镜像

image.png

docker run --name ghost-blog --link=mysql:mysql -p 2368:2368 -v /data/docker/ghost:/var/lib/ghost/content -e database__connection__user=用户名 -e database__connection__password=密码 -e database__connection__database=ghost -e url=域名 -e database__client=mysql -e database__connection__host=mysql ghost

等待安装完成

设置Nginx

image.png

点击刚设置的域名，进入域名设置页面

配置证书

将刚刚下载的证书，对应的内容复制粘贴到这里，并保存

image.png

配置代理

image.png

server {
    server_name 你的域名;
    listen 80;
    return 301 https://$host$request_uri;
}

server {
    listen 443 ssl;
    server_name 你的域名;
  
    ssl_certificate    /www/server/panel/vhost/cert/test.com/fullchain.pem(证书地址);
    ssl_certificate_key    /www/server/panel/vhost/cert/test.com/privkey.pem(证书地址);
  
  
    location / {
      proxy_set_header Host $http_host;
      proxy_set_header X-Real-IP $remote_addr;
      proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
      proxy_set_header X-Forwarded-Proto https;
      proxy_pass http://你的服务器ip:2368;
    }
}

如果是配置了https，那Nginx配置上一定要加上

proxy_set_header X-Forwarded-Proto https;

否则会进入重定向死循环

安装完成，在浏览器中输入你的域名，就可以看到ghost页面了。输入域名+/ghost进入管理系统

image.png

定制主题

在ghost后台管理里头，/ghost/#/settings/design可以选择主题，我这里选择alto，那我们开始定制它

image.png

添加评论系统

这里使用的是Valine，基本的配置可以参考官网，获取到代码

<div id="vcomments"></div>
<script>
    new Valine({
        el: '#vcomments',
        appId: 'Your appId',
        appKey: 'Your appKey'
    })
</script>

js代码可以参考ghost文档，这里只说下怎么将HTML代码<div id="vcomments"></div>插入主题的指定位置

登录服务器，进入到/data/docker/ghost(这个目录是创建ghost容器是，容器映射到服务器的目录)

cd /data/docker/ghost

# 进入主题目录
cd themes/alto

进入主题目录之后，你会看到很多.hbs文件，这些都是页面的模板文件

image.png

我们通过vim来修改.hbs文件（如果服务器没有装vim，可以执行yum -y install vim*来安装）

vim 的简单操作 按 i 键: 编辑 按 esc 键，再依次输入 :wq，再 回车，就完成修改了

修改post.hbs

image.png

修改完后，重启docker（也是通过宝塔上的docker管理器实现，在docker列表点击状态来实现）

再看下博客网站，会发现已经有评论了

image.png

添加阅读量

阅读量也是通过Valine来实现，这里要注意的就是HTML的设置，一定要加上url，不然阅读量始终为0

image.png

再重启docker，看下效果

image.png

修改文案

如果前两步都操作OK了，那改文案，应该是小菜一碟，这里分享一个比较快速的方法，将主题仓库的源代码下载到本地来，然后在本地编辑器里头搜索要改的文案，这样就可以快速找到对应的文件目录。再利用vim修改服务器中对应的文件，可以一次性改多个，改错了也没关系，可以对应了源代码还原

我这里用vscode打开源码

image.png

将修改后的代码，直接粘贴到服务器对应的主题文件中去，非常方便的修改文案

完成

红框标记的，都是修改过的

image.png image.png

另开一篇优化，# 薅羊毛！！！用腾讯云的免费资源来优化网站

avatar
文章
阅读
粉丝