steffen/website
1
0
Fork 0
Code Actions Packages Releases Activity

Replace hard coded archive pages with new layouts

Browse Source
This commit is contained in:
Michael Rose
2018-03-20 14:39:40 -04:00
parent ffef5a93de
commit ba5d25c419
13 changed files with 59 additions and 112 deletions
Download Patch File Download Diff File Expand all files Collapse all files

54
docs/_docs/10-layouts.md
View File

@@ -142,11 +142,11 @@ Below are sample archive pages you can easily drop into your project, taking car
* [All Posts Grouped by Collection -- List View][posts-collection]
* [Portfolio Collection -- Grid View][portfolio-collection]
[posts-categories]: https://github.com/{{ site.repository }}/blob/master/docs/_pages/category-archive.html
[posts-tags]: https://github.com/{{ site.repository }}/blob/master/docs/_pages/tag-archive.html
[posts-year]: https://github.com/{{ site.repository }}/blob/master/docs/_pages/year-archive.html
[posts-categories]: https://github.com/{{ site.repository }}/blob/master/docs/_pages/category-archive.md
[posts-tags]: https://github.com/{{ site.repository }}/blob/master/docs/_pages/tag-archive.md
[posts-year]: https://github.com/{{ site.repository }}/blob/master/docs/_pages/year-archive.md
[posts-collection]: https://github.com/{{ site.repository }}/blob/master/docs/_pages/collection-archive.html
[portfolio-collection]: https://github.com/{{ site.repository }}/blob/master/docs/_pages/portfolio-archive.html
[portfolio-collection]: https://github.com/{{ site.repository }}/blob/master/docs/_pages/portfolio-archive.md
Post and page excerpts are auto-generated by Jekyll which grabs the first paragraph of text. To override this text with something more specific use the following YAML Front Matter:
@@ -158,34 +158,18 @@ excerpt: "A unique line of text to describe this post that will display in an ar
Adding `type=grid` to the `archive-single` helper will display archive posts in a 4 column grid. For example to create an archive displaying all documents in the portfolio collection:
**Step 1:** Create a portfolio archive page (eg. `_pages/portfolio-archive.html`) with the following YAML Front Matter:
Create a portfolio archive page (eg. `_pages/portfolio-archive.md`) with the following YAML Front Matter:
```yaml
---
layout: archive
title: "Portfolio"
title: Portfolio
layout: collection
permalink: /portfolio/
author_profile: false
collection: portfolio
entries_layout: grid
---
```
**Step 2:** Loop over all documents in the portfolio collection and output in a grid:
```html
{% raw %}<div class="grid__wrapper">
{% for post in site.portfolio %}
{% include archive-single.html type="grid" %}
{% endfor %}{% endraw %}
</div>
```
To produce something like this:
<figure>
<img src="{{ '/assets/images/mm-archive-grid-view-example.jpg' | absolute_url }}" alt="archive grid view example">
<figcaption>Grid view example.</figcaption>
</figure>
Teaser images are assigned similar to header images using the following YAML Front Matter:
```yaml
@@ -202,32 +186,22 @@ If you have the luxury of using Jekyll plugins, the creation of category and tag
![archive taxonomy layout example]({{ "/assets/images/mm-layout-archive-taxonomy.png" | absolute_url }})
If you're not using the `jekyll-archives` plugin then you need to create archive pages yourself. Sample taxonomy archives can be found by grabbing the HTML sources below and adding to your site.
If you're not using the `jekyll-archives` plugin then you need to create archive pages yourself. Sample taxonomy archives can be found by grabbing the Markdown sources below and adding to your site.
| Name | HTML Source |
| -------------------- | --- |
| [Categories Archive](https://mmistakes.github.io/minimal-mistakes/categories/) | [category-archive.html](https://github.com/mmistakes/minimal-mistakes/blob/master/docs/_pages/category-archive.html) |
| [Tags Archive](https://mmistakes.github.io/minimal-mistakes/tags/) | [tag-archive.html](https://github.com/mmistakes/minimal-mistakes/blob/master/docs/_pages/tag-archive.html) |
| [Categories Archive](https://mmistakes.github.io/minimal-mistakes/categories/) | [category-archive.md](https://github.com/mmistakes/minimal-mistakes/blob/master/docs/_pages/category-archive.md) |
| [Tags Archive](https://mmistakes.github.io/minimal-mistakes/tags/) | [tag-archive.md](https://github.com/mmistakes/minimal-mistakes/blob/master/docs/_pages/tag-archive.md) |
The **Tags Archive** page that responds to urls such as `/tags/#tips` looks something like this:
```html
---
layout: archive
permalink: /tags/
title: "Posts by Tag"
layout: tags
permalink: /tags/
author_profile: true
---
{% raw %}{% include group-by-array collection=site.posts field="tags" %}
{% for tag in group_names %}
{% assign posts = group_items[forloop.index0] %}
<h2 id="{{ tag | slugify }}" class="archive__subtitle">{{ tag }}</h2>
{% for post in posts %}
{% include archive-single.html %}
{% endfor %}
{% endfor %}{% endraw %}
```
## Home Page Layout