Hugo

Four issues about the cupper theme (dark button, posting time, and an error)

I am building a static website using the Cupper theme (https://github.com/zwbetz-gh/cupper-hugo-theme).
I have four issues:

1. How can I move the position of dark/light button?
The button is currently located at the bottom of a post. However, I think the readers should be allowed to change between the dark/light scene before they start to read. Therefore I want to move the button to the bottom of the left part of the theme.

2. How can I add more information about posting time on the blog page and in each writing?
The cupper theme currently lists up the postings on the blog page, only with the titles. I want to have more information on the page (posting date and time). Also, in each writing, the theme provides the posting date (e.g. 2019-12-28). However, I want to add up the posting time information (e.g. 2019-12-28 14:24:49).

3. Why the posting disappears on the blog and tag pages when I set the “date” and “publishdate” parameters of the front matter of each posting as that of today?
For example, let’s say I am posting AA on 2019-12-29. When I set the “date” (or “publishdate”) parameter as 2019-12-28 and build the site locally (hugo server), I can see my post and related tags on the blog and tags pages. However, when I reset the “date” (or “publishdate”) parameter as “2019-12-29” and after the local server automatically updates the change, my posting AA has disappeared from the blog and tags pages.

4. Reordering the list of posts in order of the latest.
On the blog page, the oldest post is shown at the top. I want to reverse this rule (i.e. recent posts are on the top and old posts are at the bottom).

Thank you

@zwbetz

Copy the checkbox element and surrounding div from https://github.com/zwbetz-gh/cupper-hugo-theme/blob/master/layouts/partials/footer.html to the location you want, probably the nav partial.

You would edit the list template

And the single post template

See the hugo docs for how to format dates and times.

You are likely future dating your posts. If you want to enable this, pass the CLI flag, or edit your config file.

Remove the .Reverse from here

Thank you for your kind reply. I will try and then reply later.

Almost all the problems I asked were resolved to refer to your reply.
However, I suffered when I dealt with the time formatting, and the resulted solution I found is not what I originally intended and has a problem.

My date/time formatting in the front matter is like this:

date: 2017-01-28 23:37:00+09:00

And I modified <div class="date"> part in zwbetz-gh/cupper-hugo-theme/blob/master/layouts/post/single.html as below:

<div class="date">
  {{ $publishDate := .PublishDate }}
  {{ $Date := .Date }}
  <strong aria-hidden="true"> Author: </strong>{{ .Params.author }} <br>
  <strong aria-hidden="true"> Created date: </strong>{{ $Date }}
  <br>
  <strong aria-hidden="true">Publish date: </strong>{{ $publishDate }}
  {{ with .Lastmod }}
    {{ if gt . $publishDate }}
      <br>
      <strong aria-hidden="true">Last updated: </strong>{{ . }}
    {{ end }}
  {{ end }}
</div>

Then the resulted format is as the following:

2017-01-28 23:37:00 +09:00 KST
  1. What I wanted is the one using UTC (or GME) like this: “2017-01-28 23:37:00 UTC+09:00”
  2. The result has the right local timezone name (KST). However, when I change the time difference (+09:00) to any other values (e.g. -02:00), then the result becomes awkward that the difference is repeated as the following:
2017-01-28 23:37:00 -02:00 -02:00

How can I set the format as what I wanted (using UTC) or How can I correct the problem of the current format?

Thank you

I see you removed the date format code. I would add that back. Then in your config file, use the dateFormat param to specify how you’d like the dates formatted.

Thank you.
Using the dateFormat paramter in config file and "Mon, 02 Jan 2006 15:04:05 MST" (RFC1123) format, I now can represent my date as like “Mon, 30 Dec 2019 23:37:00 -0200” or “Tue, 31 Dec 2019 23:34:00 KST”

1 Like