Wan Yu's Homepage

Get Start

 
  • Feb 03, 2021
  • 0 views

此篇博客作为 Fengshiwest’s Homepage 的第一篇正式文章，用于记录搭建该网站的步骤。

模版

博客模版基于 jekyll-TeXt-theme，在该模版的基础上做一些改动，模版 Demo 演示地址。

本地环境及预览

  1. 安装 Ruby 依赖包: bundle install --path vendor/bundle
  2. 本地预览: bundle exec jekyll serve

布局

Homepage 主要分为以下模块:

  • Blog: 记录技术方面的文章、实践等。
  • Book: 记录想读、正在读、已读过的书籍，以及读后感和摘录。
  • Movie: 同上，想看的、看过的影视。
  • Archive: 博客的归档。
  • About: 自我介绍和个人简历。

TODO

  • 支持中英文切换，且英文作为主要语言。
  • Book、Movie 板块改造，支持格式化。
  • 样式更加自定义一些。

Change Log

1. 增加 feature_row

参考 https://mmistakes.github.io/minimal-mistakes/

Designed to compliment the splash page layout as a way of arranging and aligning “feature blocks” containing text or image.

To add a feature row containing three content blocks with text and image, add the following YAML Front Matter

Name Required Description Default
image_path Required Full path to image eg: /assets/images/filename.jpg. Use absolute URLS for those hosted externally.  
image_caption Optional Caption for image, Markdown is supported eg: `“Image from Unsplash”  
alt Optional Alternate text for image.  
title Optional Content block title.  
excerpt Optional Content block excerpt text. Markdown is allowed.  
url Optional URL that the button should link to.  
btn_label Optional Button text label. more_label in UI Text data file.
btn_class Optional Button style. See utility classes for options. btn 
feature_row:
  - image_path: /assets/images/unsplash-gallery-image-1-th.jpg
    alt: "placeholder image 1"
    title: "Placeholder 1"
    excerpt: "This is some sample content that goes here with **Markdown** formatting."
  - image_path: /assets/images/unsplash-gallery-image-2-th.jpg
    alt: "placeholder image 2"
    title: "Placeholder 2"
    excerpt: "This is some sample content that goes here with **Markdown** formatting."
    url: "#test-link"
    btn_label: "Read More"
    btn_class: "btn--inverse"
  - image_path: /assets/images/unsplash-gallery-image-3-th.jpg
    title: "Placeholder 3"
    excerpt: "This is some sample content that goes here with **Markdown** formatting."

And then drop-in the feature row include in the body where you’d like it to appear.

Include Parameter Required Description Default
id Optional To add multiple rows to a document uniquely name them in the YAML Front Matter and reference in {% include feature_row id="row2" %} feature_row
type Optional Alignment of the featured blocks in the row. Options include: left, center, or right aligned.   
{% include feature_row.html %}

More Feature Row Goodness: A few more examples and source code can be seen in the demo site.

Search