Git + Hexo build static blog website, githexo build static

Git + Hexo build static blog website, githexo build static

Hexo is a fast, concise, and efficient blog framework. Hexo uses Markdown (or other rendering engines) to parse articles. Within a few seconds, it can use beautiful themes to generate static webpages.

Install Git in the installation environment

Version management tool, which can host our generated static Web pages on GitHub

• Set global

  • git config --global user.name "name"Configure username
  • Git config -- global user. email "email"Configure email

• Set ssh

  Ssh-keygen-t rsa-C "email"Set the digital fingerprint of rsa. One is the public key and the other is the private key.
  The public key must be submitted to github and saved by yourself.

• Verify ssh key

  ssh -T git@github.comMatches the local private key with the github public key.

Install node. js

Download: Keep the default configuration when installing the http://nodejs.org/download.

Configure Github to create Repository

Create a repository corresponding to your user name. The repository name must be [your_user_name.github.io]
And your github account must have been verified by email.

Install Hexo

Open the Git command line and execute the following command:$ npm install -g hexo

Quick Start

• Configure blog

  Create a folder named "Hexo" on your computer (for example, I created it in D: \ Hexo), and right-click it to open Git Bash. Run the following command:
  $ hexo init

  The following output is displayed on the console:

  [Info] Copying data

  [Info] You are almost done! Don't forget to runnpm installBefore> you start blogging with Hexo!

  Hexo then automatically creates the files required for the website in the target folder. Then follow the prompts to runnpm install(Under/D/Hexo)

  npm installNode_modules will be installed in the D: \ Hexo directory.

• Enable hexo Service

  Run the following command (under/D/Hexo)

  $ hexo server

  [Info] Hexo is running at http: // localhost: 4000/. Press Ctrl + C to stop.

  It indicates that the Hexo Server has been started. Open http: // localhost: 4000/in the browser. You can see that Hexo has generated a blog for you. You can press Ctrl + C to stop the Server.

• Create a new blog

  Open a new git bash command line window, cd to/D/Hexo, and execute the following command

  $ hexo new "My New Post"

  [Info] File created at d: \ Hexo \ source_posts \ My-New-Post.md

  Refresh http: // localhost: 4000/. You can find that a New article "My New Post" has been generated ".

  • Notes
    There was a problem. I found that "My New Post" was sent twice, and I can see it twice at the git bash WINDOW> port where Hexo server is located.
    Therefore, in the hexo new article, you need to stop the server.

• Generate static website files

  Run the following command to generate a static webpage from the markdown file.

  $ hexo generateAfter the command is executed, a series of html and css files are generated in the Directory D: \ Hexo \ public \.

• Edit article

  You can use an editor that supports the markdown syntax (for example, Sublime Text 2) to edit the file.

• Deploy to Github

  Configure the _ config. yml file before deploying it to Github. First find the following content:

  # Deployment # Docs: repository type: Then modify them to # Deployment # Docs: repository type: github repository: git@github.com: githubname/githubname. github. io. git branch: master

  • Note Question 1

    Repository: Must be a url in the form of SSH (git@github.com: zhchnchn/zhchnchn. github. io. git), instead of a url in the form of HTTPS (https://github.com/zhchnchn/zhchnchn.github.io.git), otherwise an error will occur:

  • Note Question 2

    If you create a website for a project, set branch to gh-pages.

• Test the website deployed on github

  When the deployment is complete, open the http://githubname.github.io in the browser and the page is displayed normally, indicating that the deployment was successful.

• The subsequent deployment steps can be simplified to the following three commands:

  You can perform the following three steps for each deployment.

  Hexo clean

  Hexo generate

  Hexo deploy

Configure Hexo

You can set the blog title, author, and other information in the _ config. yml file.

Installation topic

Here I chose hexo-theme-yilia: https://github.com/litten/hexo-theme-yilia theme

Theme Installation

• Switch the Git Shell to the/D/Hexo directory and run the following command to download yilia to the themes/yilia directory.
• $git clone https://github.com/litten/hexo-theme-yilia.git themes/yiliaModify the theme attribute in the config. yml configuration file under your blog root directory/D/Hexo and set it to yilia.
• Update yilia topic
  

  Cd themes/yilia
  
  Git pull

If the default settings of yilia cannot meet the requirements, you can modify the configuration file _ config. yml in/themes/yilia/to customize the theme configuration.

• Add a comment box

  # Whether to enable multi-statement comments. Enter the project name duoshuo: duoshuo-key that you have applied for in the Multi-Statement statement. # If disqus is used, enter disqus_shortname in the blog config file and disable duoshuo: true.

• Add links

  # Whether to enable the link # do not enable -- # friends: false # enable -- friends: Obama's blog: http: // localhost: 4000/Kaka: http: // localhost: 4000/benzema's blog: http: // localhost: 4000/

Custom 404 page

Create a 404.html file under the Hexo/sourcedirectory
Set 404.html content to the following content

---layout: default---

Optimize Hexo Chinese garbled characters

In the md file to write Chinese content, published for garbled characters, the reason is that the md encoding is incorrect, save the md file as a "UTF-8" encoded file to solve the problem

Below is the yilia-themed static blog http://guxuewu.com I set up with git and hexo

Copyright Disclaimer: This article is an original article by the blogger and cannot be reproduced without the permission of the blogger.