2017-12-13 12 views
1

私はすべての投稿が順番にリストされたジーケルページを作成しようとしています。問題は、いくつかのポストが異なるレイアウトを使用し、ポストフロントマターで指定されるということです。投稿の個々のページ出力を無効にしました(実際にカスタムカテゴリ)ので、レイアウトは部分的です。例えばジキル/液体で1ページに異なるレイアウトの投稿を結合する

は、私はいくつかの赤いポストと緑のポストを持っていると言う:

_posts/01_post1.md

--- 
layout: redpost 
--- 
Post 1 (red) 

_posts/02_post2.md

--- 
layout: greenpost 
--- 
Post 2 (green) 

正しいレイアウトを使用してこれらを処理したい。私はまた、{%include%}の使用を排除すると考えられる継承を使用することを好むでしょう。

_layouts/post.html

<article class="post"> 
{{ content }} 
</article> 

_layouts/redpost.html

--- 
layout: post 
--- 
<div style="color:red"> 
{{ content }} 
</div> 

その後、私のトップレベルのページに、私はすべての記事をループにしたいです、適切なテンプレートを使用してレンダリングし、結果を連結します。明らかに、RENDERフィルタは存在しませんが、おそらく私はドキュメントの名前を見つけることができませんでした。

_layouts/index.htmlを

<html> 
... 
{% for post in site.posts %} 
{{ post | RENDER }} 
{% endfor %} 
</html> 

所望の最終的なHTMLは、その後、次のようになります。

<html> 
<article class="post"> 
    <div style="color:red"> 
    <p>Post 1 (red)</p> 
    </div> 
</article> 
<article class="post"> 
    <div style="color:green"> 
    <p>Post 2 (green)</p> 
    </div> 
</article> 
</html> 

が、これはプラグインなしで可能ですか?

+1

継承とはどういう意味ですか?それ以外の場合、これは 'greenpost.html'というインクルードでは完全に可能です。 – JoostS

+0

@JoostS継承は、あるレイアウト自体に 'layout:parentlayout'という前件がある場合です。子レイアウトでコンテンツをカスタマイズできる間に、共有ヘッダーやフッターなどで親レイアウトを作成できます。 https://learn.cloudcannon.com/jekyll/introduction-to-jekyll-layouts/#layout-inheritanceを参照してください。 – Quantum7

+0

テストプロジェクトで私の回答とJoostSの両方をテストしました。コード:https://github.com/sbliven/jekyll-template-inheritance/blob/master/README.mdデモ:https://sbliven.github.io/jekyll-template-inheritance/ – Quantum7

答えて

1

解決策は簡単ではありませんでした。そのため、ドキュメントには記載されていません。ドキュメントオブジェクトは、直接印刷するだけで、正しいテンプレートでレンダリングされます。

{% for post in site.posts %} 
    {{ post }} 
{% endfor %} 
0

次の点に問題がありますか?私の解決策のようだ。

_layoutsの/のindex.htmlを:

<html> 
... 
{% for post in site.posts %} 
    {% include post.html %} 
{% endfor %} 
</html> 

_includes/post.html:

<article class="post"> 
    {% if post.layout == 'greenpost' %} 
    {% include greenpost.html %} 
    {% endif %} 
</article> 

_includes/greenpost.html:

<div style="color:green"> 
    {{ post.content }} 
</div> 
+0

インクルードを使用するこのアプローチでは、 '_includes/post.html'にはそれぞれの可能なレイアウトの行が含まれている必要があります。 – Quantum7

関連する問題