next 主题内没有 article.ejs 文件【TOC 相关】

[Monster0303]

Issue

Expected Behavior

您好，关于【对 TOC 进行加密】中：

• 找到 landscape/layout/_partial/article.ejs
• 替换 <% post.content %> 这段代码

Actual Behavior

可是。。 themes 目录内只有一个 next 的主题文件夹，并没有 landscape（我记得大概一年前的 hexo 中貌似是有 landscape 文件夹的，但是现在确实没有了）

Specifications

• hexo 版本："version": "5.3.0"
• next 主题："version": "7.8.0

翻遍了都没有类似的文件和代码段，对前端不熟悉的我感觉需要您的帮助

themes/next/layout 的目录结构是这样的，请问我需要在哪个文件内添加呢？

layout
├── _layout.swig
├── _macro
│   ├── post-collapse.swig
│   ├── post.swig
│   └── sidebar.swig
├── _partials
│   ├── comments.swig
│   ├── footer.swig
│   ├── head
│   │   ├── head-unique.swig
│   │   └── head.swig
│   ├── header
│   │   ├── brand.swig
│   │   ├── index.swig
│   │   ├── menu-item.swig
│   │   ├── menu.swig
│   │   └── sub-menu.swig
│   ├── languages.swig
│   ├── page
│   │   ├── breadcrumb.swig
│   │   └── page-header.swig
│   ├── pagination.swig
│   ├── post
│   │   ├── post-copyright.swig
│   │   ├── post-followme.swig
│   │   ├── post-footer.swig
│   │   ├── post-related.swig
│   │   └── post-reward.swig
│   ├── search
│   │   ├── algolia-search.swig
│   │   ├── index.swig
│   │   └── localsearch.swig
│   ├── sidebar
│   │   └── site-overview.swig
│   └── widgets.swig
├── _scripts
│   ├── index.swig
│   ├── noscript.swig
│   ├── pages
│   │   └── schedule.swig
│   ├── pjax.swig
│   ├── schemes
│   │   ├── gemini.swig
│   │   ├── mist.swig
│   │   ├── muse.swig
│   │   └── pisces.swig
│   ├── three.swig
│   └── vendors.swig
├── _third-party
│   ├── analytics
│   │   ├── baidu-analytics.swig
│   │   ├── google-analytics.swig
│   │   ├── growingio.swig
│   │   └── index.swig
│   ├── baidu-push.swig
│   ├── chat
│   │   ├── chatra.swig
│   │   └── tidio.swig
│   ├── comments
│   │   ├── changyan.swig
│   │   ├── disqus.swig
│   │   ├── disqusjs.swig
│   │   ├── gitalk.swig
│   │   ├── livere.swig
│   │   └── valine.swig
│   ├── index.swig
│   ├── math
│   │   ├── index.swig
│   │   ├── katex.swig
│   │   └── mathjax.swig
│   ├── quicklink.swig
│   ├── rating.swig
│   ├── search
│   │   ├── algolia-search.swig
│   │   ├── localsearch.swig
│   │   └── swiftype.swig
│   ├── statistics
│   │   ├── busuanzi-counter.swig
│   │   ├── cnzz-analytics.swig
│   │   ├── firestore.swig
│   │   ├── index.swig
│   │   └── lean-analytics.swig
│   └── tags
│       ├── mermaid.swig
│       └── pdf.swig
├── archive.swig
├── category.swig
├── index.swig
├── page.swig
├── post.swig
└── tag.swig

[D0n9X1n]

给 Issue 点个赞，很详细。

58 ，这个 issue 有帮助吗？

[Monster0303]

Hi，

这个版本的 sidebar.swig 已经发生了翻天覆地的变化，从之前的 300 200 多行变成了只有 50 行代码

我也尝试把 #58 中的代码找一些相似的地方 insert 进去，但都会出现各种不正常的显示，可能已经不适用了？

这是新版的原文件：themes/next/layout/_macro/sidebar.swig sidebar.swig

[Monster0303]

对了，这次更新后，我这里会有这样的现象。

theme: wave

https://user-images.githubusercontent.com/40815364/103198112-7c6a7780-4922-11eb-9b25-e1d5d332469a.mov

[D0n9X1n]

emmmm, 我看了下: next/layout/_macro/sidebar.swig line:18

看上去就是把 toc 那段改为:

{% if page.encrypt == true %}
    {% if display_toc and toc(page.origin).length > 1 %}
        <ul class="sidebar-nav motion-element">
            <li class="sidebar-nav-toc sidebar-nav-active" data-target="post-toc-wrap">
                {{ __('sidebar.toc') }}
            </li>
            <li class="sidebar-nav-overview" data-target="site-overview-wrap">
                {{ __('sidebar.overview') }}
            </li>
        </ul>
    {% endif %}
{% else %}
    {% if display_toc and toc(page.content).length > 1 %}
        <ul class="sidebar-nav motion-element">
            <li class="sidebar-nav-toc sidebar-nav-active" data-target="post-toc-wrap">
                {{ __('sidebar.toc') }}
            </li>
            <li class="sidebar-nav-overview" data-target="site-overview-wrap">
                {{ __('sidebar.overview') }}
            </li>
        </ul>
    {% endif %}
{% endif %}

楼主可以试试, 核心就在于判断博文是否加密,如果加密过, 那就使用 toc(page.origin) 而不是 toc(page.content).

[D0n9X1n]

类似的还有很多地方, 楼主可以依葫芦画瓢. 把所有 toc(page.content) 的地方都加个判断, 是否 page.encrypt, 是的话就 toc(page.origin)

[D0n9X1n]

关于那个主题的问题...Wave - https://mhexo.github.io/2020/12/23/Theme-Test-Wave/ 没有复现, 可能是 css 和 next 主题冲突了? 楼主试试其他的主题呢?

[D0n9X1n]

不过 toc 是个老大难问题，挨个主题去适配不太现实，这边的建议是如果不对 hexo 主题很熟悉的情况下，还是放弃 toc 比较合理。因为 toc 后续也有一个解密前隐藏，解密后显示逻辑，这个需要你手动写在 callback 里面，不然 toc 就等于把内容暴露了出来。同时因为 hexo 机制，toc 内容是无法加密的，也能在前端看到。

[Monster0303]

类似的还有很多地方, 楼主可以依葫芦画瓢. 把所有 toc(page.content) 的地方都加个判断, 是否 page.encrypt, 是的话就 toc(page.origin)

试了画葫芦大法，toc(page.content) 只在一个部分有，于是加了判断后 toc 出来了，就像这样：

      {% if page.encrypt == true %}

        {%- set display_toc = page.toc.enable and display_toc %}
        {%- if display_toc %}
          {%- set toc = toc(page.origin, { class: "nav", list_number: page.toc.number, max_depth: page.toc.max_depth }) %}
          {%- set display_toc = toc.length > 1 and display_toc %}
        {%- endif %}

      {% else %}

        {%- set display_toc = page.toc.enable and display_toc %}
        {%- if display_toc %}
          {%- set toc = toc(page.content, { class: "nav", list_number: page.toc.number, max_depth: page.toc.max_depth }) %}
          {%- set display_toc = toc.length > 1 and display_toc %}
        {%- endif %}

      {% endif %}

但是侧栏中的 TOC 貌似是静止的，不随页面变化，也不能点击，就像这样：

正确的应该可以跟着文章动，并且可以通过直接点击跳转到相应的位置，就像这样：

后来干脆把全文都放到判断里😂，大概 if 全文1 else 全文 2，toc 就是静止不动，不过总比没有强。

我对 toc 是否加密了并不关心，对我来说标题可以永远显示着

于是在 next 配置文件内打开了 expand_all: true，虽然不会动，但至少可以看到全部的标题。

万分感谢！

[Monster0303]

关于主题，应该是 safari 的问题，~垃圾 safari，调试也难用~，换成 chrome 就是正常的。

[D0n9X1n]

emmm, 测试不充分啊. 我更新了 v3.1.2, 你可以到 https://mhexo.github.io/2020/12/23/Theme-Test-Wave/ 看看. 我这边 Safari Version 14.0.2 (16610.3.7.1.9) 是正常了. 你那边确认下.

[Monster0303]

emmm, 测试不充分啊. 我更新了 v3.1.2, 你可以到 https://mhexo.github.io/2020/12/23/Theme-Test-Wave/ 看看. 我这边 Safari Version 14.0.2 (16610.3.7.1.9) 是正常了. 你那边确认下.

npm 还没有更新到，估计得过一段时间，不过问题应该不大。测试页已经正常了，版本：14.0.1 (15610.2.11.51.10)

前端兼容真是折磨人哈