web-dev-qa-db-ja.com

投稿のプレビューを表示するには？ （Jekyll Bootstrap themeを使用）

これはおそらく簡単な質問ですが、デフォルトのページに投稿のプレビューを表示するにはどうすればよいですか？私はJekyll BootstrapテーマTomを使用しています。

jekyll
39
dsawler

関数 here を調べると、strip_htmlとtruncatewordsが見つかりました。

75ワードのプレビューテキストを含む「投稿リスト」の例を次に示します。

<ul >
    {% for post in site.posts limit 4 %}
    <li><span>{{ post.date | date_to_string }}</span> &raquo; <a href="{{ BASE_PATH }}{{ post.url }}">{{ post.title }}</a></li>
        {{ post.content | strip_html | truncatewords:75}}<br>
            <a href="{{ post.url }}">Read more...</a><br><br>
    {% endfor %}
</ul>
48
Talon876

これは少なくとも1.0.0以降でも機能し、組み込みで簡単に使用できます。

<ul>
  {% for post in site.posts %}
    <li>
      <a href="{{ post.url }}">{{ post.title }}</a>
      <p>{{ post.excerpt }}</p>
    </li>
  {% endfor %}
</ul>

こちら を参照してください。

45
kmikael

WordPressの<!--more-->コメントアプローチが気に入ったので、次のように書きました。

_plugins/more.rb：

module More
    def more(input, type)
        if input.include? "<!--more-->"
            if type == "excerpt"
                input.split("<!--more-->").first
            elsif type == "remaining"
                input.split("<!--more-->").last
            else
                input
            end
        else
            input
        end
    end
end

Liquid::Template.register_filter(More)

投稿は次のようになります。

---
layout: post
title: "Your post title"
published: true
---
<p>This is the excerpt.</p>
<!--more-->
<p>This is the remainder of the post.</p>

その後、次のようにテンプレートで使用できます。

抜粋を表示（<!--more-->コメントの上にあるすべて）：

<summary>{{ post.content | more: "excerpt" }}</summary>

残りを表示（<!--more-->コメントの後のすべて）：

<article>{{ post.content | more: "remaining" }}</article>

excerptまたはremaining以外の引数は、投稿全体を表示するだけです。

14
matb33

これは古い質問ですが、@ Talon876の回答 here で指摘されているように、フォーマットの問題の回避策を追加したいと考えています。

各投稿の終わりに</em>,</strong> or </b>のような終了タグを追加することはそれほどうまくいかないかもしれませんが、抜粋を表示しながらフォーマットを維持します。

例えば：

<ul >
    {% for post in site.posts limit 4 %}
    <li><span>{{ post.date | date_to_string }}</span> &raquo; <a href="{{ BASE_PATH }}{{ post.url }}">{{ post.title }}</a></li>
        {{ post.content | strip_html | truncatewords:75}}
</em></strong>  <!-- This is what does the task-->
<br>
            <a href="{{ post.url }}">Read more...</a><br><br>
    {% endfor %}
</ul>
1
light94