Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add support for comments via utterances #65

Open
wants to merge 2 commits into
base: master
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from 1 commit
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
68 changes: 62 additions & 6 deletions README.md
Original file line number Diff line number Diff line change
@@ -1,3 +1,4 @@
<!-- omit from toc -->
# Terminimal

[![Build Status](https://github.com/pawroman/zola-theme-terminimal/actions/workflows/pages/pages-build-deployment/badge.svg)](https://github.com/pawroman/zola-theme-terminimal/actions/workflows/pages/pages-build-deployment)
Expand All @@ -10,6 +11,7 @@ https://pawroman.github.io/zola-theme-terminimal/

Tested with Zola v0.17.2. Please note that earlier versions might not work because of breaking changes across Zola versions.

<!-- omit from toc -->
#### Fork disclaimer

This theme is a fork (not a port) of "Terminal" Hugo theme
Expand All @@ -21,6 +23,37 @@ Many thanks for that outstanding original theme, Radek!
For more information about this fork and the differences to the original theme, please see:
[Changes compared to the original theme](#changes-compared-to-the-original-theme) below.

<!-- omit from toc -->
## Table of contents

- [Versioning](#versioning)
- [How to start](#how-to-start)
- [Shortcodes](#shortcodes)
- [`image`](#image)
- [`figure`](#figure)
- [Features](#features)
- [OpenGraph](#opengraph)
- [Comments](#comments)
- [Configuration](#configuration)
- [Only show the post's description](#only-show-the-posts-description)
- [Colors](#colors)
- [Logo text and link](#logo-text-and-link)
- [Author and copyright](#author-and-copyright)
- [Menu](#menu)
- [Tags](#tags)
- [Pagination](#pagination)
- [Language code](#language-code)
- [Hack font subset](#hack-font-subset)
- [Favicon](#favicon)
- [Page titles](#page-titles)
- [Extending](#extending)
- [How to contribute](#how-to-contribute)
- [Changes compared to the original theme](#changes-compared-to-the-original-theme)
- [New features](#new-features)
- [Features retained from the original](#features-retained-from-the-original)
- [License](#license)


## Versioning

This theme used to be non-versioned, e.g. you'd pull the master branch, and occasionally new features or fixes would
Expand Down Expand Up @@ -81,7 +114,7 @@ Example:
{{ image(src="/img/hello.png", alt="Hello Friend",
position="left", style="border-radius: 8px;") }}
```

### `figure`

Same as `image`, but with a few extra optional arguments:
Expand All @@ -101,7 +134,9 @@ Example:
caption_style="font-style: italic;") }}
```

## OpenGraph
## Features

### OpenGraph

To add an image to a post, set the `og_image` extra option to the desired image
in the same directory of the markdown file:
Expand All @@ -119,6 +154,25 @@ Additionally, for the section pages and for posts to have a fallback image, add
default_og_image = "static/ocean.jpg"
```

### Comments

[utterances] leverages Github issues to provide lightweight and maintenance free
support for comments. To enable utterances, add the following to your `config.toml`:

```toml
[extra.utterances]
enabled = true
repo = "{github_username}/{github_repo}"
post_map = "pathname"
label = "utterances"
theme = "github-dark-orange"
```

See the [utterances] documentation regarding these options:
- [`post_map`](https://utteranc.es/#heading-issue-label)
- [`label`](https://utteranc.es/#heading-mapping)
- [`theme`](https://utteranc.es/#heading-theme)

## Configuration

### Only show the post's description
Expand Down Expand Up @@ -187,7 +241,7 @@ You can set the footer's copyright author name like this:
# copyright text. Apart from author, it will
# contain current year and a link to the theme.
author = "My Name"
```
```

If you don't like the default copyright text,
you can set it to completely custom HTML:
Expand Down Expand Up @@ -216,13 +270,13 @@ menu_items = [
# each of these is optional, name and url are required
# $BASE_URL is going to be substituted by base_url from configuration
{name = "blog", url = "$BASE_URL"},

# tags should only be enabled if you have "tags" taxonomy
# see documentation below for more details
{name = "tags", url = "$BASE_URL/tags"},
{name = "archive", url = "$BASE_URL/archive"},
{name = "about me", url = "$BASE_URL/about"},

# set newtab to true to make the link open in new tab
{name = "github", url = "url-to-your-github", newtab = true},
]
Expand All @@ -239,7 +293,7 @@ taxonomies = [
]
```

Enabling tags will create a new `/tags` page, and
Enabling tags will create a new `/tags` page, and
cause them to show up in `archive` section. Note
that you still need to create a menu link to the tags
page manually.
Expand Down Expand Up @@ -426,3 +480,5 @@ for more information.

The license for Hack fonts used is included in
[LICENSE-Hack.md](../master/LICENSE-Hack.md).

[utterances]: https://utteranc.es/
2 changes: 1 addition & 1 deletion sass/buttons.scss
Original file line number Diff line number Diff line change
Expand Up @@ -81,7 +81,7 @@ a.read-more:active {
padding: 3px 8px;
margin-bottom: 5px;
text-align: center;
font-size: 13px;
font-size: 0.8125rem;
opeik marked this conversation as resolved.
Show resolved Hide resolved
font-weight: 500;
border-radius: 8px;
border: 1px solid transparent;
Expand Down
5 changes: 5 additions & 0 deletions sass/font-hack-subset.scss
Original file line number Diff line number Diff line change
@@ -1,3 +1,8 @@
html {
/* Base font size */
font-size: 16px;
Copy link
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Added an explicit base font size since everything else uses rem, it was already implicitly 16px.

}

/*!
* Hack typeface https://github.com/source-foundry/Hack
* License: https://github.com/source-foundry/Hack/blob/master/LICENSE.md
Expand Down
5 changes: 5 additions & 0 deletions sass/font-hack.scss
Original file line number Diff line number Diff line change
@@ -1,3 +1,8 @@
html {
/* Base font size */
font-size: 16px;
}

/*!
* Hack typeface https://github.com/source-foundry/Hack
* License: https://github.com/source-foundry/Hack/blob/master/LICENSE.md
Expand Down
6 changes: 1 addition & 5 deletions sass/main.scss
Original file line number Diff line number Diff line change
Expand Up @@ -29,8 +29,6 @@ body {
}

h1, h2, h3, h4, h5, h6 {
display: flex;
align-items: center;
font-weight: bold;
Copy link
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

display: flex breaks how inline code blocks are rendered in headings, so I removed it.

line-height: 1.3;
}
Expand Down Expand Up @@ -97,7 +95,7 @@ figure {
}

figcaption {
font-size: 14px;
font-size: 0.875rem;
padding: 5px 10px;
margin-top: 5px;
background: var(--accent);
Expand All @@ -118,7 +116,6 @@ figure {
}

code {
font-family: Hack, DejaVu Sans Mono, Monaco, Consolas, Ubuntu Mono, monospace;
Copy link
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Moved the font family to the font file.

Copy link
Owner

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Hmmm, I don't see this font-family anywhere now. Are you sure it won't break things?

Copy link
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

It's defined here. I've tested the changes locally but it doesn't hurt if you give it a try to sanity check.

font-feature-settings: normal;
background: var(--accent-alpha-20);
padding: 1px 6px;
Expand All @@ -127,7 +124,6 @@ code {
}

pre {
font-family: Hack, DejaVu Sans Mono, Monaco, Consolas, Ubuntu Mono, monospace;
padding: 20px;
font-size: .95rem;
overflow: auto;
Expand Down
4 changes: 2 additions & 2 deletions sass/pagination.scss
Original file line number Diff line number Diff line change
@@ -1,13 +1,13 @@
@import 'variables';

.pagination {
margin-top: 50px;
margin-top: 25px;

&__title {
display: flex;
text-align: center;
position: relative;
margin: 100px 0 20px;
margin: 25px 0 20px;

Copy link
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I adjusted the spacing between the comments and pagination sections so it looked nicer.

&-h {
text-align: center;
Expand Down
1 change: 1 addition & 0 deletions sass/style.scss
Original file line number Diff line number Diff line change
Expand Up @@ -4,5 +4,6 @@
@import 'logo';
@import 'main';
@import 'post';
@import 'comments';
opeik marked this conversation as resolved.
Show resolved Hide resolved
@import 'pagination';
@import 'footer';
15 changes: 15 additions & 0 deletions templates/macros/post.html
Original file line number Diff line number Diff line change
Expand Up @@ -108,3 +108,18 @@ <h1 class="post-title"><a href="{{ page.permalink | safe }}">{{ page.title }}</a
</span>
{% endif -%}
{% endmacro tags %}

{% macro comments(page) %}
{%- if config.extra.utterances.enabled and page.relative_path is not starting_with("pages/") %}
<div class="comments">
<div class="comments__title">
<span class="comments__title-h">comments</span>
<hr />
</div>

<script src="https://utteranc.es/client.js" repo="{{ config.extra.utterances.repo }}"
issue-term="{{ config.extra.utterances.post_map }}" label="{{ config.extra.utterances.label }}"
theme="{{ config.extra.utterances.theme }}" crossorigin="anonymous" async></script>
</div>
{% endif -%}
{% endmacro comments %}
1 change: 1 addition & 0 deletions templates/page.html
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,7 @@
<div class="post">
{{ post_macros::header(page=page) }}
{{ post_macros::content(page=page, summary=false, show_only_description=false) }}
{{ post_macros::comments(page=page) }}
{{ post_macros::earlier_later(page=page) }}
</div>
{% endblock content %}