hexo创建的tags和categories页面为空的解决办法

Posted zmj97

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了hexo创建的tags和categories页面为空的解决办法相关的知识,希望对你有一定的参考价值。


title: hexo创建的tags和categories页面为空的解决办法
toc: false
date: 2018-04-16 02:26:10


主题:landscape

添加type以及menu后仍然显示空白的解决办法:

打开landscape/_partial/article.ejs,

<div class="article-entry" itemprop="articleBody">的div内添加代码:

<% if (page.type === "tags") { %>
  <div class="tag-cloud">
    <div class="tag-cloud-title">
    <%- "TOTAl : " + site.tags.length %>
    </div>

    <div class="tag-cloud-tags">
    <%- tagcloud({
      min_font: 12,
      max_font: 30,
      amount: 200,
      color: true,
      start_color: ‘#555‘,
      end_color: ‘#111‘
      }) %>
    </div>
  </div>

  <% } else if (page.type === ‘categories‘) { %>

  <div class="category-all-page">
    <div class="category-all-title">
    <%- "TOTAL : " + site.categories.length %>
    </div>

    <div class="category-all">
    <%- list_categories() %>
    </div>

  </div>
<% } %>

重新打开即可看到正常显示的标签和分类页。

修改categories页面样式(也可以自己设计修改):

打开landscape/source/css/_partial/article.styl,在尾部添加:

.category-all-page {
  a:link {
    font-size: 14px;
    color: #333;
    text-decoration: none;
  }
  a:hover {
    font-size: 14px;
    color: #d8d;
    text-decoration: none;
    font-weight: bold;
  }
  .category-all-title { text-align: left; }

  .category-all { 
    margin-top: 20px; 
  }

  .category-list {
    margin: 0;
    padding: 0;
    list-style: none;
  }

  .category-list-item { 
    text-align: center;
    display: inline-block;
    margin: 8px; 
    padding: 8px;
    width: 150px;
    position: relative;
    background-color: rgba(237, 237, 237, 0.53);
    border-radius: 1px;
    box-shadow:0px 0px  0px 1px #ccc;
  }

  .category-list-link {
    color: #333;
  }

  .category-list-count {
    color: #333;
    &:before {
      display: inline;
      content: " ("
    }
    &:after {
      display: inline;
      content: ") "
    }
  }

  .category-list-child { padding-left: 10px; color: #333;}
}



以上是关于hexo创建的tags和categories页面为空的解决办法的主要内容,如果未能解决你的问题,请参考以下文章

配置Hexo

hexo怎么在菜单上添加页面和分类

hexo 下的分类和表签无法显示,怎么解决

hexo 下的分类和表签无法显示,怎么解决

hexo怎么设置多标签

Hexo之旅:文章编写技巧