-
-
Notifications
You must be signed in to change notification settings - Fork 32
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Unexpected Changes in Article Headerlink and Missing Headerlink Icon #59
Comments
I've run into the same problem when switching from The problem is that <!-- hexo-renderer-marked -->
<h3 id="Filter-Coordinate"><a href="#Filter-Coordinate" class="headerlink" title="Filter Coordinate"></a>Filter Coordinate</h3>
<!-- hexo-renderer-pandoc -->
<h3 id="filter-coordinate">Filter Coordinate</h3> To align the behavior of // FILE: scripts/fix-header-link.js
const { stripHTML } = require('hexo-util');
// When using hexo-renderer-marked, the header link is generated as follows:
// <h3 id="Filter-Coordinate"><a href="#Filter-Coordinate" class="headerlink" title="Filter Coordinate"></a>Filter Coordinate</h3>
// However, the header link generated by hexo-renderer-pandoc is:
// <h3 id="filter-coordinate">Filter Coordinate</h3>
// There are themes that rely on the "headerlink" element to show the anchor icon.
// So we need to mimic the behavior of hexo-renderer-marked.
hexo.extend.filter.register('after_post_render', (data) => {
// https://github.com/hexojs/hexo-renderer-marked/blob/master/lib/renderer.js#L59
data.content = data.content.replace(
/<h([1-6]) id="(.+)">(.+?)<\/h[1-6]>/g,
(match, level, id, content) => {
const title = stripHTML(content);
return `<h${level} id="${id}"><a href="#${id}" class="headerlink" title="${title}"></a>${content}</h${level}>`;
}
);
return data;
}); Hope this helps. :) |
One could also make a Pandoc filter, which works directly on Pandoc's internal syntax trees and is more robust than regular expressions. |
Wow, it works, I really appreciate you. |
Following your advice, I've added a Lua script (header-link-filter.lua) in the ./source/_data directory of my Hexo project. Here's the script for reference: -- header-link-filter.lua
function Header(el)
-- Create a link
local link = pandoc.Link("", "#" .. el.identifier, "", pandoc.Attr("", {"headerlink"}))
-- Insert the link into the header content
table.insert(el.content, pandoc.Space())
table.insert(el.content, link)
return el I've also updated my _config.yml to include the Lua filter along with other Pandoc arguments: pandoc:
args:
- "-f"
- "markdown"
- "-t"
- "html"
- "--mathjax"
- '--lua-filter'
- './source/_data/header-link-filter.lua' Everything is working smoothly now, and the headerlink icons are appearing as expected. On a related note, I have also achieved the same functionality by modifying the source code of the hexo-renderer-pandoc plugin. You can view my changes here. I'm considering making a pull request with these changes. Do you think that would be a good idea, or should I stick with the current approach using the Lua filter? Thanks again for your helpful advice! |
@moon-jam Nice job! Since But maybe we should start a section in readme to give references to filters! |
Okay, thanks. I created a separate repository for the I hope this makes it easier for you to reference the filter in README. Let me know if there's anything else I can do to help! |
Thank you! I have updated readme. Please feel free to modify it if you don't like what I wrote. |
After installing hero-renderer-pandoc and uninstalling hexo-renderer-marked, I've noticed some unexpected behavior in my articles. The URLs for the article Header have been altered (such as an article titled 'header 123' would generate a URL like this: https://example.com/myarticle/#header-123 originally. However, with the changes, the URL format has been altered to https://example.com/myarticle/#header123) , and the headerlink icons(as shown in the screenshot below) that usually appear at the end of the titles are missing.
![image](https://private-user-images.githubusercontent.com/54764038/268445662-d7fb7d64-e9b8-4c6b-8468-ce93ea632c02.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3MjQ0NTI4MTgsIm5iZiI6MTcyNDQ1MjUxOCwicGF0aCI6Ii81NDc2NDAzOC8yNjg0NDU2NjItZDdmYjdkNjQtZTliOC00YzZiLTg0NjgtY2U5M2VhNjMyYzAyLnBuZz9YLUFtei1BbGdvcml0aG09QVdTNC1ITUFDLVNIQTI1NiZYLUFtei1DcmVkZW50aWFsPUFLSUFWQ09EWUxTQTUzUFFLNFpBJTJGMjAyNDA4MjMlMkZ1cy1lYXN0LTElMkZzMyUyRmF3czRfcmVxdWVzdCZYLUFtei1EYXRlPTIwMjQwODIzVDIyMzUxOFomWC1BbXotRXhwaXJlcz0zMDAmWC1BbXotU2lnbmF0dXJlPWU0N2E3YWQyNDU5YWY1MGM3YzVjNmE5NzQ2M2U3NTJkNzcxNzI2ODE2YjNlYTk4N2VlYWJlZmQ2ZGQ4MGFkNmUmWC1BbXotU2lnbmVkSGVhZGVycz1ob3N0JmFjdG9yX2lkPTAma2V5X2lkPTAmcmVwb19pZD0wIn0.d5r4krTBK6OH3kO866tJftCDMsFLrNZoPwIzKJ4cZ04)
I would appreciate some guidance on resolving this issue or any insights into what might be causing these changes.
Thank you for your assistance!
The text was updated successfully, but these errors were encountered: