10 basic operations of Hexo

5月 17 2018 编程 4 分钟读完 (约 627 字)

0x00 Create a new post/page

1 2	~# hexo new "Post Title" ~# hexo new page "Download"

0x01 Put codes blocks on your post

Use keyword tag codeblock and endcodeblock

1
2
3

{% codeblock lang:javascript %}
alert('Hello World!');
{% endcodeblock %}

Or just use three backquotes

\`\`\`[language] [title] [url] [link text]
code snippet
\`\`\`
#remove the \ before `

0x02 Insert images/links in your content

Images

1	{% img [class names] /path/to/image [width] [height] [title text [alt text]] %}

Links

1	{% link text url [external] [title] %}

0x03 Organize your posts resources

In _config.yml, set post_asset_folder as true

1	post_asset_folder: true

Then your _posts directory maybe such as this

root@debian:~/chorder.net/source# tree _posts/
_posts/
├── hello-world
│   └── 20180510.jpg
├── hello-world.md
├── hexo-start-up
└── hexo-start-up.md

2 directories, 3 files

You can directly include images from resources directory:

1	{% asset_img xxx.jpg ALT TITLE %}

0x04 Organize your post categories / tags

Your may want to organize your posts as different categories and tags.
First you need to define categories and tags directories in _config.yml, default is like this

# Directory
source_dir: source
public_dir: public
tag_dir: tags
archive_dir: archives
category_dir: categories

Then you can generate a new page to navigate the posts

1 2	~# hexo new page "categories" ~# hexo new page "tags"

After that, the tags and categories directory will being created in source:

root@debian:~/chorder.net/source# tree
.
├── categories
│   └── index.md
├── _posts
│   ├── hello-world
│   │   └── 20180510.jpg
│   ├── hello-world.md
│   ├── hexo-start-up
│   └── hexo-start-up.md
└── tags
    └── index.md

5 directories, 5 files

And on the next time when you creating a new post, you could statement the category and tags of your post,
on the head of post markdown file, just like:

---
title: 10 basic operations of Hexo
date: 2018-05-17 17:05:24
categories: default
tags: default
---

The archives of tags and categories will showing in the site automatically.

0x05 Publish pages on a simple local server

In your hexo directory, run

1	~# npm install hexo-server --save

Then start the server:

1	~# hexo server -p PORT

Or if your want publish static pages as an production envirement, you should first generate static files:

1	~# hexo generate

And then start the server as static mode, it will only deploy pages which included in public directory:

1	~# hexo server -s

0x06 Directly include code from resource

1	{% include_code [title] [lang:language] path/to/file %}

0x07 Insert a video from youtube / vimeo

1	{% youtube video_id %}

1	{% vimeo video_id %}

0x08 Quote an article / resource

# article
{% post_path slug %}
{% post_link slug [title] %}

# resource
{% asset_path slug %}
{% asset_img slug [title] %}
{% asset_link slug [title] %}

0x09 Sitemap & robots.txt

As for optimize your site with a better SEO, ensure you has create sitemap:

#for google sitemap, install this package
npm install hexo-generator-sitemap --save
#for baidu(China) sitemap, instal this package
npm install hexo-generator-baidu-sitemap --save

Over that, tell the spider what you have done, write this in your robots.txt, and save it at source directory:

1 2	Sitemap: http://YOUR DOMAIN/sitemap.xml Sitemap: http://YOUR DOMAIN/baidusitemap.xml

Example robots.txt as mine:

User-agent: *
Allow: /
Allow: /archives/
Allow: /categories/
Allow: /tags/
Sitemap: https://chorder.net/sitemap.xml
Sitemap: https://chorder.net/baidusitemap.xml

You can see both above at:

Sitemap Baidu Sitemap robots.txt

#Hexo