Indigo主题是一款Hexo的基于material设计的主题，个人比较喜欢material设计的主题

首先，在themes/indigo-card/layout下新建links.ejs和link.ejs

links.ejs代码

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
<%- partial('_partial/header', {
    title: locals.title || theme.links_title,
    hdClass: 'links-header'
}) %>
<div class="container body-wrap fade">
    <% if (theme.links && theme.links.length) { %>
    <h3 class="archive-separator">
        <%=theme.links_title%>
    </h3>
    <div class="waterfall">
        <% theme.links.forEach(function(links) { %>
        <div class="waterfall-item">
            <article class="article-card archive-article">
                <h3 class="post-title" itemprop="name">
                    <a class="post-title-link" href="<%- links.url %>" target="_blank" itemprop="url">
                        <%- links.name %></a>
                </h3>
            </article>
        </div>
        <%})%>
    </div>
    <% }%>
    <%- partial('_partial/paginator') %>
</div>

link.ejs代码

1
2
3
<%- partial('links', {
    title: theme.links_title + ': '+ page.link
}) %>

然后在终端执行hexo new page ‘Links’，修改source/Links/index.md为如下内容

1
2
3
4
---
layout: links
comments: false
---

接着在themes/indigo-card/source/css/_partial/header.less搜索

1
2
.tags-header,
.categories-header

替换为

1
2
3
.tags-header,
.categories-header,
.links-header

主题_config.yml设置

新增menu项目内容

1
2
3
link:
    text: 友情链接
    url: /Links

新增页面标题

1
links_title: 友情链接

最后，添加links项目，格式如下

1
2
3
4
5
6
7
8
9
links:
  - name: "名称"
    url: "链接"
  - name: "名称"
    url: "链接"
  - name: "名称"
    url: "链接"
  - name: "名称"
    url: "链接"

重新编译运行即可查看效果

hexo s -g