Constant intake also needs output, in order to see the relative cost, facilitate better progress, build a blog better output

Choose the static blog template framework

Because I don’t have too many functional requirements, I choose to use static blog framework at present. There are many frameworks on the market at present, including the mainstream ones: Jekyll (Ruby) Octopress (based on Jekyll) Hexo (Node) Hugo (GO) etc. You can search engines for details. This article chooses Hexo to build the blog site.

2. Install local development environment

  • Node.js installation address: nodejs.org/zh-cn/ NPM package manager will be installed by default
  • Check the Node and NPM versions: Node -v/ NPM -v Install the latest version

3. Install Hexo

NPM install - g CNPM - registry=https://registry.npm.taobao.org global installation CNPM CNPM install - g hexo - cli installation hexo frame generator mkdir blog Create blog directory CD Blog enter directory hexo init Initialize blog generator hexo s/hexo server Start local blog hexo n "New blog" New blog file hexo g packaged as a static file, default in the public directoryCopy the code

4. Add theme global configuration

Add the following configuration to the end of the _config.yml file at the root of the blog

jsonContent:
  meta: false
  pages: false
  posts:
  title: true
  date: true
  path: true
  text: false
  raw: false
  content: false
  slug: false
  updated: false
  comments: false
  link: false
  permalink: false
  excerpt: false
  categories: false
  tags: true
Copy the code

5. Access the comment function

The default comment interface supported by Hexo is themes/yilia/_config.yml configuration file, say more, netease cloud comment, chat, Disqus, Gitment. This article uses chat access

6. Upload static files to the cloud server

If there are cloud servers (Tencent cloud, Ali cloud, Baidu cloud, JINGdong cloud, etc.) upload static blog files to the specified directory, using nginx proxy static files, you are done!

7, personalized modification

  • All the personalized theme configuration is based on themes/yilia/_config.yml, you can explore by yourself, please refer to github.com/litten/hexo…
  • Get rid ofNews soufangwangComment at the bottom of the advertisement: themes/yilia/layout / _partial/post/changyan. Add the ejs file: 
    <style>
  .section-service-w {
    margin-top: -250px ! important;
    transform: scale(0) ! important;
  }
</style>
Copy the code

    The final effect is as follows:

  • Excerpts from the article are added as abstracts<! -- more -->Go to the corresponding position of the Markdown article to be captured
  • Paging Settings The paging component is not displayed if the current number of blogs is less than the page size, and the paging configuration is set through the Hexo profile

8, server deployment, automatic deployment

Automation deployment is documented in detail in the next blog post