maride/hugo-theme-terminal
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Update documentation for single page website layout

Browse Source
This commit is contained in:
Justin Nguyen 2021-01-14 20:46:48 -08:00
parent 1b08c1579e
commit 75f3e7bce2
11 changed files with 99 additions and 48 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
COMMUNITY-FEATURES.md
View File

@ -19,3 +19,7 @@ eg:
- **Portfolio** (https://github.com/Louisload/hugo-theme-terminal-portfolio)
- Allows you to create a portfolio page (or several). Supports icons and subsections.
- Luís Rodrigues Alves (Louisload), a game dev and musician.
- **Single Page Website** (https://github.com/justinnuwin/hugo-theme-terminal)
- Allows the theme to natively support a single-page-website layout where the navigation menu links correspond to sections on the homepage
- Justin Nguyen, a software developer working on cool projects like satellites, IoT, and edge-ML

35
README.md
View File

@ -145,6 +145,29 @@ paginate = 5
# it's set to `true` by default
# oneHeadingSize = false
# Single Page Sites have the links in their navigation menu point to sections on the
# main-single page. If `singlePageSite` is enabled the following will occur:
# - Sections will appear on the homepage corresponding to nav menu items with a url
# beginning with "/#". These sections draw their content from the homepage content
# type directory (content/homepage/<somesection>.md).
# - Nav menu items not beginning with "/#" will be also be rendered as sections on the
# homepage either as paginated lists or also as sections depending on what the url is
# pointing to.
# - Nav menu items with their identifier in the `homepageNavEntriesDontRender` list will
# not be rendered on the homepage.
# The homepage sections will be rendered in the order of the nav menu entries.
# enable the sngle page site mode described above
singlePageSite = false
# for collections rendered on the hompage, you may want them to be paginated at a different
# (usually smaller) count compared to the actual list pages
homepagePaginateCount = 2
# If there is a nav menu entry you dont want rendered on the homepage, add the identifier here
homepageNavEntriesDontRender = ["showcase"]
[params.twitter]
# set Twitter handles for Twitter cards
# see https://developer.twitter.com/en/docs/tweets/optimize-with-cards/guides/getting-started#card-and-content-attribution
@ -169,6 +192,8 @@ paginate = 5
[languages.en.params.logo]
logoText = "Terminal"
logoHomeLink = "/"
# If your logo text is long, you can have it split on a certain substring when the screen is narrow
# logoSplit = ""
[languages.en.menu]
[[languages.en.menu.main]]
@ -189,6 +214,16 @@ to `config.toml` file in your Hugo root directory and change params fields. In c
See the basic `post` file params supported by the theme — https://github.com/panr/hugo-theme-terminal/blob/master/archetypes/posts.md
## Section archetype
Similar to the `post` archetype, but only the title and cover parameters are used.
A `layout` parameter is available which supports three values:
- `2col-right`: 2 column layout where the cover image is displayed on the left and the front-matter on the right
- `2col-left`: 2 column layout where the cover image is displayed on the right and the front-matter on the left
- `default`: The default layout matching the post layout with the cover image appearing above the front-matter in a single column
## Add-ons
- **Comments** — for adding comments to your blog posts please take a look at `layouts/partials/comments.html` https://github.com/panr/hugo-theme-terminal/blob/master/layouts/partials/comments.html.

1
USERS.md
View File

@ -47,6 +47,7 @@
- https://markopolo123.github.io **Markopolo** (DevOps Engineer)
- https://mcwertgaming.github.io **Damon Leven** (Student & Software Developer)
- https://sethsimmons.me **Seth Simmons** (Information Security Engineer, Cryptocurrency Writer)
- https://justinnuwin.com **Justin Nguyen** (Software Developer)
<!--
TEMPLATE:

2
archetypes/homepage-section.md
View File

@ -1,5 +1,5 @@
+++
title = "{{ replace .TranslationBaseName "-" " " | title }}"
cover = ""
layout = "post" # Can be post (1 column), 2col-left, 2col-right
layout = "default"
+++

11
assets/css/section.css
View File

@ -21,10 +21,6 @@
position: relative;
margin: auto;
/* Vertical Align */
top: 50%;
transform: translateY(-50%);
/* Resize */
display: block;
max-height: 80em;
@ -77,6 +73,13 @@
}
/* Shift section image down by half to be in the middle of the text column */
.section-2col .section-cover {
/* Vertical Align */
top: 50%;
transform: translateY(-50%);
}
.section > .post {
margin-top: 0;
padding-top: 0;

12
exampleSite/config.toml
View File

@ -9,12 +9,8 @@ paginate = 10
showMenuItems = 2
fullWidthTheme = false
centerTheme = false
# singlePageSite moves pages from the main nav menu to sections on the homepage.
# Only menu items with a url starting with "/#" will be displayed using the
# front matter defined in "homepage/". The standard collection is displayed for other menu items.
singlePageSite = true
homepagePaginateCount = 10 # If you want the homepage to paginate a different numebr of items
singlePageSite = false
homepageNavEntriesDontRender = ["showcase"]
[languages]
[languages.en]
@ -32,9 +28,9 @@ paginate = 10
[languages.en.menu]
[[languages.en.menu.main]]
identifier = "homepage-info"
identifier = "section"
name = "Homepage Section"
url = "#/section"
url = "/#section"
[[languages.en.menu.main]]
identifier = "about"
name = "About"

8
exampleSite/content/homepage/section.md
View File

@ -4,9 +4,9 @@ cover = "img/hello.jpg"
layout = "2col-right"
+++
**Hi there!** This is a section dedicated for a homepage.
This is a section dedicated for a single-page-site homepage.
There are 3 layouts supported for the homepage sections:
- `2col-right` - The layout for this section with the cover image appearing on the left and the front-matter on the right
- `2col-left` - The layout for this section has the cover image on the right and front-matter on the left
- `default` - The default layout for the section matching the post layout with the image appearing above the front-matter
- `2col-right` - Two column layout for this section with the cover image appearing on the left and the front-matter on the right
- `2col-left` - Two column layout for this section has the cover image on the right and front-matter on the left
- `default` - The default layout for the section matching the post layout with the cover image appearing above the front-matter in a single column

2
exampleSite/content/post/hello.md
View File

@ -2,7 +2,7 @@
title = "Hello Friend"
date = "2019-01-25"
author = "Lorem Ipsum"
cover = "hello.jpg"
cover = "img/hello.jpg"
description = "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam nec interdum metus. Aenean rutrum ligula sodales ex auctor, sed tempus dui mollis. Curabitur ipsum dui, aliquet nec commodo at, tristique eget ante."
+++

62
layouts/_default/index.html
View File

@ -20,34 +20,42 @@
{{ if $.Site.Params.singlePageSite }}
<div class="sections">
{{ range .Site.Menus.main }}
<section id="{{ .Identifier }}" class="posts section">
{{ if eq (first 2 .URL) "/#" }}
<h1 class="section-header">{{ .Name }}<a href="#{{ .Identifier }}" class="hanchor" arialabel="Anchor">⌗</a></h1>
<div class="post">
{{ $section := path.Join "homepage" .Identifier }}
{{ with $.Site.GetPage $section }}
{{ partial "section.html" . }}
{{ end }}
</div>
{{ else }}
<h1 class="section-header">{{ .Name }}<a href="{{ .URL }}" class="hanchor" arialabel="Anchor">⌗</a></h1>
{{ $thisSectionsPages := where $PageContext.RegularPages "Type" .Identifier }}
{{ range first $.Site.Params.homepagePaginateCount $thisSectionsPages.ByDate.Reverse }}
{{ partial "collection.html" . }}
{{ end }}
<div class="pagination">
<div class="pagination__buttons">
<span class="button previous">
<a href="{{ .URL }}">
<span class="button__icon">→</span>
<span class="button__text">See more {{ .Name | pluralize }}</span>
</a>
</span>
{{ if not (in $.Site.Params.homepageNavEntriesDontRender .Identifier) }}
<section id="{{ .Identifier }}" class="posts section">
{{ if eq (first 2 .URL) "/#" }}
<h1 class="section-header">{{ .Name }}<a href="#{{ .Identifier }}" class="hanchor" arialabel="Anchor">⌗</a></h1>
<div class="post">
{{ $section := path.Join "homepage" .Identifier }}
{{ with $.Site.GetPage $section }}
{{ partial "section.html" . }}
{{ end }}
</div>
</div>
{{ end }}
</section>
<hr class="section-separator">
{{ else }}
<h1 class="section-header">{{ .Name }}<a href="{{ .URL }}" class="hanchor" arialabel="Anchor">⌗</a></h1>
{{ $thisSectionsPages := where $PageContext.RegularPages "Type" .Identifier }}
{{ if len $thisSectionsPages }}
{{ range first $.Site.Params.homepagePaginateCount $thisSectionsPages.ByDate.Reverse }}
{{ partial "collection.html" . }}
{{ end }}
<div class="pagination">
<div class="pagination__buttons">
<span class="button previous">
<a href="{{ .URL }}">
<span class="button__icon">→</span>
<span class="button__text">See more {{ .Name | pluralize }}</span>
</a>
</span>
</div>
</div>
{{ else }}
{{ with $.Site.GetPage .URL }}
{{ partial "section.html" . }}
{{ end }}
{{ end }}
{{ end }}
</section>
<hr class="section-separator">
{{ end }}
{{ end }}
</div>
{{ else }}

8
layouts/partials/footer.html
View File

@ -7,8 +7,12 @@
<div class="copyright">
<span>© {{ now.Year }} Powered by <a href="http://gohugo.io">Hugo</a></span>
{{ end }}
<span>::</span>
<span>Theme originally by <a href="https://twitter.com/panr">panr</a> and extended by <a href="https://github.com/justinnuwin/hugo-theme-terminal/">yours truly</a>.</span>
{{ if not $.Site.Params.singlePageSite }}
<span>:: Theme made by <a href="https://twitter.com/panr">panr</a></span>
{{ else }}
<span>::</span>
<span>Theme made by <a href="https://twitter.com/panr">panr</a> and single-page layout by <a href="https://justinnuwin.com">justinnuwin</a>.</span>
{{ end }}
</div>
</div>
</footer>

2
static/assets/style.css
View File

File diff suppressed because one or more lines are too long