Jekyll博客搭建

docker容器部署

我一般使用jekyll-theme-chirpy主题，所以容器默认会下载这个主题，你也可以进行对应修改

如果你已有jekyll博客，可以先clone下来，然后直接映射blog目录，启动容器即可

docker run -d --name blog -v /root/blog:/blog -p 4000:4000 --restart=unless-stopped crpi-jya41iij3cykq66t.cn-chengdu.personal.cr.aliyuncs.com/jiangker_love/blog:1.0

这个容器放在阿里云镜像库里，下面是容器制造脚本，你也可以根据需要进行对应修改

运行jekyll的脚本，会拉去默认仓库，需要赋予权限，不然容器内可能运行不起来 jekyll-chirpy.sh

  if [ -z "$(ls -A /blog)" ]; then
    git clone https://github.com/cotes2020/jekyll-theme-chirpy.git blog
  fi
  cd /blog && bundle install && bundle exec jekyll serve -w --host=0.0.0.0

对应生成容器的Dockerfile

FROM ruby:3.3.6-bullseye
RUN apt update && apt install -y git
RUN gem update && gem install jekyll bundler
COPY jekyll-chirpy.sh .

WORKDIR /

CMD ["/bin/sh", "-c", "/jekyll-chirpy.sh"]

构建容器

docker build -t jiangker/blog:1.0 .

使用jekyll-theme-chirpy配置

更改主页相关信息显示

• img_cdn 注释是使用本地相对路径图片或者直接使用图片库的图片

在_data目录下有share.yml文件，可以配置文章的内容分享形式

在_data目录下有contact.yml文件可以配置页面左下角支持的联系方式

支持plantuml

• jekyll-spaceship

在Gemfile中增加，若有别的插件，直接写到里面

group :jekyll_plugins do
  gem 'jekyll-spaceship'
end

然后在_config.yml中新增，同理也是有别的插件，直接添加即可

plugins:
  - jekyll-spaceship

选择开启指定的插件，在_config.yml目录下增加

# Where things are
jekyll-spaceship:
  # default enabled processors
  processors:
    - table-processor
    - mathjax-processor
    - plantuml-processor
    - mermaid-processor
    - polyfill-processor
    - media-processor
    - emoji-processor
    - element-processor
  mathjax-processor:
    src:
      - https://polyfill.io/v3/polyfill.min.js?features=es6
      - https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-mml-chtml.js
    config:
      tex:
        inlineMath:
          - ['$','$']
          - ['\(','\)']
        displayMath:
          - ['$$','$$']
          - ['\[','\]']
      svg:
        fontCache: 'global'
    optimize: # optimization on building stage to check and add mathjax scripts
      enabled: true # value `false` for adding to all pages
      include: []   # include patterns for math expressions checking (regexp)
      exclude: []   # exclude patterns for math expressions checking (regexp)
  plantuml-processor:
    mode: default  # mode value 'pre-fetch' for fetching image at building stage
    css:
      class: plantuml
    syntax:
      code: 'plantuml'
      custom: ['<img class="plantuml" src="https://www.plantuml.com/plantuml/svg/~h407374617274756d6c272c202740656e64756d6c">']
    src: http://www.plantuml.com/plantuml/svg/
  mermaid-processor:
    mode: default  # mode value 'pre-fetch' for fetching image at building stage
    css:
      class: mermaid
    syntax:
      code: 'mermaid!'
      custom: ['<img class="mermaid" src="https://mermaid.ink/svg/eyJjb2RlIjoiJywgJyIsIm1lcm1haWQiOnsidGhlbWUiOiJkZWZhdWx0In19">']
    config:
      theme: default
    src: https://mermaid.ink/svg/
  media-processor:
    default:
      id: 'media-{id}'
      class: 'media'
      width: '100%'
      height: 350
      frameborder: 0
      style: 'max-width: 600px; outline: none;'
      allow: 'encrypted-media; picture-in-picture'
  emoji-processor:
    css:
      class: emoji
    src: https://github.githubassets.com/images/icons/emoji/