Set up a Hexo blog and create a theme template

This is the first day of my participation in the More text Challenge. For details, see more text Challenge

While many of you might have wanted to create a template for your own blog with Hexo, today I want to use what I’ve learned and learned to go through the process. I hope you can support me a lot.

Hexo site construction begins

Install hexo – cli

NPM install -g hexo-cli // Install global hexo-cli hexo init hExotest // Create an hExoTest project. CD hExotest // Go to hexotest NPM install // Install the hexo dependency packageCopy the code

At this point we have created a simple hexo blog that we can launch using the following command, viewed in a browser via localhost:4000

hexo server
Copy the code

Create your own theme template

Create your own theme directory “Riseape” under Themes

2. Customize the page layout

Create the test.ejs template file in the Layout directory

<div class="riseape-primary"> <div class="riseape-post"> <%- page.Copy the code

Then create a test.md page in the root directory source and set layout to point to the test template

-- Title: Custom page layout: test permalink: test.html --Copy the code

Configure _config.yml

Theme: riseage // Configure a custom themeCopy the code

After configuring the theme, let’s start the project and customize our own theme template. I am analyzing the default template and how the data is rendered. Then find some templates on the web, check out their open source Github code, and click on it yourself. Finally, make your favorite style theme

4. Edit articles

Add the MD file to the source>_posts directory to post your posts.

The header content section of the article is set

-- Title: Encapsulate an AXIos public library: 'Encapsulate an Axios public library, common projects can directly reference it, reducing some basic configuration of AXIOS, so that projects can easily and quickly use axios to request back-end data and process some error information.' TOC: Truetag: ['axios']category: ['vue']cover: https://cn.vuejs.org/images/logo.png---Copy the code

Package and publish to Github

Package with Hexo Generate

After the package is complete, upload the Public directory file to the Github repository

5.1 Creating a Github Repository

Create a ***.github. IO repository name. You can access your blog directly from this address

Copy the repository address and initialize Git locally

git init

Git remote add Origin

git add .

Git commit -m ‘remarks’

git push origin master

Six, summarized

Here, we’re done with using hexo custom templates, set up their own blog, BBS, there are many online blogger development good template, can install and use directly, but sometimes, people may not completely suitable for themselves, they want to make a unique set of templates, can be self-developed template and then install.