willfaught / paige Goto Github PK

I noticed that when a front matter has:

tags = ['sliding-window']

it is displayed as Sliding-Window in the menu section.

But front matter containing

tags = ['binary-search']

is displayed as Binary Search in the menu section.

Clicking on both these pills goes to their expected URL of localhost:1313/tags/sliding-window and localhost:1313/tags/binary-search.

Edit

I can see that every tag except Binary Search has a hyphen between words.

Additionally, hyphenation between words is present in tags and categories but not authors. I think there shouldn't be hyphens between words in tags and categories (as is the case with authors), i.e., Binary Search is being displayed correctly but Sliding-Window is not.

Hello, I'm having some issues in replicating the Setup as described in the readme. This is what happens:

$ hugo new site yourproject
Congratulations! Your new Hugo site was created in /tmp/yourproject.

$ cd yourproject 
$ hugo new yourpost.md
Content "/tmp/yourproject/content/yourpost.md" created

$ hugo mod init github.com/carpikes/yourproject
go: creating new go.mod: module github.com/carpikes/yourproject
go: to add module requirements and sums:
	go mod tidy
$ hugo mod get github.com/willfaught/paige@latest

go: added github.com/willfaught/paige v0.80.2

$ cat >>hugo.toml <<EOF
[[module.imports]]                      
path = "github.com/willfaught/paige"
EOF

hugo server -D
Watching for changes in /tmp/yourproject/{archetypes,assets,content,data,i18n,layouts,static}
Watching for config changes in /tmp/yourproject/hugo.toml, /tmp/yourproject/go.mod
Start building sites … 
hugo v0.127.0-74e0f3bd63c51f3c7a0f07a7c779eec9e922957e+extended linux/amd64 BuildDate=2024-06-05T10:27:59Z VendorInfo=gohugoio

Built in 553 ms
Error: error building site: render: failed to render pages: render of "home" failed: "/home/al/.cache/hugo_cache/modules/filecache/modules/pkg/mod/github.com/willfaught/[email protected]/layouts/_default/list.html:5:3": execute of template failed: template: _default/list.html:5:3: executing "main" at <partial "paige/pages.html" $page>: error calling partial: "/home/al/.cache/hugo_cache/modules/filecache/modules/pkg/mod/github.com/willfaught/[email protected]/layouts/partials/paige/pages.html:44:17": execute of template failed: template: partials/paige/pages.html:44:17: executing "partials/paige/pages.html" at <.ByWeight>: can't evaluate field ByWeight in type []interface {}

I'm using arch linux, and I've installed hugo-extended from AUR and dart-sass from the main repos.

$ hugo env      
hugo v0.127.0-74e0f3bd63c51f3c7a0f07a7c779eec9e922957e+extended linux/amd64 BuildDate=2024-06-05T10:27:59Z VendorInfo=gohugoio
GOOS="linux"
GOARCH="amd64"
GOVERSION="go1.22.2"
github.com/sass/libsass="3.6.5"
github.com/webmproject/libwebp="v1.3.2"
github.com/sass/dart-sass/protocol="2.7.1"
github.com/sass/dart-sass/compiler=""
github.com/sass/dart-sass/implementation=""

Does anyone know why this is happening? Thanks!

Paige is a great theme for personal and technical blogs. A reader may want to update a part of the webpage where the information is outdated, incorrect, etc.

Providing a link to the markdown file in the repository is helpful as the reader can create an issue, pull request, etc.

The pages located here have a weight associated with them.

But in this listing on the example site, they appear to be listed by most recently updated.

Listing pages by weight would provide a way to order topics of a section, by difficulty for example.

An error comes up after running "hugo server"

Error: add site dependencies: load resources: loading templates: "/home/failedmesh/hugo-demo/themes/paige/layouts/partials/paige/image.html:42:1": parse failed: template: partials/paige/image.html:42: function "continue" not defined

Codeberg is a privacy respecting GitHub alternative.

The homepage of this theme uses Github's icon at the bottom. It would be nice to have the option of using the Codeberg logo.

Fresh install using blank website with minimal config and example site code + config, both times I get:

hugo on MacOS X

ERROR 2023/04/06 11:14:57 render of "page" failed: "/var/folders/pz/srm5fz5d15n8vz_jfnfhg2k80000gn/T/hugo_cache/modules/filecache/modules/pkg/mod/github.com/willfaught/[email protected]/layouts/_default/baseof.html:14:23": execute of template failed: template: _default/single.html:14:23: executing "_default/single.html" at <partial "paige/header.html" $page>: error calling partial: "/var/folders/pz/srm5fz5d15n8vz_jfnfhg2k80000gn/T/hugo_cache/modules/filecache/modules/pkg/mod/github.com/willfaught/[email protected]/layouts/partials/paige/header.html:3:14": execute of template failed: template: partials/paige/header.html:3:14: executing "partials/paige/header.html" at <$page.Ancestors>: can't evaluate field Ancestors in type *hugolib.pageState
ERROR 2023/04/06 11:14:57 render of "page" failed: "/var/folders/pz/srm5fz5d15n8vz_jfnfhg2k80000gn/T/hugo_cache/modules/filecache/modules/pkg/mod/github.com/willfaught/[email protected]/layouts/_default/baseof.html:14:23": execute of template failed: template: _default/single.html:14:23: executing "_default/single.html" at <partial "paige/header.html" $page>: error calling partial: "/var/folders/pz/srm5fz5d15n8vz_jfnfhg2k80000gn/T/hugo_cache/modules/filecache/modules/pkg/mod/github.com/willfaught/[email protected]/layouts/partials/paige/header.html:3:14": execute of template failed: template: partials/paige/header.html:3:14: executing "partials/paige/header.html" at <$page.Ancestors>: can't evaluate field Ancestors in type *hugolib.pageState
ERROR 2023/04/06 11:14:57 render of "page" failed: "/var/folders/pz/srm5fz5d15n8vz_jfnfhg2k80000gn/T/hugo_cache/modules/filecache/modules/pkg/mod/github.com/willfaught/[email protected]/layouts/_default/baseof.html:14:23": execute of template failed: template: _default/single.html:14:23: executing "_default/single.html" at <partial "paige/header.html" $page>: error calling partial: "/var/folders/pz/srm5fz5d15n8vz_jfnfhg2k80000gn/T/hugo_cache/modules/filecache/modules/pkg/mod/github.com/willfaught/[email protected]/layouts/partials/paige/header.html:3:14": execute of template failed: template: partials/paige/header.html:3:14: executing "partials/paige/header.html" at <$page.Ancestors>: can't evaluate field Ancestors in type *hugolib.pageState
ERROR 2023/04/06 11:14:57 render of "page" failed: "/var/folders/pz/srm5fz5d15n8vz_jfnfhg2k80000gn/T/hugo_cache/modules/filecache/modules/pkg/mod/github.com/willfaught/[email protected]/layouts/_default/baseof.html:14:23": execute of template failed: template: _default/single.html:14:23: executing "_default/single.html" at <partial "paige/header.html" $page>: error calling partial: "/var/folders/pz/srm5fz5d15n8vz_jfnfhg2k80000gn/T/hugo_cache/modules/filecache/modules/pkg/mod/github.com/willfaught/[email protected]/layouts/partials/paige/header.html:3:14": execute of template failed: template: partials/paige/header.html:3:14: executing "partials/paige/header.html" at <$page.Ancestors>: can't evaluate field Ancestors in type *hugolib.pageState
Error: Error building site: failed to render pages: render of "page" failed: "/var/folders/pz/srm5fz5d15n8vz_jfnfhg2k80000gn/T/hugo_cache/modules/filecache/modules/pkg/mod/github.com/willfaught/[email protected]/layouts/_default/baseof.html:14:23": execute of template failed: template: _default/single.html:14:23: executing "_default/single.html" at <partial "paige/header.html" $page>: error calling partial: "/var/folders/pz/srm5fz5d15n8vz_jfnfhg2k80000gn/T/hugo_cache/modules/filecache/modules/pkg/mod/github.com/willfaught/[email protected]/layouts/partials/paige/header.html:3:14": execute of template failed: template: partials/paige/header.html:3:14: executing "partials/paige/header.html" at <$page.Ancestors>: can't evaluate field Ancestors in type *hugolib.pageState
Total in 451 ms

Hello! Thanks for this theme!

I'm hoping to customize the accent colors used and am not sure whether this is possible. The best leads I could find were the color parameter, the dark.css and light.css files, and the color settings in site.webmanifest. None of these had the desired effect of changing the accent color of hyperlinks, nav pills, and icons.

What can I do to change the colors used by this theme? I'm woefully unexperienced with web dev, so I hope I'm not overlooking something obvious :)

Hello, I hope you are well.

I built my website last year and just wanted to update something. I was surprised to find that shortcodes (or at least the shortcode paige/image) don't seem to work anymore. I also tested with the example site provided in the paige repo.

This is the Error when I build it with the hugo command:
"...\Homepage_Builder\content_index.en.md:18:4": failed to extract shortcode: template for shortcode "paige/image" not found

Please help.

follow up of #12 (reply in thread)

By the way, where is coming from?

I dont know... then I found https://discourse.gohugo.io/t/raw-html-omitted-in-templates/43375/8

and added

markup:
  goldmark:
    renderer:
      unsafe: true

to config.yaml, now it works. I was not aware that I need to have that set.

/kind documentation

Hi,
I use your theme and it's great!

I have a question:

• Can we create drop down menus natively?
• If not, can we fork your project and try to add that?
• Is it complicated to do?

I take the architecture of your site as an example.
The idea would be to have a drop down menu when I hover over "Content".
Underneath, "Markdown Syntax Guide", "Rich Content", "Placeholder Text", etc. would appear.
Of course we could say which articles we want or don't want to see in the drop-down menu.
The "Content" page would still exist and be clickable.

Thank you in advance for your answer,
Code-dially

The spacing between tables is not wide enough.

They look pretty cramped in general. More spacing or having lines will make reading the table data easier.

Requesting feature for a configuration which opens external links in a new tab (from discussion #44).

Hello. I'm trying to figure out how to set a custom favicon. It seems from the example website you're supposed to put it in the static directory. Mine looks like this: https://nextcloud.phoebus.club/s/WWnZsBDxMngcycr. I'm aware that putting the favicon images in the /images/ folder probably wouldn't change anything. If I run "hugo server" then I try it on firefox I don't get the icon. If I try it on chromium or brave then I get the icon. When I run hugo and upload the files to my server, then the custom icon doesn't appear even on chromium based browsers. Am I doing something wrong?

Thank you.

Please bring this feature back :)

Categories and tags look really good in a list layout the way the were. When pages were listed in a menu section, there was clear distinction between the title, description, keywords (tags and categories), and author.

1. I followed the tutorial in this project's README file.
2. Then I ran hugo server --debug and here's what I got in return:

$ hugo server --debug 
WARN 2023/04/08 21:33:44 Module "github.com/willfaught/paige" is not compatible with this Hugo version; run "hugo mod graph" for more information.
Start building sites … 
hugo v0.102.3+extended linux/amd64 BuildDate=2022-09-13T20:32:22Z VendorInfo=ubuntu:0.102.3-1ubuntu1
INFO 2023/04/08 21:33:44 syncing static files to /
DEBUG 2023/04/08 21:33:44 Render page My New Hugo Site to "/index.html"
DEBUG 2023/04/08 21:33:44 Render page Categories to "/categories/index.html"
DEBUG 2023/04/08 21:33:44 Render page Tags to "/tags/index.html"
ERROR 2023/04/08 21:33:44 render of "taxonomy" failed: "/tmp/hugo_cache/modules/filecache/modules/pkg/mod/github.com/willfaught/[email protected]/layouts/_default/baseof.html:14:23": execute of template failed: template: _default/taxonomy.html:14:23: executing "_default/taxonomy.html" at <partial "paige/header.html" $page>: error calling partial: "/tmp/hugo_cache/modules/filecache/modules/pkg/mod/github.com/willfaught/[email protected]/layouts/partials/paige/header.html:3:14": execute of template failed: template: partials/paige/header.html:3:14: executing "partials/paige/header.html" at <$page.Ancestors>: can't evaluate field Ancestors in type *hugolib.pageState
ERROR 2023/04/08 21:33:44 render of "taxonomy" failed: "/tmp/hugo_cache/modules/filecache/modules/pkg/mod/github.com/willfaught/[email protected]/layouts/_default/baseof.html:14:23": execute of template failed: template: _default/taxonomy.html:14:23: executing "_default/taxonomy.html" at <partial "paige/header.html" $page>: error calling partial: "/tmp/hugo_cache/modules/filecache/modules/pkg/mod/github.com/willfaught/[email protected]/layouts/partials/paige/header.html:3:14": execute of template failed: template: partials/paige/header.html:3:14: executing "partials/paige/header.html" at <$page.Ancestors>: can't evaluate field Ancestors in type *hugolib.pageState
Error: Error building site: failed to render pages: render of "home" failed: "/tmp/hugo_cache/modules/filecache/modules/pkg/mod/github.com/willfaught/[email protected]/layouts/_default/baseof.html:14:23": execute of template failed: template: _default/home.html:14:23: executing "_default/home.html" at <partial "paige/header.html" $page>: error calling partial: "/tmp/hugo_cache/modules/filecache/modules/pkg/mod/github.com/willfaught/[email protected]/layouts/partials/paige/header.html:3:14": execute of template failed: template: partials/paige/header.html:3:14: executing "partials/paige/header.html" at <$page.Ancestors>: can't evaluate field Ancestors in type *hugolib.pageState
Built in 475 ms

3. Then, as recommended, I ran hugo mod graph and here's what I got in return:

$ hugo mod graph 
WARN 2023/04/08 21:34:14 Module "github.com/willfaught/paige" is not compatible with this Hugo version; run "hugo mod graph" for more information.
github.com/kirisakow/XXXXXXXXXXXX github.com/willfaught/[email protected]

Hi,

I'm having some weird issues with nesting shortcodes, and I'm very unsure what may have caused this, as even the examples you provide have this issue.

Here's an example:

{{< paige/gallery>}}
{{< paige/figure caption="Example." >}}
{{< paige/image src="resized/IMG_0328.jpg" >}}
{{< /paige/figure >}}
{{< /paige/gallery >}}

This produces the following HTML:

<div class="align-items-center d-flex  h-100 justify-content-center  paige-figure ">
<figure class=" mb-0" >
<div class="d-flex justify-content-center text-center"><p>
&lt;span class=&#34;paige-image&#34;&gt;</p>
<p>
&lt;img   crossorigin=&#34;anonymous&#34;   height=&#34;1920&#34;   referrerpolicy=&#34;no-referrer&#34;  src=&#34;<img src="http://localhost:1313/my/article/resized/IMG_0328.0ada02ca179336615ef4c698c34eb4872313f2bd0084b4e573e8b48ddad34475.jpg" alt="http://localhost:1313/my/article/resized/IMG_0328.0ada02ca179336615ef4c698c34eb4872313f2bd0084b4e573e8b48ddad34475.jpg" title="http://localhost:1313/my/article/resized/IMG_0328.0ada02ca179336615ef4c698c34eb4872313f2bd0084b4e573e8b48ddad34475.jpg" />&#34;     width=&#34;1440&#34; &gt;
&lt;/span&gt;</p>
</div>


<figcaption class="figure-caption mt-2 text-center" >Example.</figcaption>

</figure>
</div>

I can get around some of it by using the {{</* tags inside of the first shortcode, but I thought I'd rather ask here since this deviates from the documentation provided.

Thanks, and I hope you can help!

Steps to Reproduce

• Clone the Paige repository and navigate to the exampleSite/ directory

• Create a new page in the content section

  hugo new content/content/test-page.md
  

• Modify file ./content/content/rich-content.md by removing:

  ## Twitter Simple Shortcode
  
  {{< twitter_simple user="DesignReviewed" id="1085870671291310081" >}}
  
  <br>
  
  ---
  

  to fix error ERROR error calling resources.GetRemote ...

• In the front matter of test-page.md, change draft to false and ensure that it's weight is more than all other pages (eg: 100)

• Run the server and navigate to http://localhost:1313/content/

• The page "Test Page" is listed at the top instead of the bottom, even though it has the maximum weight

Observation

List pages by weight only works if the month and year of all pages in the directory are the same.

Related

#50

Is it possible to set a custom favicon?

Thank you

Noticed on this page: https://expidusos.com/en/download/

Download link should be active but not home.

Config: https://github.com/ExpidusOS/website/blob/3cc2948dad696c80cadd2a3c6f6b987b58f734a0/config/_default/languages.en.toml

Hi!

Thanks for your good template. I really like your design.

Currently, I am trying to modify this theme, I want to change the background with vanta.js(https://github.com/tengbao/vanta). However, I don't know where should I start. Could you please give me any guide?

You can see my web in allonsyj.com

Thanks for your help!

The idea is to show a back to top button only after scrolling with CSS.

This article shows some methods that only use CSS, no JS.

I especially like this method with a fading button.

What do you guys think?

I tried to move an exiting site to the theme and hit issues, so I started from scratch using the exact directions in the README. This happened with both Hugo from homebrew and the universal binary downloaded manually from the website. Both are v0.113 extended. Current output of the version downloaded from Hugo's GitHub:

$ hugo version
hugo v0.113.0-085c1b3d614e23d218ebf9daad909deaa2390c9a+extended darwin/amd64 BuildDate=2023-06-05T15:04:51Z VendorInfo=gohugoio

When I run hugo server -D I get the following errors:

WARN 2023/06/10 20:33:03 found no layout file for "html" for kind "page": You should create a template file which matches Hugo Layouts Lookup Rules for this combination.
WARN 2023/06/10 20:33:03 found no layout file for "html" for kind "taxonomy": You should create a template file which matches Hugo Layouts Lookup Rules for this combination.
WARN 2023/06/10 20:33:03 found no layout file for "html" for kind "taxonomy": You should create a template file which matches Hugo Layouts Lookup Rules for this combination.
WARN 2023/06/10 20:33:03 found no layout file for "html" for kind "home": You should create a template file which matches Hugo Layouts Lookup Rules for this combination.

And I get a 404 when trying to access the site... because it's not generating anything. For a normal theme, this would mean it's missing the files in the layouts/ directory for all of those things. I assume this is the same for a module, but I'm not sure where to look at why its not there.

If I run hugo mod vendor no files are placed in the _vendor directory.

Other than what is created by Hugo, I just have the example markdown file from the instructions and my config.toml reads:

[[module.imports]]
path = "github.com/willfaught/paige"

My go.mod file:

module github.com/mmessmore/messmore.org

go 1.20

require github.com/willfaught/paige v0.62.1 // indirect

And go.sum:

github.com/willfaught/paige v0.62.1 h1:QYK5UKRo7CysyNJ/kBtbLyILx6RqEScdr21kbiVf4Ss=
github.com/willfaught/paige v0.62.1/go.mod h1:0Nt8ifl7UVYQIBaMtpZmg+BrQHHzFNqKcrBoA2Oo4/E=

I think there's an issue since the instructions don't work or at least leave out where to go next. I've never used the new Hugo modules before, and I feel pretty stupid for being at a complete loss at how to troubleshoot this to even provide more information.

I have go version go1.20.5 darwin/amd64 and use go with modules all the time. But this module doesn't go into my go mod files.

There is no error about failing to get the module and the hash is showing up in go.sum. I'm baffled.

If this is not truly an issue, but user error, I apologize.

If there's a file with the following content:

---
...
...
front: matter
...
paige: headers
...
...
---

## Some Heading

Some text

```json
{
  "examples": [
    {
      "description": "Placeholder text for description. A really long description that spans the entire width of the screen, such that scrolling to the left is only possible to a limited extent. The leftmost part get cut off.",
      "numbersOne": [1, 3],
      "numbersTwo": [2],
      "output": 2.00
    },
  ]
}

the left-most part of the text gets cut off and is not visible.

I write short descriptions when I highlight text as JSON, but sometimes I'm unable to avoid the width of text in the description. Since this is JSON, I can't split strings over multiple lines.

Is there a setting that I can declare in hugo.toml to make horizontal scrolling work ?

Having long code blocks in a markdown file can get verbose as two different things would need to be maintained - the actual notes / documentation and the code. If the code block has implementation and tests, continuous integration can't be run for it to perform validation and correctness.

Requesting a a Paige shortcode which fetches code from a file in a (public?) repository.

Related: #78

There are a few pages in my site where I have code in 2 programming languages. These code blocks are language-specific implementations of Wikipedia's procedures (sample link). They are around half page in length.

Having multiple tabs would improve readability and provide better organization.

Example "Hello, World!" in JSON, YAML, and TOML

Not sure how well this feature would fit into Paige's design aesthetics.

I am not seeing "500px" in the official bootstrap-icon library. How would I go about calling a custom image to show under social: or could you add support for this?

I am trying to install the theme and do not see the menu. I copied the exampleSite as outlined in #16 .

When I run in the root directory of my repo the command
hugo server --source ./ --themesDir ./themes
I don't see the menu. I also tried
hugo server -D
and I get the same result

When I use the exampleSite directory in the theme, with the below command I see the menu
hugo server --source ./themes/paige/exampleSite --themesDir ../..

With the Social email config in config.yaml, the mailto link

I.e. this is the resulting link from this in config.yaml

  email:
    icon: envelope
    link: mailto:[email protected]
    name: E-mail

is

https://basesite.com/[email protected]

Hi Will, I'm trying to use your gallery shortcode but end up getting an assembly error:

Change detected, rebuilding site.
2023-07-21 12:49:11.915 -0700
DEBUG Rebuild for events ["WRITE         \"D:\\\\ryvaeus.com\\\\content\\\\blog\\\\test.md\""]
DEBUG cachebuster: Matching "content/blog/test.md" with source "assets/.*\\.(js|ts|jsx|tsx)": no match
DEBUG cachebuster: Matching "content/blog/test.md" with source "assets/.*\\.(css|sass|scss)$": no match
DEBUG cachebuster: Matching "content/blog/test.md" with source "(postcss|tailwind)\\.config\\.js": no match
DEBUG cachebuster: Matching "content/blog/test.md" with source "assets/.*\\.(.*)$": no match
Source changed WRITE         "D:\\ryvaeus.com\\content\\blog\\test.md"
INFO  build: running step "process" duration "2.1104ms"
INFO  build: running step "assemble" duration "3.0898ms"
ERROR Rebuild failed: assemble: "D:\ryvaeus.com\content\blog\test.md:1:1": unclosed shortcode
Total in 5 ms

The only thing in my test.md is

---
title: Testing gallery shortcode
date: 2023-07-21T19:48:30.130Z
description: Not sure how it works.
categories:
  - thoughts
tags:
  - tech
series: []
---
{{< paige/gallery align="start" >}}
{{< paige/image height="20rem" src="1-2.jpg" >}}
{{< paige/image height="10rem" src="2-2.jpg" >}}
{{< /paige/gallery />}}

The above gallery shortcode comes directly from your gallery shortcode example page

Hi @willfaught,
I would really like to use the theme but I'm having trouble installing embedded Dart Sass with
brew install sass/sass/[email protected]

In the documentation of Hugo however, they say that you should just use Dart Sass.

"If you have been using Embedded Dart Sass[1] ([https://gohugo.io/hugo-pipes/transpile-sass-to-css/#fn:1]) with Hugo v0.113.0 and earlier, uninstall Embedded Dart Sass, then install Dart Sass. If you have installed both, Hugo will use Dart Sass."

Is there anything that comes to mind that speaks against that?

Could you make a short set of instructions for how to modify the text that is generated by the theme? Specifically, I'd like to stop the paige-reading-time from being generated on every post every time I re-run the server.

When I run the minimal example I receive the following error:

ERROR 2023/03/25 21:46:06 TOCSS-DART: failed to transform "_paige/bootstrap/09cdb4541bc48f98c0f1df7f9bcf96ef9121c473-paige.scss" (text/x-scss): "/Users/stefan/Documents/projects/website-sk9/node_modules/bootstrap/scss/_carousel.scss:0:4": Top-level selectors may not contain the parent selector "&".
ERROR 2023/03/25 21:46:06 TOCSS-DART: failed to transform "_paige/bootstrap/3dc68794edca2b980ea08fad4e2fcb4dc8c98b16-paige.scss" (text/x-scss): "/Users/stefan/Documents/projects/website-sk9/node_modules/bootstrap/scss/_carousel.scss:0:4": Top-level selectors may not contain the parent selector "&".
ERROR 2023/03/25 21:46:06 TOCSS-DART: failed to transform "_paige/bootstrap/d4eec9c255b6f01ee12e559f5dc56ffb40a6f80c-paige.scss" (text/x-scss): "/Users/stefan/Documents/projects/website-sk9/node_modules/bootstrap/scss/_carousel.scss:0:4": Top-level selectors may not contain the parent selector "&".
ERROR 2023/03/25 21:46:06 TOCSS-DART: failed to transform "_paige/bootstrap/26eceb6a87e7e696fd870bf0c3fab59cd1d6f207-paige.scss" (text/x-scss): "/Users/stefan/Documents/projects/website-sk9/node_modules/bootstrap/scss/_carousel.scss:0:4": Top-level selectors may not contain the parent selector "&".
ERROR 2023/03/25 21:46:06 TOCSS-DART: failed to transform "_paige/bootstrap/8c2e467ad18917e1cf1aabd140da319f2ea3a8e0-paige.scss" (text/x-scss): "/Users/stefan/Documents/projects/website-sk9/node_modules/bootstrap/scss/_carousel.scss:0:4": Top-level selectors may not contain the parent selector "&".

Any idea why this happens?

Your LICENSE file is the Apache 2.0 license, but you're using it in a strange way.

Because my website is open source and I modified some of your original files, I have to follow the "Redistribution" part of the Apache 2.0 license, which is section 4.

In simplified terms, section 4 gives these 4 requirements to me:

1. Keep a copy of the Apache 2.0 license.
2. Give notices in files I modified that I modified the files.
3. Retain copyright, etc. notices in the files I modified.
4. Retain a text file named "NOTICE".

Notice that there's no requirement of even giving attribution here. The requirement is rather to retain the notices that exist. You can look at how the Apache Software Foundation does it for an example of how the license is intended to be used. They have a NOTICE file for the copyright notice (such as "Copyright 2017-2023 The Apache Software Foundation") and comments at the start of every code file giving license information.

You have no such notices, so I comply with the license requirements by adding this header to the files I modified:

<!--
This file has been modified from the original Paige theme, which is licensed under the Apache License, Version 2.0.
See https://github.com/willfaught/paige for the Paige theme.
See LICENSES/Apache-2.0 for a copy of the license.
-->

But FYI it would still fulfill the license requirements if I only added this header:

<!--
This file has been modified from the original, which is licensed under the Apache License, Version 2.0.
See LICENSES/Apache-2.0 for a copy of the license.
-->

Just to be clear, there's no legal problem with the way you're currently doing things, and I have no problem complying with these requirements. But it would help me and potentially other open source projects modifying your theme if you either document that you intend to use the license this way and it's not an oversight, or you license this in a less strange way. Either of these will give assurance that my requirements for complying with the license aren't likely to change in the future.

I can try to help with this, but please note that I'm not a lawyer and haven't talked with one. I just read the license closely.

Hi Will, thanks for sharing this. I am a new hugo user, following to readme.md to create my project site locally, and installed

But I have a hard time bring page up as it failed to build:
I followed the steps: https://github.com/willfaught/paige#install

$ cd yourproject

// I installed go with brew to run hugo modules, version: go version go1.20.2 darwin/amd64
// I git init my project, and pushed to github before I ran the below command

$ hugo mod init github.com/youraccount/yourproject
$ hugo mod get github.com/willfaught/paige

// I then copied the config.yaml to my root config.yaml
Example config.yaml:...

and I followed these steps:
https://github.com/willfaught/paige#run

Here is the error I encountered when I run hugo server -D

❯ hugo server -D
Start building sites …
hugo v0.109.0+extended darwin/amd64 BuildDate=unknown
ERROR 2023/03/27 14:37:35 TOCSS-DART: failed to transform "_paige/bootstrap/09cdb4541bc48f98c0f1df7f9bcf96ef9121c473-paige.scss" (text/x-scss): "/var/folders/7q/p2rz5sk92yvbqdp1qscf54l80000gn/T/hugo_cache/modules/filecache/modules/pkg/mod/github.com/willfaught/[email protected]/assets/_paige/bootstrap/paige.scss:4:8": Can't find stylesheet to import.
ERROR 2023/03/27 14:37:35 TOCSS-DART: failed to transform "_paige/bootstrap/451aefe03b3ef6ed172801c7f8e858367faef5fa-paige.scss" (text/x-scss): "/var/folders/7q/p2rz5sk92yvbqdp1qscf54l80000gn/T/hugo_cache/modules/filecache/modules/pkg/mod/github.com/willfaught/[email protected]/assets/_paige/bootstrap/paige.scss:4:8": Can't find stylesheet to import.
ERROR 2023/03/27 14:37:35 TOCSS-DART: failed to transform "_paige/bootstrap/3d2ce0b8055304d87b67a4411675aa20d7d8e676-paige.scss" (text/x-scss): "/var/folders/7q/p2rz5sk92yvbqdp1qscf54l80000gn/T/hugo_cache/modules/filecache/modules/pkg/mod/github.com/willfaught/[email protected]/assets/_paige/bootstrap/paige.scss:4:8": Can't find stylesheet to import.
Error: Error building site: TOCSS-DART: failed to transform "_paige/bootstrap/8c2e467ad18917e1cf1aabd140da319f2ea3a8e0-paige.scss" (text/x-scss): "/var/folders/7q/p2rz5sk92yvbqdp1qscf54l80000gn/T/hugo_cache/modules/filecache/modules/pkg/mod/github.com/willfaught/[email protected]/assets/_paige/bootstrap/paige.scss:4:8": Can't find stylesheet to import.
Built in 483 ms

Please help!
Thanks!

Is there any info on how to setup this? I like the look of this theme but I can't seem to figure out the GA4 setup.

On this webpage, there are two pages - "Style Data" and "Show Data". These pages have weights 10 and 20 respectively. When navigating to the "Style Data" page and scrolling to the bottom, ← Show Data is displayed instead of → Show Data.

The arrow ← indicates previous and → indicates next. Since the page "Show Data" has a higher weight and is also listed after "Style Data", → Show Data should be displayed to correctly reflect this.

Hi! I'm having an issue with taxonomies not showing up in their collection pages, similar to this issue.

My taxonomies in hugo.toml are

[taxonomies]
series = 'gamemagazine, gamebrosph, inquirer, unboxguru'
category = 'thoughts, crosspost, work'
tag = 'article, gaming, gadget, list, quotes, review, social'

And the front matter on a page I'm testing it out contains

---
title: 10 Videogames That Changed My Life
date: 2013-12-17T02:51:01.266Z
description: null
categories:
  - thoughts
tags:
  - gaming
  - list
series:
  - gamebrosph
---

The file tree looks like

.
└─ content
   ├─ blog
   │      └─ _index.md
   │      └─ 10-videogames-that-changed-my-life.md
   ├─ categories
   │  ├─ crosspost
   │  │  └─ _index.md
   │  ├─ thoughts
   │  │  └─ _index.md
   │  ├─ work
   │  │  └─ _index.md
   ├─ series
   │  ├─ gamebrosph
   │  │  └─ _index.md
   │  ├─ gamemagazine
   │  │  └─ _index.md
   │  ├─ inquirer
   │  │  └─ _index.md
   │  ├─ unboxguru
   │  │  └─ _index.md
   │  └─ _index.md
   ├─ tags
   │  ├─ article
   │  │  └─ _index.md
   │  ├─ gadget
   │  │  └─ _index.md
   │  ├─ gaming
   │  │  └─ _index.md
   │  ├─ list
   │  │  └─ _index.md
   │  ├─ quotes
   │  │  └─ _index.md
   │  ├─ review
   │  │  └─ _index.md
   │  ├─ social
   │  │  └─ _index.md
   │  └─ _index.md
   ├─ _index.md
   └─ search.md

... among other directories/files of course. Each _index.md only contains a description and title front matter, and the ones in categories and tags also have layout: "paige/cloud".

I get no errors building the site, and see no noteworthy output in the debug logs when running hugo server --disableFastRender --log-level debug. The output of hugo env on my local machine is

hugo v0.115.2-8966424e0e521fb1627216a84efd2c5d5917cb0d+extended windows/amd64 BuildDate=2023-07-08T17:06:56Z VendorInfo=gohugoio
GOOS="windows"
GOARCH="amd64"
GOVERSION="go1.20.1"
github.com/sass/libsass="3.6.5"
github.com/webmproject/libwebp="v1.2.4"
github.com/sass/dart-sass-embedded/protocol="1.2.0"
github.com/sass/dart-sass-embedded/compiler="1.62.1"
github.com/sass/dart-sass-embedded/implementation="1.62.1"

I'll see about putting my site up on github shortly for easier examination. Appreciate any insight. Thanks!

Edit: I've created a github project and deployed it with Cloudflare Pages.

Can't pass parameter "style" to paige/img shortcode, I think image.html should look like this:

{{ $alt := .Get "alt" }}
{{ $link := .Get "link" }}
{{ $height := .Get "height" }}
{{ $maxheight := .Get "maxheight" }}
{{ $maxwidth := .Get "maxwidth" }}
{{ $method := .Get "method" }}
{{ $options := .Get "options" }}
{{ $style := .Get "style" }}
{{ $src := .Get 0 | default (.Get "src") }}
{{ $title := .Get "title" }}
{{ $width := .Get "width" }}

{{ if not $src }}
    {{ errorf "paige/image: no content" }}
{{ end }}

{{ $content := partial "paige/img.html" (dict
    "alt" $alt
    "class" "img-fluid"
    "height" $height
    "maxheight" $maxheight
    "maxwidth" $maxwidth
    "method" $method
    "options" $options
    "style" $style
    "page" .Page
    "src" $src
    "title" $title
    "width" $width
) }}

{{ if $link }}
    {{ $content = partial "paige/a.html" (dict
        "content" $content
        "href" $link
    ) }}
{{ end }}

<div class="paige-image">{{ $content }}</div>

cheers

There's a way to specify copyright text in the configuration file like:

copyright = "© Firstname Lastname"

Requesting a feature to make the credit configurable. Currently if it is specified in the front matter, "Paige Theme" is displayed at the bottom. I'm looking to add text like "Powered by Paige theme" or "Powered by Hugo's Paige theme".

Also requesting a feature to make the license text visible in a similar manner.
For example "Code snippets are MIT licensed" at the bottom of this page

When I try to run hugo server -D, I get the following error:

Error: add site dependencies: load resources: loading templates: "/tmp/hugo_cache/modules/filecache/modules/pkg/mod/github.com/willfaught/[email protected]/layouts/partials/paige/image.html:42:1": parse failed: template: partials/paige/image.html:42: function "continue" not defined

The site fails to compile. Here is my Hugo environment if it's helpful:

hugo v0.92.2+extended linux/amd64 BuildDate=2023-01-31T11:11:57Z VendorInfo=ubuntu:0.92.2-1ubuntu0.1 GOOS="linux" GOARCH="amd64" GOVERSION="go1.18.1"

Unable to build site due to error below... any idea what I'm doing wrong?

Start building sites …
hugo v0.111.1-39a4a3cf676533859217805c36181c7a3dfa321c+extended windows/amd64 BuildDate=2023-03-02T10:08:26Z VendorInfo=gohugoio
ERROR 2023/03/08 16:36:18 render of "taxonomy" failed: "C:\Users\jrcha\OneDrive\Documents\hugo\justinryanc\themes\paige\layouts_default\baseof.html:33:11": execute of template failed: template: _default/taxonomy.html:33:11: executing "_default/taxonomy.html" at <partial "paige/scripts.html" $page>: error calling partial: "C:\Users\jrcha\OneDrive\Documents\hugo\justinryanc\themes\paige\layouts\partials\paige\scripts.html:47:3": execute of template failed: template: partials/paige/scripts.html:47:3: executing "partials/paige/scripts.html" at <partial "paige/script.html" (dict "src" "paige/bootstrap/bootstrap.bundle.js")>: error calling partial: "C:\Users\jrcha\OneDrive\Documents\hugo\justinryanc\themes\paige\layouts\partials\paige\script.html:20:26": execute of template failed: template: partials/paige/script.html:20:26: executing "partials/paige/script.html" at <$href>: undefined variable: $href
ERROR 2023/03/08 16:36:18 render of "taxonomy" failed: "C:\Users\jrcha\OneDrive\Documents\hugo\justinryanc\themes\paige\layouts_default\baseof.html:33:11": execute of template failed: template: _default/taxonomy.html:33:11: executing "_default/taxonomy.html" at <partial "paige/scripts.html" $page>: error calling partial: "C:\Users\jrcha\OneDrive\Documents\hugo\justinryanc\themes\paige\layouts\partials\paige\scripts.html:47:3": execute of template failed: template: partials/paige/scripts.html:47:3: executing "partials/paige/scripts.html" at <partial "paige/script.html" (dict "src" "paige/bootstrap/bootstrap.bundle.js")>: error calling partial: "C:\Users\jrcha\OneDrive\Documents\hugo\justinryanc\themes\paige\layouts\partials\paige\script.html:20:26": execute of template failed: template: partials/paige/script.html:20:26: executing "partials/paige/script.html" at <$href>: undefined variable: $href
Error: Error building site: failed to render pages: render of "home" failed: "C:\Users\jrcha\OneDrive\Documents\hugo\justinryanc\themes\paige\layouts_default\baseof.html:33:11": execute of template failed: template: _default/list.html:33:11: executing "_default/list.html" at <partial "paige/scripts.html" $page>: error calling partial: "C:\Users\jrcha\OneDrive\Documents\hugo\justinryanc\themes\paige\layouts\partials\paige\scripts.html:47:3": execute of template failed: template: partials/paige/scripts.html:47:3: executing "partials/paige/scripts.html" at <partial "paige/script.html" (dict "src" "paige/bootstrap/bootstrap.bundle.js")>: error calling partial: "C:\Users\jrcha\OneDrive\Documents\hugo\justinryanc\themes\paige\layouts\partials\paige\script.html:20:26": execute of template failed: template: partials/paige/script.html:20:26: executing "partials/paige/script.html" at <$href>: undefined variable: $href
Built in 16 ms

Hugo is still pretty new territory for me, so please let me know if I've approached this the wrong way. That said, I have hunted for an official way, or best practice for making use of web fonts, but standard method seems to be entirely missing.

That is, it seems it's open to theme developers to implement this, should they choose to.

At the moment, in order to make updating the theme simpler, I've resorted to overriding only the head.html partial. I modify it to point to paige/myLinks.html and paige/myStyle.html, instead of the original paige/links.html and paige/style.html partials respectively.

{{ partial "paige/myLinks.html" $page }}
{{ partial "paige/myStyle.html" $page }}

Having created those files, they then reference the original partials, so any theme updates to those are sustained, but it still permits me to include my custom additions:

paige/myLinks.html

{{ $page := . }}
{{ partial "paige/links.html" $page }}

<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Roboto:wght@300&display=swap" rel="stylesheet">

paige/myStyle.html

{{ $page := . }}
{{ partial "paige/style.html" $page }}

<style>
    body, html {
        font-family: 'Roboto', sans-serif;
    }
</style>

Whilst this is working, theme updates to /themes/paige/layouts/partials/paige/head.html will be missed unless I manually review it each time. I wonder you might consider a more elegant way to reference web fonts with theme support, within config.toml / .yaml, etc.

I have an issue where we're deploying to a hosted platform on Azure (Azure Static Websites) which supports Hugo. However, the build system doesn't allow custom install of linux packages for me to rely on. To workaround this, I am installing and untaring the relevant dart embedded tarball as a pre-build step. It should work after this where I have the executable added to the environment path. But it isn't. So my question is, isn't just unzipping the tarball and adding it to the environment path, enough?

Pre-build step output for the install:

/opt/sass_embedded:
total 8
-rwxr-xr-x 1 root root  614 Mar 23 23:25 dart-sass-embedded
drwxr-xr-x 2 root root 4096 Apr  5 20:41 src

/opt/sass_embedded/src:
total 8804
-rw-r--r-- 1 root root   76090 Mar 23 23:25 LICENSE
-rwxr-xr-x 1 root root 5153880 Mar 23 23:25 dart
-rw-r--r-- 1 root root 3777328 Mar 23 23:25 dart-sass-embedded.snapshot

and the path is :

PATH=/opt/sass_embedded:/opt/hugo/0.111.3:/usr/local/go/bin:/opt/python/latest/bin:/opt/oryx:/opt/yarn/stable/bin:/opt/hugo/lts:/usr/local/sbin:/usr/local/bin:/usr/sbin:/usr/bin:/sbin:/bin

And here's the Hugo build failure:

error calling partial: "/github/workspace/themes/paige/layouts/partials/paige/link.html:30:35": execute of template failed: template: partials/paige/link.html:30:35: executing "partials/paige/link.html" at <toCSS (dict "enableSourceMap" $enablesourcemap "includePaths" $includepaths "outputStyle" $outputstyle "transpiler" "dartsass")>: error calling toCSS: exec: "dart-sass-embedded": executable file not found in $PATH

When trying to build exampleSite on Windows, it errors, but in Ubuntu, it is working.

cd exampleSite
hugo --themesDir ../..

Start building sites …
hugo v0.109.0-47b12b83e636224e5e601813ff3e6790c191e371 windows/amd64 BuildDate=2022-12-23T10:38:11Z VendorInfo=gohugoio
ERROR 2023/01/10 12:54:41 render of "page" failed: "D:\a\github-actions-testing\github-actions-testing\paige\layouts\_default\baseof.html:5:7": execute of template failed: template: _default/single.html:5:7: executing "_default/single.html" at <partial "paige/head.html" .>: error calling partial: "D:\a\github-actions-testing\github-actions-testing\paige\layouts\partials\paige\head.html:4:7": execute of template failed: template: partials/paige/head.html:4:7: executing "partials/paige/head.html" at <partial "paige/links.html" .>: error calling partial: execute of template failed: template: partials/paige/links.html:16:3: executing "partials/paige/links.html" at <partial "paige/link.html" (dict "href" (.Site.Params.paige.bootstrap.style.link_href | default "https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css") "integrity" .Site.Params.paige.bootstrap.style.link_integrity "remote" .Site.Params.paige.bootstrap.style.remote)>: error calling partial: execute of template failed: template: partials/paige/link.html:11:21: executing "partials/paige/link.html" at <partial "paige/func-resource.html" (dict "page" $page "url" $href)>: error calling partial: "D:\a\github-actions-testing\github-actions-testing\paige\layouts\partials\paige\func-resource.html:11:25": execute of template failed: template: partials/paige/func-resource.html:11:25: executing "partials/paige/func-resource.html" at <resources.GetMatch>: error calling GetMatch: runtime error: invalid memory address or nil pointer dereference
ERROR 2023/01/10 12:54:41 render of "page" failed: "D:\a\github-actions-testing\github-actions-testing\paige\layouts\_default\baseof.html:5:7": execute of template failed: template: _default/single.html:5:7: executing "_default/single.html" at <partial "paige/head.html" .>: error calling partial: "D:\a\github-actions-testing\github-actions-testing\paige\layouts\partials\paige\head.html:4:7": execute of template failed: template: partials/paige/head.html:4:7: executing "partials/paige/head.html" at <partial "paige/links.html" .>: error calling partial: execute of template failed: template: partials/paige/links.html:16:3: executing "partials/paige/links.html" at <partial "paige/link.html" (dict "href" (.Site.Params.paige.bootstrap.style.link_href | default "https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css") "integrity" .Site.Params.paige.bootstrap.style.link_integrity "remote" .Site.Params.paige.bootstrap.style.remote)>: error calling partial: execute of template failed: template: partials/paige/link.html:11:21: executing "partials/paige/link.html" at <partial "paige/func-resource.html" (dict "page" $page "url" $href)>: error calling partial: "D:\a\github-actions-testing\github-actions-testing\paige\layouts\partials\paige\func-resource.html:11:25": execute of template failed: template: partials/paige/func-resource.html:11:25: executing "partials/paige/func-resource.html" at <resources.GetMatch>: error calling GetMatch: runtime error: invalid memory address or nil pointer dereference
ERROR 2023/01/10 12:54:41 render of "page" failed: "D:\a\github-actions-testing\github-actions-testing\paige\layouts\_default\baseof.html:5:7": execute of template failed: template: _default/paige/search.html:5:7: executing "_default/paige/search.html" at <partial "paige/head.html" .>: error calling partial: "D:\a\github-actions-testing\github-actions-testing\paige\layouts\partials\paige\head.html:4:7": execute of template failed: template: partials/paige/head.html:4:7: executing "partials/paige/head.html" at <partial "paige/links.html" .>: error calling partial: execute of template failed: template: partials/paige/links.html:16:3: executing "partials/paige/links.html" at <partial "paige/link.html" (dict "href" (.Site.Params.paige.bootstrap.style.link_href | default "https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css") "integrity" .Site.Params.paige.bootstrap.style.link_integrity "remote" .Site.Params.paige.bootstrap.style.remote)>: error calling partial: execute of template failed: template: partials/paige/link.html:11:21: executing "partials/paige/link.html" at <partial "paige/func-resource.html" (dict "page" $page "url" $href)>: error calling partial: "D:\a\github-actions-testing\github-actions-testing\paige\layouts\partials\paige\func-resource.html:11:25": execute of template failed: template: partials/paige/func-resource.html:11:25: executing "partials/paige/func-resource.html" at <resources.GetMatch>: error calling GetMatch: runtime error: invalid memory address or nil pointer dereference
ERROR 2023/01/10 12:54:41 render of "page" failed: "D:\a\github-actions-testing\github-actions-testing\paige\layouts\_default\baseof.html:5:7": execute of template failed: template: _default/single.html:5:7: executing "_default/single.html" at <partial "paige/head.html" .>: error calling partial: "D:\a\github-actions-testing\github-actions-testing\paige\layouts\partials\paige\head.html:4:7": execute of template failed: template: partials/paige/head.html:4:7: executing "partials/paige/head.html" at <partial "paige/links.html" .>: error calling partial: execute of template failed: template: partials/paige/links.html:16:3: executing "partials/paige/links.html" at <partial "paige/link.html" (dict "href" (.Site.Params.paige.bootstrap.style.link_href | default "https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css") "integrity" .Site.Params.paige.bootstrap.style.link_integrity "remote" .Site.Params.paige.bootstrap.style.remote)>: error calling partial: execute of template failed: template: partials/paige/link.html:11:21: executing "partials/paige/link.html" at <partial "paige/func-resource.html" (dict "page" $page "url" $href)>: error calling partial: "D:\a\github-actions-testing\github-actions-testing\paige\layouts\partials\paige\func-resource.html:11:25": execute of template failed: template: partials/paige/func-resource.html:11:25: executing "partials/paige/func-resource.html" at <resources.GetMatch>: error calling GetMatch: runtime error: invalid memory address or nil pointer dereference
Error: Error building site: failed to render pages: render of "page" failed: "D:\a\github-actions-testing\github-actions-testing\paige\layouts\_default\baseof.html:5:7": execute of template failed: template: _default/single.html:5:7: executing "_default/single.html" at <partial "paige/head.html" .>: error calling partial: "D:\a\github-actions-testing\github-actions-testing\paige\layouts\partials\paige\head.html:4:7": execute of template failed: template: partials/paige/head.html:4:7: executing "partials/paige/head.html" at <partial "paige/links.html" .>: error calling partial: execute of template failed: template: partials/paige/links.html:16:3: executing "partials/paige/links.html" at <partial "paige/link.html" (dict "href" (.Site.Params.paige.bootstrap.style.link_href | default "https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css") "integrity" .Site.Params.paige.bootstrap.style.link_integrity "remote" .Site.Params.paige.bootstrap.style.remote)>: error calling partial: execute of template failed: template: partials/paige/link.html:11:21: executing "partials/paige/link.html" at <partial "paige/func-resource.html" (dict "page" $page "url" $href)>: error calling partial: "D:\a\github-actions-testing\github-actions-testing\paige\layouts\partials\paige\func-resource.html:11:25": execute of template failed: template: partials/paige/func-resource.html:11:25: executing "partials/paige/func-resource.html" at <resources.GetMatch>: error calling GetMatch: runtime error: invalid memory address or nil pointer dereference
Total in 246 ms

Thank you for sharing this theme with a lot features. Wonder if you plan to support
https://github.com/dimsemenov/photoswipe ?
Thank you.

Is there a way of enabling only light/dark mode?