Post types, tumblr style

support
2

1) The URL structure of your site does not have to mirror the structure of your content/ directory. You can override the URL structure in the permalinks section of config.toml. I mention this because it sounds as if you want everything to appear under posts/, but it would be advantageous to organize your content/ directory differently.

2) Organize your content like this:

content
├── article
│   ├── article-1.md
│   └── article-2.md
├── link
│   ├── link-1.md
│   └── link-2.md
├── photo
│   ├── photo-1.md
│   └── photo-2.md
├── quote
│   ├── quote-1.md
│   └── quote-2.md
└── video
    ├── video-1.md
    └── video-2.md

This has several benefits:

  1. Hugo will infer content type from the first level directory under content/. You will not have to set type in front matter.

  2. You can easily create archetypes:

     archetypes/
 ├── article.md
 ├── default.md
 ├── link.md
 ├── photo.md
 ├── quote.md
 └── video.md

  3. It will be easy to override single and list templates:

    layouts/
├── article
│   ├── list.html
│   └── single.html
└── _default
    ├── baseof.html
    ├── list.html
    └── single.htm

3) If I understand correctly, when listing a mix of content types on a single list page, you want to format each item’s display based on its type.

layouts/_default/list.html:

{{ define "main" }}
  {{ .Content }}
  {{ range .Site.RegularPages }}
    {{ partial (printf "list-page-item/%s.html" .Type) . }}
  {{ end }}
{{ end }}

Then create a directory structure for the partials:

layouts/
└── partials
    └── list-page-item
        ├── article.html
        ├── link.html
        ├── photo.html
        ├── quote.html
        └── video.html

For example, the partial for an article might look like this:

<div class="list-page-item list-page-item-article">
  <h2><a href="{{ .RelPermalink }}">{{ .Title }}</a></h2>
  <p>{{ .Summary }}</p>
  {{- if .Truncated }}
    <p><a href="{{ .RelPermalink }}">Continue reading...</a></p>
  {{- end }}
</div>

while the partial for a quote might look like this:

<div class="list-page-item list-page-item-quote">
  {{ .Content }}
</div>
7 Likes