Add Author

1. Add a new author

Add a new author by creating the following file. content/en/authors/jim-jones/_index.md

Inside the file add the following content

---
title: "Jim Jones"
name: "Jim Jones"
avatar: "images/team/jim-jones.jpg"
---

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Bibendum arcu vitae elementum curabitur vitae nunc sed. Tortor at risus viverra adipiscing at in.

Make sure to add the author image in static/images/team/jim-jones.jpg - normally I make these images 400x400px square.

2. Link the author from a blog post

Open up an existing blog post file content/en/posts/designing-your-brand.md

Edit the frontmatter authors field changing it from authors: ['Mike Vance'] to authors: ['Jim Jones']


Technical Explaination

author is defined as a custom taxonomy in config.toml

The logic that renders the author avatar is found in themes/hugo-advance/layouts/partials/components/author.html

{{- range .Params.authors }}
    {{- with $.Site.GetPage "taxonomyTerm" (printf "authors/%s" (urlize .)) }}
        {{ if .Params.avatar }}
            <img src="{{ .Params.avatar | relURL }}" alt="{{ .Params.name }}"/>
        {{ end }}
        <a class="mr-1" href="{{ .Permalink }}">{{ .Params.name }}</a>
    {{ end }}
{{ end }}

We use the Hugo GetPage function to lookup the author page and extract the image path. This function accepts a url path ie “/authors/jim-jones”. We construct this path use the urlize function which converts the value found in authors: ["Jim Jones"] into jim-jones and we use printf "authors/%s" to concatenate the string into /authors/jim-jones"