mirror of
https://github.com/imfing/hextra.git
synced 2025-07-01 23:28:01 -04:00
Compare commits
5 Commits
Author | SHA1 | Date | |
---|---|---|---|
88b0f1b2ab | |||
a31b46f5e3 | |||
6641d36b98 | |||
e42d01898a | |||
6cd4c55613 |
@ -19,18 +19,29 @@ We have provided a [GitHub Actions workflow](https://docs.github.com/en/pages/ge
|
|||||||
|
|
||||||
## Start as New Project
|
## Start as New Project
|
||||||
|
|
||||||
### Prerequisites
|
There are two main ways to add the Hextra theme to your Hugo project.
|
||||||
|
|
||||||
Before we start, make sure we have [Hugo](https://gohugo.io/) installed.
|
1. **Hugo Modules (Recommended)**: The simplest and recommended method. [Hugo modules](https://gohugo.io/hugo-modules/) let you pull in the theme directly from its online source. Theme is downloaded automatically and managed by Hugo.
|
||||||
Please refer to Hugo's [official installation guide](https://gohugo.io/installation/) for more details.
|
|
||||||
|
|
||||||
[Hugo modules](https://gohugo.io/hugo-modules/) are the recommended way to manage Hugo themes. To use Hugo modules, we need to install [Git](https://git-scm.com/) and [Go](https://go.dev/).
|
2. **Git Submodule**: Alternatively, add Hextra as a [Git Submodule](https://git-scm.com/book/en/v2/Git-Tools-Submodules). The theme will be downloaded by Git and stored in your project's `themes` folder.
|
||||||
|
|
||||||
|
### Setup Hextra as Hugo module
|
||||||
|
|
||||||
|
#### Prerequisites
|
||||||
|
|
||||||
|
Before starting, you need to have the following softwares installed:
|
||||||
|
|
||||||
|
- [Hugo (extended version)](https://gohugo.io/installation/)
|
||||||
|
- [Git](https://git-scm.com/)
|
||||||
|
- [Go](https://go.dev/)
|
||||||
|
|
||||||
|
#### Steps
|
||||||
|
|
||||||
{{% steps %}}
|
{{% steps %}}
|
||||||
|
|
||||||
### Initialize a new Hugo site
|
### Initialize a new Hugo site
|
||||||
|
|
||||||
```bash
|
```shell
|
||||||
$ hugo new site my-site --format=yaml
|
$ hugo new site my-site --format=yaml
|
||||||
```
|
```
|
||||||
|
|
||||||
@ -45,7 +56,7 @@ $ hugo mod init github.com/username/my-site
|
|||||||
$ hugo mod get github.com/imfing/hextra
|
$ hugo mod get github.com/imfing/hextra
|
||||||
```
|
```
|
||||||
|
|
||||||
Edit `hugo.yaml` to enable Hextra theme:
|
Configure `hugo.yaml` to use Hextra theme by adding the following:
|
||||||
|
|
||||||
```yaml
|
```yaml
|
||||||
module:
|
module:
|
||||||
@ -55,7 +66,7 @@ module:
|
|||||||
|
|
||||||
### Create your first content pages
|
### Create your first content pages
|
||||||
|
|
||||||
Let's create a new content page for the home page and the documentation page:
|
Let's create new content page for the home page and the documentation page:
|
||||||
|
|
||||||
```shell
|
```shell
|
||||||
$ hugo new content/_index.md
|
$ hugo new content/_index.md
|
||||||
@ -73,20 +84,101 @@ Voila! You can see your new site at `http://localhost:1313/`.
|
|||||||
{{% /steps %}}
|
{{% /steps %}}
|
||||||
|
|
||||||
|
|
||||||
## Update Theme
|
|
||||||
|
|
||||||
{{% details title="How to update theme?" %}}
|
{{% details title="How to update theme?" %}}
|
||||||
|
|
||||||
To update the theme to the [latest released version](https://github.com/imfing/hextra/releases), run the following command:
|
To update all Hugo modules in your project to their latest versions, run the following command:
|
||||||
|
|
||||||
```shell
|
```shell
|
||||||
$ hugo mod get -u
|
$ hugo mod get -u
|
||||||
```
|
```
|
||||||
|
|
||||||
|
To update only Hextra to the [latest released version](https://github.com/imfing/hextra/releases), run the following command:
|
||||||
|
|
||||||
|
```shell
|
||||||
|
hugo mod get -u github.com/imfing/hextra
|
||||||
|
```
|
||||||
|
|
||||||
See [Hugo Modules](https://gohugo.io/hugo-modules/use-modules/#update-all-modules) for more details.
|
See [Hugo Modules](https://gohugo.io/hugo-modules/use-modules/#update-all-modules) for more details.
|
||||||
|
|
||||||
{{% /details %}}
|
{{% /details %}}
|
||||||
|
|
||||||
|
### Setup Hextra as Git submodule
|
||||||
|
|
||||||
|
#### Prerequisites
|
||||||
|
|
||||||
|
Before starting, you need to have the following softwares installed:
|
||||||
|
|
||||||
|
- [Hugo (extended version)](https://gohugo.io/installation/)
|
||||||
|
- [Git](https://git-scm.com/)
|
||||||
|
|
||||||
|
#### Steps
|
||||||
|
|
||||||
|
{{% steps %}}
|
||||||
|
|
||||||
|
### Initialize a new Hugo site
|
||||||
|
|
||||||
|
```shell
|
||||||
|
$ hugo new site my-site --format=yaml
|
||||||
|
```
|
||||||
|
|
||||||
|
### Add Hextra theme as a Git submodule
|
||||||
|
|
||||||
|
```shell
|
||||||
|
git submodule add https://github.com/imfing/hextra.git themes/hextra
|
||||||
|
```
|
||||||
|
|
||||||
|
Configure `hugo.yaml` to use Hextra theme by adding the following:
|
||||||
|
|
||||||
|
```yaml
|
||||||
|
theme: hextra
|
||||||
|
```
|
||||||
|
|
||||||
|
### Create your first content pages
|
||||||
|
|
||||||
|
Let's create new content page for the home page and the documentation page:
|
||||||
|
|
||||||
|
```shell
|
||||||
|
$ hugo new content/_index.md
|
||||||
|
$ hugo new content/docs/_index.md
|
||||||
|
```
|
||||||
|
|
||||||
|
### Preview the site locally
|
||||||
|
|
||||||
|
```shell
|
||||||
|
$ hugo server --buildDrafts --disableFastRender
|
||||||
|
```
|
||||||
|
|
||||||
|
Voila! You can see your new site at `http://localhost:1313/`.
|
||||||
|
|
||||||
|
{{% /steps %}}
|
||||||
|
|
||||||
|
|
||||||
|
When using [CI/CD](https://en.wikipedia.org/wiki/CI/CD) for Hugo website deployment, it's essential to ensure that the following command is executed before running the `hugo` command.
|
||||||
|
|
||||||
|
```shell
|
||||||
|
git submodule update --init
|
||||||
|
```
|
||||||
|
|
||||||
|
Failure to run this command will result in the theme folder not being populated with Hextra theme files, leading to a build failure.
|
||||||
|
|
||||||
|
|
||||||
|
{{% details title="How to update theme?" %}}
|
||||||
|
|
||||||
|
To update all submodules in your repository to their latest commits, run the following command:
|
||||||
|
|
||||||
|
```shell
|
||||||
|
$ git submodule update --remote
|
||||||
|
```
|
||||||
|
|
||||||
|
To update only Hextra to the latest commit, run the following command:
|
||||||
|
|
||||||
|
```shell
|
||||||
|
git submodule update --remote themes/hextra
|
||||||
|
```
|
||||||
|
|
||||||
|
See [Git submodules](https://git-scm.com/book/en/v2/Git-Tools-Submodules) for more details.
|
||||||
|
|
||||||
|
{{% /details %}}
|
||||||
|
|
||||||
## Next
|
## Next
|
||||||
|
|
||||||
|
12
i18n/en.yaml
12
i18n/en.yaml
@ -1,7 +1,9 @@
|
|||||||
onThisPage: "On this page"
|
backToTop: "Scroll to top"
|
||||||
|
changeLanguage: "Change language"
|
||||||
|
changeTheme: "Change theme"
|
||||||
|
copyright: "© 2023 Hextra Project."
|
||||||
editThisPage: "Edit this page on GitHub →"
|
editThisPage: "Edit this page on GitHub →"
|
||||||
lastUpdated: "Last updated on"
|
lastUpdated: "Last updated on"
|
||||||
|
onThisPage: "On this page"
|
||||||
backToTop: "Scroll to top"
|
readMore: "Read more →"
|
||||||
|
searchPlaceholder: "Search..."
|
||||||
copyright: "© 2023 Hextra Project."
|
|
||||||
|
9
i18n/ko.yaml
Normal file
9
i18n/ko.yaml
Normal file
@ -0,0 +1,9 @@
|
|||||||
|
backToTop: "맨위로 스크롤"
|
||||||
|
changeLanguage: "언어변경"
|
||||||
|
changeTheme: "테마변경"
|
||||||
|
copyright: "© 2023 Hextra Project."
|
||||||
|
editThisPage: "Github에서 편집하기 →"
|
||||||
|
lastUpdated: "마지막 수정일자"
|
||||||
|
onThisPage: "페이지 목차"
|
||||||
|
readMore: "더보기 →"
|
||||||
|
searchPlaceholder: "검색..."
|
@ -1,4 +1,5 @@
|
|||||||
{{ define "main" }}
|
{{ define "main" }}
|
||||||
|
{{- $readMore := (T "readMore") | default "Read more →" -}}
|
||||||
<div class='mx-auto flex {{ partial "utils/page-width" . }}'>
|
<div class='mx-auto flex {{ partial "utils/page-width" . }}'>
|
||||||
{{ partial "sidebar.html" (dict "context" . "disableSidebar" true "displayPlaceholder" true) }}
|
{{ partial "sidebar.html" (dict "context" . "disableSidebar" true "displayPlaceholder" true) }}
|
||||||
<article class="w-full break-words flex min-h-[calc(100vh-var(--navbar-height))] min-w-0 justify-center pb-8 pr-[calc(env(safe-area-inset-right)-1.5rem)]">
|
<article class="w-full break-words flex min-h-[calc(100vh-var(--navbar-height))] min-w-0 justify-center pb-8 pr-[calc(env(safe-area-inset-right)-1.5rem)]">
|
||||||
@ -11,7 +12,7 @@
|
|||||||
<h3><a style="color: inherit; text-decoration: none;" class="block font-semibold mt-8 text-2xl " href="{{ .RelPermalink }}">{{ .Title }}</a></h3>
|
<h3><a style="color: inherit; text-decoration: none;" class="block font-semibold mt-8 text-2xl " href="{{ .RelPermalink }}">{{ .Title }}</a></h3>
|
||||||
<p class="opacity-80 mt-6 leading-7">
|
<p class="opacity-80 mt-6 leading-7">
|
||||||
{{- partial "utils/page-description" . }}
|
{{- partial "utils/page-description" . }}
|
||||||
<span class="inline-block"> <a class="text-[color:hsl(var(--primary-hue),100%,50%)] underline underline-offset-2 decoration-from-font" href="{{ .RelPermalink }}">Read more →</a> </span>
|
<span class="inline-block"> <a class="text-[color:hsl(var(--primary-hue),100%,50%)] underline underline-offset-2 decoration-from-font" href="{{ .RelPermalink }}">{{ $readMore }}</a> </span>
|
||||||
</p>
|
</p>
|
||||||
<p class="opacity-50 text-sm mt-6 leading-7">{{ partial "utils/format-date" .Date }}</p>
|
<p class="opacity-50 text-sm mt-6 leading-7">{{ partial "utils/format-date" .Date }}</p>
|
||||||
</div>
|
</div>
|
||||||
|
@ -26,7 +26,7 @@
|
|||||||
<div class="{{ $borderClass }} sticky bottom-0 flex flex-col items-start gap-2 pb-8 dark:border-neutral-800 contrast-more:border-t contrast-more:border-neutral-400 contrast-more:shadow-none contrast-more:dark:border-neutral-400">
|
<div class="{{ $borderClass }} sticky bottom-0 flex flex-col items-start gap-2 pb-8 dark:border-neutral-800 contrast-more:border-t contrast-more:border-neutral-400 contrast-more:shadow-none contrast-more:dark:border-neutral-400">
|
||||||
{{- if site.Params.editURL.enable -}}
|
{{- if site.Params.editURL.enable -}}
|
||||||
{{- $editURL := site.Params.editURL.base | default "" -}}
|
{{- $editURL := site.Params.editURL.base | default "" -}}
|
||||||
{{- with .File -}}{{ $editURL = urls.JoinPath $editURL .Path }}{{- end -}}
|
{{- with .File -}}{{ $editURL = urls.JoinPath $editURL (replace .Path "\\" "/") }}{{- end -}}
|
||||||
{{- with .Params.editURL -}}{{ $editURL = .Params.editURL }}{{- end -}}
|
{{- with .Params.editURL -}}{{ $editURL = .Params.editURL }}{{- end -}}
|
||||||
<a class="text-xs font-medium text-gray-500 hover:text-gray-900 dark:text-gray-400 dark:hover:text-gray-100 contrast-more:text-gray-800 contrast-more:dark:text-gray-50" href="{{ $editURL }}" target="_blank" rel="noreferer">{{ $editThisPage }}</a>
|
<a class="text-xs font-medium text-gray-500 hover:text-gray-900 dark:text-gray-400 dark:hover:text-gray-100 contrast-more:text-gray-800 contrast-more:dark:text-gray-50" href="{{ $editURL }}" target="_blank" rel="noreferer">{{ $editThisPage }}</a>
|
||||||
{{- end -}}
|
{{- end -}}
|
||||||
|
@ -17,8 +17,8 @@
|
|||||||
<div class="overflow-x-auto mt-6 flex rounded-lg border py-2 ltr:pr-4 rtl:pl-4 contrast-more:border-current contrast-more:dark:border-current {{ $class }}">
|
<div class="overflow-x-auto mt-6 flex rounded-lg border py-2 ltr:pr-4 rtl:pl-4 contrast-more:border-current contrast-more:dark:border-current {{ $class }}">
|
||||||
<div class="select-none text-xl ltr:pl-3 ltr:pr-2 rtl:pr-3 rtl:pl-2" style='font-family: "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";'>{{ $emoji }}</div>
|
<div class="select-none text-xl ltr:pl-3 ltr:pr-2 rtl:pr-3 rtl:pl-2" style='font-family: "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";'>{{ $emoji }}</div>
|
||||||
<div class="w-full min-w-0 leading-7">
|
<div class="w-full min-w-0 leading-7">
|
||||||
<p class="mt-6 leading-7 first:mt-0">
|
<div class="mt-6 leading-7 first:mt-0">
|
||||||
{{ .Inner | markdownify }}
|
{{ .Inner | markdownify }}
|
||||||
</p>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
Reference in New Issue
Block a user