hexojs / hexo

A fast, simple & powerful blog framework, powered by Node.js.
https://hexo.io
MIT License
39.16k stars 4.81k forks source link

<!-- more --> doesn't work #2316

Closed dazinator closed 7 years ago

dazinator commented 7 years ago

before you submit your issue, please delete all the example code in template

Environment Info

Node version(node -v)

v7.2.1

Your site _config.yml

# Hexo Configuration
## Docs: https://hexo.io/docs/configuration.html
## Source: https://github.com/hexojs/hexo/

# Site
title: Darrell Tunnell
subtitle: Radiating awesomeness, one blog post at a time.
description:
author: Darrell Tunnell
language: en
timezone:

# URL
## If your site is put in a subdirectory, set url as 'http://yoursite.com/child' and root as '/child/'
url: http://darrelltunnell.net
root: /
permalink: :year/:month/:day/:title/
permalink_defaults:

# Directory
source_dir: source
public_dir: public
tag_dir: tags
archive_dir: archives
category_dir: categories
code_dir: downloads/code
i18n_dir: :lang
skip_render:

# Writing
new_post_name: :year-:month-:day-:title.md # File name of new posts
default_layout: post
titlecase: false # Transform title into titlecase
external_link: true # Open external links in new tab
filename_case: 0
render_drafts: false
post_asset_folder: false
relative_link: false
future: true
highlight:
  enable: true
  line_number: true
  auto_detect: false
  tab_replace:

# Category & Tag
default_category: uncategorized
category_map:
tag_map:

# Date / Time format
## Hexo uses Moment.js to parse and display date
## You can customize the date format as defined in
## http://momentjs.com/docs/#/displaying/format/
date_format: YYYY-MM-DD
time_format: HH:mm:ss

# Pagination
## Set per_page to 0 to disable pagination
per_page: 10
pagination_dir: page

# Extensions
## Plugins: https://hexo.io/plugins/
## Themes: https://hexo.io/themes/
theme: landscape

# Deployment
## Docs: https://hexo.io/docs/deployment.html
deploy:
  type:

...

Your theme _config.yml

# Header
menu:
  Home: /
  Archives: /archives
rss: /atom.xml

# Content
excerpt_link: Read More
fancybox: true

# Sidebar
sidebar: right
widgets:
- category
- tag
- tagcloud
- archive
- recent_posts

# display widgets at the bottom of index pages (pagination == 2)
index_widgets:
# - category
# - tagcloud
# - archive

# widget behavior
archive_type: 'monthly'
show_count: false

# Miscellaneous
google_analytics:
favicon: /favicon.png
twitter:
google_plus:
fb_admins:
fb_app_id:
...

Plugin version(npm ls --depth 0)

hexo-site@0.0.0 C:\Users\darre\Source\Repos\MyHexoBlogSite
+-- hexo@3.2.2
+-- hexo-generator-archive@0.1.4
+-- hexo-generator-category@0.1.3
+-- hexo-generator-index@0.2.0
+-- hexo-generator-tag@0.2.0
+-- hexo-renderer-ejs@0.2.0
+-- hexo-renderer-markdown-it@3.4.1
+-- hexo-renderer-stylus@0.3.1
`-- hexo-server@0.2.0

For BUG

For question

I have migrated posts from octopress, and they contain the following which is meant to render a "Read More" link:

<!-- more -->

However hexo is displaying the whole blog post, and it isn't rendering the post as an excerpt, and not converting this to a "Read More" link. So the post displays like this:

image

This is a brand new / vanilla setup of hexo, except that I did also install a different markdown plugin: https://github.com/celsomiranda/hexo-renderer-markdown-it

Am I doing something wrong perhaps?

For feature request

just push feature request

dazinator commented 7 years ago

To add some more info, I added this script to my theme scripts folder:

var rExcerpt = /<!-- ?more ?-->/;
console.log(" excerpt script fired")
hexo.extend.filter.register('after_post_render', function(data) {
    var content = data.content;

    if (rExcerpt.test(content)){
        data.content = content.replace(rExcerpt, function(match, index){
            data.excerpt = content.substring(0, index).trim();
            data.more = content.substring(index + match.length).trim();
            console.log(" excerpt: " + data.excerpt);
             console.log(" more: " + data.more);
            return '<a id="more"></a>';
        });
    } else {
         console.log(" no excertp found: " + content);
        data.excerpt = '';
        data.more = content;
    }
});

When it runs, the regex doesn't match, as the content contains this:

<p>&lt;!--more--&gt;</p>

Could this be the reason? i.e it looks like the read more directive is getting html encoded.

dazinator commented 7 years ago

I have tried switching back to the default markdown renderer and the issue remains. Would appreciate any help or pointers around how to get excerpts working. Even if someone has a vanilla example that would be really useful.

NoahDragon commented 7 years ago

I haven't written any theme before. But based on my understanding, I think it should work by default.

https://github.com/hexojs/hexo/blob/master/lib/plugins/filter/after_post_render/excerpt.js#L3

rudism commented 7 years ago

It seems that the hexo-renderer-markdown-it plugin html encodes the < and > characters in the comment as you observed, which prevents it from being recognized when the excerpt is being populated. I was able to get it working by wrapping the comment in an escape block like this:

<escape><!-- more --></escape>

That seems to prevent the rendering plugin from html encoding the comment and excerpts start working again as expected. This may or may not be a bug in the renderer, I'm not sure.

The official markdown spec does not address html comments specifically, but it allows for both the use of < as a literal character (to be escaped automatically) as well as the direct embedding of inline html. It's up to the renderer to recognize under which circumstance it's being used and to either escape or not escape it appropriately. I'd argue that html comments should be treated as inline html and embedded without escaping, but I suppose it could be argued the other way as well.