Kaiwei Chen
Kaiwei Chen

Reputation: 73

How can I replace the last <p> tag in Jekyll

In my index.html page, I want to append '...' after the post.excerpt. The idealized way is to use code {{ post.excerpt |replace_last:'</p>', '……</p>' }},but the filter replace_last seems not defined. So how can I do this in jekyll? thank you.

Upvotes: 6

Views: 477

Answers (4)

T. Arboreus
T. Arboreus

Reputation: 1059

The simplest way I found to do this was to wrap the excerpt and "Read More" link in a div with a class that makes

tags inline. This will only work if your excerpt should look like one paragraph.

<div class="no-paragraphs">
  {{ post.excerpt }} <a href="{{ post.url }}">Read More</a>
</div>
.no-paragraphs p {
    display: inline;
}

Upvotes: 0

Saeb Amini
Saeb Amini

Reputation: 24429

I've found a workaround for this to achieve an ellipsis with a "Read More" link. Both the truncate filter and setting excerpt_separator have shortcomings, however, it's simple to do implement it yourself via split. Use this in your index.html where you iterate the posts:

{{ post.content | split:'<!--read more-->' | first | append: "…"}} <a href="{{ site.baseurl }}{{ post.url }}">Read more</a>

And you just have to place <!--read more--> wherever in your blog post where you want it to cut off and be replaced by a "… Read More" link.

Upvotes: 1

mnishiguchi
mnishiguchi

Reputation: 2241

I prefer to strip the p tags from post.excerpt first, then append '...'. This way, we can even add "read more" link inside of the p.

<p>
  {{ post.excerpt | strip_html | append: "..." }}

  {% if post.excerpt != post.content %}
    <a href="{{ post.url | prepend: site.baseurl }}"> >></a>
  {% endif %}
</p>

Upvotes: 0

Ross
Ross

Reputation: 2871

In my opinion, a better way is CSS:

.excerpt p:last-child::after {
    content: '..';
}

This adds ".." to the last paragraph's after psuedo-element inside the excerpt div.

<div class="excerpt">
    <p>Normal paragraph.</p>
    <p>Paragraph with trailing ellipsis.</p>
</div>

If you need to do it with Jekyll, you could use the slice filter to cut off the trailing </p> and the append filter to add '...</p>' to the end. This will not work if your excerpt does not end with a paragraph.

Upvotes: 6

Related Questions