朱琛的小屋

Hexo博客第四站:搜索引擎+小插件+配置结构分析

接着我们上次来继续加加加东西。

此时说明一下,大家可能看到我的博客和你们NexT主题显示的不一样,这是因为NexT主题包含两种主题,我们在主题配置文件中的40行左右可以看见:

# Schemes
scheme: Mist  #这一列默认是注释掉的,如果把这个取消注释,就会变成我的博客的主题样式。

1. 搜索引擎

NexT主题支持了两种搜索引擎:Swiftype和微搜索。一个是国外的,一个是国内的。微搜索做的还不错,但是我搜索的时候总觉得有些延迟;至于Swiftype,真的真的很好用,良心厂家强力推荐。
有人说注册以后是30天试用,这个没关系,网站给的是30天高级账户的使用(那种有可以建立多个搜索引擎、多账户共同管理、一个引擎index多个域名的功能的账户),30天到期后你可选择花钱继续用这个高级账户(土豪自便),或者选择降级成为免费的账户类型,也就是我现在用的那种,所以,不用担心。
Swiftype网站的配置,网上其他好多的都是说的老版Swiftype的配置,比较落后了,这里提供给大家一位博主的博客,说的很详细。传送门 利用swiftype为hexo添加站内搜索
至于主题上的配置,我们只要在你的站点配置文件(不是主题配置文件)上加上这样一句话即可。

# Swiftype Search Key
swiftype_key: 你的swiftype_key

swiftype_key:在你Swiftype网站配置完后,我们看到了一个JS文件。


1
2
3
4
5
6
7
8
<script type="text/javascript">
(function(w,d,t,u,n,s,e){w['SwiftypeObject']=n;w[n]=w[n]||function(){
(w[n].q=w[n].q||[]).push(arguments);};s=d.createElement(t);
e=d.getElementsByTagName(t)[0];s.async=1;s.src=u;e.parentNode.insertBefore(s,e);
})(window,document,'script','//s.swiftypecdn.com/install/v2/st.js','_st');

_st('install','yx9-swpbwqxuFPaTyCzz','2.0.0');//yx9-swpbwqxuFPaTyCzz 就是 swiftype_key,不同的人不一样。
</script>


2. 安装插件RSS与 sitemap

Sitemap:

Sitemap 可方便网站管理员通知搜索引擎他们网站上有哪些可供抓取的网页。最简单的 Sitemap 形式,就是XML文件,在其中列出网站中的网址以及关于每个网址的其他元数据(上次更新的时间、更改的频率以及相对于网站上其他网址的重要程度为何等),以便搜索引擎可以更加智能地抓取网站。

这个Sitemap还是很有用的,例如本来你在google上搜索自己的新帖子是很难搜索到的,但是你向google提交sitemap后,自己的帖子变得容易搜索到多了。

RSS:

RSS(Really Simple Syndication,简易信息聚合)是一种描述和同步网站内容的格式。你可以认为是一种定制个性化推送信息的服务。它能解决你漫无目的浏览网页的问题。它不会过时,信息越是过剩,它的意义也越加彰显。

首先我们安装前人写好的插件。

npm install hexo-generator-feed --save
npm install hexo-generator-sitemap --save

然后在站点配置文件上输入下面的语句:

plugins:
- hexo-generator-feed
- hexo-generator-sitemap

sitemap:
  path: sitemap.xml

feed:
  path: atom.xml

上面的path说明了博客生成后的位置在根目录下,也是你访问网址是你的根地址+path。
此时你访问http://127.0.0.1:4000/atom.xml就能看到RSS的内容啦,sitemap访问同理。 如果想向google提交自己的sitemap,请看这个博客。传送门 如何向google提交sitemap(详细) ,过一天左右,你就能在google搜索到自己的新博客啦。


3. 加入”关于我” 和DIY界面

一开始我们的主页里面只有主页,归档和标签三个栏目。我们可以加一些自己DIY的界面。
我们在Git Bash中输入这样一句命令。

hexo new page "about"

这时我们进入博客根目录下的source可以发现多了一个about文件夹,里面有一个index.md,此时我们进入主题配置文件(就是在主题目录下的_config.yml),对第五行进行更改。

menu:
  home: /
  #categories: /categories
  about: /about
  archives: /archives
  tags: /tags
  #commonweal: /404.html

此时再重新生成可以看见我们的页面多了一个关于的栏目啦。
如果我们想加入一些新的栏目,例如我上面出现的留言呢,可以再次这么敲命令:

hexo new page "guestbook"

然后在主题配置文件进行更改,加一句 guestbook: guestbook

menu:
  home: /
  #categories: /categories
  about: /about
  archives: /archives
  tags: /tags
  guestbook: guestbook
  #commonweal: /404.html

此时我们重新生成发现页面上多出来的是guestbook,而不是我们想要的留言。这时候我们在/themes/hexo-theme-next/languages/zh-Hans.yml的目录下(这里默认你使用的是简体中文,若是其他语言更改相应的yml就行),在memu下加一句即可。

guestbook: 留言

此时再重新生成可以看见我们的页面多了一个留言的栏目啦。如果你想要其他的DIY栏目,勇敢的去做吧!


4. 主题配置文件结构分析

主题配置文件就是在主题目录下的_config.yml,这里对我们常用的配置进行一下讲解。

# when running hexo in a subdirectory (e.g. domain.tld/blog), remove leading slashes ( "/archives" -> "archives" )
menu:                         # 这是你主页最上面出现的栏目
  home: /blog/
  archives: /blog/archives
  categories: /blog/categories
  tags: /blog/tags
  guestbook: /blog/guestbook
  # about: /blog/about
  # commonweal: /blog/404.html

# Place your favicon.ico to /source directory.
favicon: images/favicon.ico   #这是我们网站的图标

# Set default keywords (Use a comma to separate)
keywords: "Hexo,next"        

# Set rss to false to disable feed link.
# Leave rss as empty to use site's feed link.
# Set rss to specific value if you have burned your feed already.
rss: /blog/atom.xml           #这是我们RSS的地址

# Icon fonts
# Place your font into next/source/fonts, specify directory-name and font-name here
# Avialable: default | linecons | fifty-shades | feather
#icon_font: default           #这是我们图标字体的样式
# icon_font: fifty-shades
icon_font: feather
#icon_font: linecons

# Code Highlight theme
# Available value: normal | night | night eighties | night blue | night bright
# https://github.com/chriskempson/tomorrow-theme
highlight_theme: night eighties    #这是我们代码高亮的样式,你可以自己改变来看看每一种样式。


# MathJax Support
mathjax: true          #显示数学公式的功能,默认是空,如果打开就设为true



# Schemes
scheme: Mist    #NexT主题有两种主题,这里默认是注释掉的,取消注释的话就是我博客的样式。


# Sidebar, available value:
#  - post    expand on posts automatically. Default.
#  - always  expand for all pages automatically
#  - hide    expand only when click on the sidebar toggle icon.
sidebar: post     #这个是侧边栏的显示模式,默认是在阅读帖子的时候自动打开。
#sidebar: always
#sidebar: hide


# Automatically scroll page to section which is under <!-- more --> mark.
scroll_to_more: true    #启动摘取一部分作为摘要,剩余的在阅读全文里。


# Automatically add list number to toc.
toc_list_number: true   #自动在目录里加入列表数字

到现在基本的东西我们都算是有啦,现在可以准备开始写博客了。

朱琛 wechat
扫一扫,用手机看更方便~
坚持原创技术分享,您的支持将鼓励我继续创作!