hexo代码换行异常解决以及常用问题

2017-04-17  本文已影响580人  nicocoi

原因：2017年4月17日 星期一 解决使用hexo中遇到的问题
说明：虽说不要重复制造轮子，前提是轮子跑得起来。
我的博客：http://minichao.me

简介

hexo代码块解析异常

      numbers += '<span class="line">' + (firstLine + i) + '</span>\n';
      content += '<span class="line';
      content += (mark.indexOf(firstLine + i) !== -1) ? ' marked' : '';
      content += '">' + line + '</span>\n';

hexo字数统计扩展

npm install hexo-wordcount --save

字数统计 WordCount:wordcount(post.content)

阅读时长预计 Min2Read:min2read(post.content)

总字数统计 TotalCount:totalcount(site, '0,0.0a')

WordCount

<% if ((post.original != false && !is_page() && theme.copyright) || post.original){ %>
    <div class="copyright">
        <p><span><%= __('copyright_info.title') %>:</span><a href="<%- url_for(post.path) %>"><%= post.title %></a></p>
        <p><span><%= __('copyright_info.author') %>:</span><a href="/" title="<%= __('tooltip.back2home') %>"><%=theme.author%></a></p>
        <p><span class="post-count">文章字数:</span><%= wordcount(post.content) %></p> //添加本行
        <p><span><%= __('copyright_info.date') %>:</span><%= post.date.format("YYYY-MM-DD, HH:mm:ss") %></p>
        <p><span><%= __('copyright_info.updated') %>:</span><%= post.updated.format("YYYY-MM-DD, HH:mm:ss") %></p>
        <p>
            <span><%= __('copyright_info.url') %>:</span><a class="post-url" href="<%- url_for(post.path) %>" title="<%= post.title %>"><%= post.permalink %></a>
            <span class="copy-path" data-clipboard-text="<%= __('copyright_info.from') %> <%= post.permalink %>　　<%= __('copyright_info.by') %> <%=theme.author%>" title="<%= __('tooltip.copyPath') %>"><i class="fa fa-clipboard"></i></span>
            <script> var clipboard = new Clipboard('.copy-path'); </script>
        </p>
        <p>
            <span><%= __('copyright_info.license') %>:</span><i class="fa fa-creative-commons"></i> <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/" title="CC BY-NC-SA 4.0 International" target = "_blank">"<%= __('copyright_info.cc') %>"</a> <%= __('copyright_info.notice') %>
        </p>
    </div>
<% } %>

<% if (post.prev || post.next){ %>
    <nav id="article-nav">
        <% if (post.prev){ %>
            <div id="article-nav-newer" class="article-nav-title">
                <a href="<%- url_for(post.prev.path) %>">
                    <%= post.prev.title %>
                </a>
            </div>
        <% } %>
        <% if (post.next){ %>
            <div id="article-nav-older" class="article-nav-title">
                <a href="<%- url_for(post.next.path) %>">
                    <%= post.next.title %>
                </a>
            </div>
        <% } %>
    </nav>
<% } %>

TotalCount

                   <span title="本站总字数统计">
                         <span><i class="fa fa-map" aria-hidden="true"></i></span>
                        <span class="post-count"><b><%= totalcount(site) %></b></span>
                    </span>

<footer id="footer">
    <div class="outer">
        <div id="footer-info">
            <div class="footer-left">
                <i class="fa fa-copyright"></i> 
                <% if (theme.since && !isNaN(theme.since) && theme.since < date(new Date(), 'YYYY')) { %><%- theme.since%>-<% } %><%= date(new Date(), 'YYYY') %> <%= config.author || config.title %>
            </div>
            <div class="footer-right">
                <a href="http://hexo.io/" target="_blank" title="<%= __('tooltip.Hexo') %>">Hexo</a>  Theme <a href="https://github.com/MOxFIVE/hexo-theme-yelee" target="_blank" title="<%= __('tooltip.Yelee') %>  v<%= theme.Yelee %>">Yelee</a> by MOxFIVE <i class="fa fa-heart animated infinite pulse"></i>
            </div>
        </div>
        <% if (theme.visit_counter.on) { %>
            <div class="visit">
                <% if (theme.visit_counter.site_visit) { %>
                    <span id="busuanzi_container_site_pv" style='display:none'>
                        <span id="site-visit" title="<%= __('visit_counter.site') %>"><i class="fa fa-user" aria-hidden="true"></i><span id="busuanzi_value_site_uv"></span>
                        </span>
                    </span>
                <% } %>
                <% if (theme.visit_counter.site_visit && theme.visit_counter.page_visit) { %>
                    <span>| </span>
                <% } %>
                <% if (theme.visit_counter.page_visit) { %>
                    <span id="busuanzi_container_page_pv" style='display:none'>
                        <span id="page-visit"  title="<%= __('visit_counter.page') %>"><i class="fa fa-eye animated infinite pulse" aria-hidden="true"></i><span id="busuanzi_value_page_pv"></span>
                        </span>
                    </span>
                    <span>| </span>
                    <span title="本站总字数统计">
                         <span><i class="fa fa-map" aria-hidden="true"></i></span>
                        <span class="post-count"><b><%= totalcount(site) %></b></span>
                    </span>
                <% } %>
            </div>
        <% } %>
    </div>
</footer>

hexo使用图床

定义

用途

用法

hexo音乐Aplayer

npm install --save hexo-tag-aplayer

{% aplayer title author url [picture_url, narrow, autoplay, width:xxx, lrc:xxx] %}

{% aplayer "Caffeine" "Jeff Williams" "caffeine.mp3" "autoplay" "width:70%" "lrc:caffeine.txt" %}

hexo动画效果

<script type="text/javascript" color="0,0,255" opacity='0.7' zIndex="-2" count="99" src="//cdn.bootcss.com/canvas-nest.js/1.0.1/canvas-nest.min.js"></script>
上一篇 下一篇

猜你喜欢

热点阅读