当前标签 / Next / 总共4篇

Hexo主题（Next）美化、配置、优化这一篇就够了

· 大约 800 个字 · 预计 4 分钟 读完
Hexo · Next主题
Hexo · Next · 配置 · 插件 · 美化

前言

最近一段时间把我的博客重新美化了一番，今天就对这些工作做一个总结，并把方法归纳出来分享给大家，希望大家也能把自己的博客做成自己想要的样子，大概工作如下：

  • 实时更新Next主题
  • 添加可爱的小猫挂件
  • 添加Chat聊天挂件
  • 添加分享挂件
  • 添加音乐界面
  • 添加Valine评论邮件通知
  • 添加相册界面

这些美化功能大部分只需要你花费半个小时左右就可以搞定了，我们马上开始吧！

阅读更多

Hexo打造可以自由配置的网站通知和页面通知

· 大约 400 个字 · 预计 2 分钟 读完
Hexo · 优化
Nodejs · Hexo · Next · 网站通知 · 网站广播

最近本站要更换域名，所以我就想做一个首页和文章内通知，于是就有了这篇文章。

首先打开 theme/next/layout/_layout.swig 文件找到如下代码中的 content-wrap 节点。

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14

 <main id="main" class="main">
      <div class="main-inner">
        <div class="content-wrap">
          <div id="content" class="content">
            {% block content %}{% endblock %}
          </div>
          {% include '_third-party/duoshuo-hot-articles.swig' %}
          {% include '_partials/comments.swig' %}
        </div>
        {% if theme.sidebar.display !== 'remove' %}
          {% block sidebar %}{% endblock %}
        {% endif %}
      </div>
    </main>

在 content-wrap 节点中添加下面代码

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13

{% if theme.main_notify.enable%}
      {% if theme.main_notify.pageshow %}
         {% if page.notify === '' %}
           <p class="content-notify marquee">{{ theme.main_notify.notify }}</p>
         {% else %}
          <p class="content-notify marquee">{{ page.notify }}</p> 
         {% endif %}
       {% elseif page.notify !== '' %}
         <p class="content-notify marquee">{{ page.notify }}</p>
       {% elseif page.title === ''%}
         <p class="content-notify marquee">{{ theme.main_notify.notify }}</p>
       {% endif %}
{% endif %}

上面这段代码的逻辑是判断是否要显示通知，我们实际的通知布局只就是 <p> 标签。

1

<p class="content-notify marquee">通知的内容</p>

阅读更多

Hexo Next博客配置和SEO优化

· 大约 600 个字 · 预计 3 分钟 读完
Hexo · 优化
Nodejs · Hexo · Next · SEO · CDN

SEO优化

在Gitlab上面搭建的博客，最近又买了域名给搭建了起来，文章有了，但是发现百度和Google的索引量比较少，乘着国庆假期抽空又折腾了一番，添加了百度和google收录，更换了静态资源cdn地址，对静态资源进行了压缩。

静态资源压缩 静态资源压缩

百度收录

在搜索引擎中输入site:<域名>， 如果没有被收录可以点击“网址提交”来提交网站。百度链接提交

生成站点地图

我们需要使用npm自动生成网站的sitemap，然后将生成的sitemap提交到百度和其他搜索引擎。

1
2

npm install hexo-generator-sitemap --save     
npm install hexo-generator-baidu-sitemap --save

阅读更多

使用GitHub/GitLab/码云搭建个人博客

· 大约 700 个字 · 预计 4 分钟 读完
Hexo · 优化
Nodejs · GitLab · GitHub · 码云 · Hexo · Next

我为什么要搭建个人博客

前段时间我在用印象笔记做一些整理和知识归纳，感觉很不舒服，后来装了一个马克飞象花了了70多人名币用来作为印象笔记的markdown编辑器，这样确实舒服了不少。

但是紧接着我就想既然总结了一些东西干嘛不发布到我的博客上去呢（当时我的博客在CSDN)，我只能从马克飞象中复制黏贴到博客上去，感觉又重复写了一遍，瞬间有了一键部署博客的想法。

hexo install

后来我结合我之前在github上搭建的个人博客，百度了一下看有没有GitLab和码云上面的类似博客系统，结果还真让我给找到了，不但找到了而且个人感觉非常棒，接下来来看看我是怎么做的。

阅读更多