permalink in anchors shouldn't be parsed by TOC helper
Closed this issue · 2 comments
Issue / current behavior
Currently permalinks are added as a link inside the title, for example:
<h3 id="create-a-new-post">
<a class="header-anchor" href="#create-a-new-post">#</a>
Create a new post
</h3>
This will produce something like:
The problem is the permalink symbol will be part of the title.
So when you use, for example, the toc
helper, the permalink symbol will be added in the title too.
<ol class="toc">
<li class="toc-item toc-level-2"><a class="toc-link" href="#quick-start"><span class="toc-number">1.</span> <span class="toc-text">#Quick Start</span></a>
<ol class="toc-child">
<li class="toc-item toc-level-3"><a class="toc-link" href="#create-a-new-post"><span class="toc-number">1.1.</span> <span class="toc-text">#Create a new post</span></a></li>
<li class="toc-item toc-level-3"><a class="toc-link" href="#run-server"><span class="toc-number">1.2.</span> <span class="toc-text">#Run server</span></a></li>
<li class="toc-item toc-level-3"><a class="toc-link" href="#generate-static-files"><span class="toc-number">1.3.</span> <span class="toc-text">#Generate static files</span></a></li>
<li class="toc-item toc-level-3"><a class="toc-link" href="#deploy-to-remote-sites"><span class="toc-number">1.4.</span> <span class="toc-text">#Deploy to remote sites</span></a></li>
</ol>
</li>
</ol>
Idea of fixing / workaround
My workaround was to set a null symbol permalinkSymbol: ''
and to add some css (sass here):
h1,h2,h3,h4,h5,h6
a::before
content: '#'
So this display the same and is still clickable but there is no more content in the title.
Same look
No more issue with the toc helper
But I think it can't be fixed like this because this plugin only generates html, no css.
Alternative idea
Fix the toc helper to select only text content and not other sub-elements like links.
https://github.com/hexojs/hexo/issues/4057
Environment
Happening with both hexo: 4.2.0 and hexo: 4.1.1
Currently permalinks are added as a link inside the title
I assume you enabled permalink
? It's disabled by default in v4 (of this plugin).
markdown:
anchors:
permalink: true
The problem is the permalink symbol will be part of the title.
What is the expected behavior?
Show permalink symbol in heading, but not in toc?
I assume you enabled
permalink
? It's disabled by default in v4 (of this plugin).
Yeah I enabled permalink
because I want them.
What is the expected behavior?
Show permalink symbol in heading, but not in toc?
Exactly. I see you confirmed the issue is coming from cheerio (hexojs/hexo-util#174 (comment)).