I am trying to write code in “moto” list.html section. I would like to display all pages from “auta” section with paging. So, I need to display posts from another section with paging.
I use hugo v0.96.
I am not sure, why it’s not working with paging.
Not working code with paging:
{{ $cars := (where .Site.AllPages ".Section" "auta") }}
{{ $paginator := .Paginate $cars }}
{{ range $paginator.Pages}}
<div class="col-xl-3 col-lg-4 col-sm-6">
<h3 class="h6 text-uppercase mb-1"><a class="text-dark product-name" href="{{ .RelPermalink }}">{{ .Title }}</a></h3>
</div>
{{ end}}
Working code without paging:
{{ $cars := (where .Site.AllPages ".Section" "auta") }}
{{ range $cars }}
<div class="col-xl-3 col-lg-4 col-sm-6">
<h3 class="h6 text-uppercase mb-1"><a class="text-dark product-name" href="{{ .RelPermalink }}">{{ .Title }}</a></h3>
</div>
{{ end}}
Where’s the problem?
Please, help me. Thank you very much
The problem has been solved. .Paginate can be only one time on same page.
I had .Paginate in header (out of this code). And it's not posibble override (by official docs of Hugo)
Related
I'm working with Hugo and have a question regarding where clause. Currently I am doing the following and it works fine. I attempted to add one more where argument and I got the error below:
Question: How do I add multiple nested arguments to Hugo where clause. I will continue to test it out in the meantime.
Error calling where: can't evaluate the array by no match argument or more than or equal to two arg:uments
Works:
{{ range where (where site.Pages "Type" "post") "Params.type" "featured" }}
<div class="ph1-ns w-50-ns flex">
{{ .Render "li" }}
</div>
{{ end }}
</div>
Fails:
{{ range where (where site.Pages "Type" "post") "Params.type" "featured" "Params.location" "nashville" }}
<div class="ph1-ns w-50-ns flex">
{{ .Render "li" }}
</div>
{{ end }}
</div>
Per Hugo:
Nest where Clauses
You can also nest where clauses to drill down on lists of content by more than one parameter. The following first grabs all pages in the “blog” section and then ranges through the result of the first where clause and finds all pages that are not featured:
I was able to resolve this, after reading some additional information at https://pkg.go.dev/text/template#pkg-overview; I went with the below.
<div class="w-100 flex-ns mhn1-ns flex-wrap mb3">
{{ range where (where site.Pages "Type" "post") "Params.featured" "!=" nil }}
{{ if(eq .Params.location "nashville")}}
<div class="ph1-ns w-50-ns flex">
{{ .Render "li" }}
</div>
{{ else}}
Coming Soon
{{end}}
{{end}}
</div>
I'm using Hugo to build my own website
I'm having a problem I have a _index.html page, and that is my homepage
But when I try to loop over posts, it just prints text no posts are shown
{{ range .Pages.ByDate }}
<div class="w-full md:w-1/2 md:px-3 mt-6">
<article class="h-full flex flex-col rounded-lg shadow-lg>
<h1>Post</h1>
</article>
{{ end }}
Where is _index.html located? If it's under content/, then raw Go-Template code will not work there. If it's under layouts/, then it is a Go Template but it is not the correct name for the layout of your home page. Possible names for the home-page layout file include:
layouts/index.html
layouts/home.html
layouts/_default/index.html
layouts/_default/home.html
(and more)
For details, see:
https://gohugo.io/templates/homepage/
https://gohugo.io/templates/lookup-order/#examples-layout-lookup-for-home-page
After you figure out what directory and what file name you want to use, you probably want to use something other than this inside the range:
<h1>Post</h1>
For example, maybe this:
<h2>{{ .Title }}</h2>
You could do the following:
{{ range ( where .Site.RegularPages "Type" "posts" ) }}
<h4>{{ .Title }}</h4>
{{ end }
Where posts is the name of the directory containing the posts (i.e., your_blog/content/posts in my case where I renamed posts directory to blog the above will look like this:
{{ range ( where .Site.RegularPages "Type" "blog" ) }}
<h4>{{ .Title }}</h4>
{{ end }
According to the Hugo content summary guide, I can define a summary in 3 ways (listed in order of highest preference):
Use the <!--more--> tag to tell how much of the article Hugo should use as the summary
Use the summary variable in the front matter in order to use a custom summary
Let Hugo by default use the first 70 words of the article
First and foremost, here is the template I have for individual pages:
{{ partial "header" . }}
{{ partial "nav" . }}
<section class="section">
<div class="container">
<div class="subtitle tags is-6 is-pulled-right">
{{ if .Params.tags }}
{{ partial "tags" .Params.tags }}
{{ end }}
</div>
{{if not .Date.IsZero }}
<h2 class="subtitle is-6">{{ .Date.Format "January 2, 2006" }}</h2>
{{ end }}
<h1 class="title">{{ .Title }}</h1>
{{ if .Site.Params.Info.related }}
<div class="related">{{ partial "related" . }}</div>
{{ end }}
<div class="content">
<h1 id="summary">Summary</h1>
{{ .Summary }}
<h1 id="toc">Table of Contents</h1>
{{ .TableOfContents }}
{{ .Content }}
</div>
</div>
</section>
{{ partial "footer" . }}
Here is a sample article I made:
---
title: "Test"
date: 2019-11-23T19:51:44-06:00
draft: true
summary: "This is a simple placeholder summary defined in the front matter"
---
This is a simple placeholder written in the article
# Section 1
Hello world!
The title and date render just fine, however, the summary is ignored and the words from the article as used as the summary:
I then used the <!--more--> tag like so:
---
title: "Test"
date: 2019-11-23T19:51:44-06:00
draft: true
summary: "This is a simple placeholder summary defined in the front matter"
---
This is a simple placeholder written in the article
<!--more-->
# Section 1
Hello world!
It worked like a charm...
So methods 1 and 3 for content summaries work, but method 2 does not. Is there a reason why I can't get the summary front matter to render?
This feature was introduce in Hugo 0.55.0 via issue #5800.
Upgrade to Hugo 0.55.0 or above to solve the issue
The documentation for hugo says the the .Pages variable inside the context of the single page is blank and that the .Pages variable from the context of the list page is populated.
I want to access the .Pages variable from the list page INSIDE the context of the single page.
How do I do this?
Documentation is below:
Worked through the issue here is what I came up with. This snippet:
{{ $currentPage := . }}
{{ range .Site.Pages }}
{{ if .InSection $currentPage}}
{{ if .IsAncestor $currentPage }}
{{ else }}
<li>
<a class="nav-link active" href="{{.Permalink}}">{{.Title}}</a>
</li>
{{ end }}
{{ end }}
{{ end }}
I have this as my template:
{{ partial "header.html" . }}
<div style="padding-top:50px"></div>
<div class="grid">
<div style="background-color: #fce473; padding: 10px" class="{{ .Params.left_col_size }}">
<h1>left</h1>
<div class="grid">
<div id="content2"></div>
{{ partial "ui-components/barchart_content2.html" }}
</div>
</div>
<div style="background-color: #7bbf51; padding: 10px" class="{{ .Params.right_col_size }}">
right
</div>
</div>
{{ .Content }}
{{ partial "footer.html" . }}
which successfully loads the partial "ui-components/barchart_content2.html".
However, what I really want to is something like this:
....
<div id="content2"></div>
{{ partial "ui-components/{{ Params.ui-component }}" }}
....
and then in the content do this:
+++
....
ui-component = "barchart_content2.html"
+++
so that the content editors can choose which partial is rendered without having to touch the html template.
Is something like this possible in Hugo? thanks
Yes, you can use the printf function to do this. Try this:
{{ partial (printf "ui_components/%s" .Params.ui_component) . }}
And the corresponding front matter:
+++
ui_component = "barchart_content2.html"
+++
Note that I have changed your variable of ui-component to ui_component, as hyphens are not allowed in Hugo variable names.