How to access resources from pages within a branch bundle

I am attempting to implement an image processing shortcode that works for both leaf bundles and branch bundles. My img shortcode presently uses the .Page.Resources.GetMatch function to find a given resource and resize the image. This method works fine for leaf bundles, but fails to work for pages located in the root directory of a branch bundle.

content/page-bundle
- image.jpg
- index.md - shortcode works fine
content/branch-bundle
- image.jpg
- _index.md
- page.md - shortcode fails citing .Page.Resources is nil

From the documentation, it is not clear how I should go about accessing resources so that the shortcode functions in both situations. In particular, the Page Bundle documentation implies that I shouldn’t be able to use page resources, which I’ve interpreted to mean anything in a .Page.* context will not work from a branch bundle. Meanwhile, the Page Resources documentation implies that a call to .Resources.GetMatch should work for all pages; however, the .Resources variable is always undefined and will therefore fail.

Is there some general way to access resources that works for both leaf bundles and pages found within branch bundles?

Hi there,

Do you have your repo somewhere we can have a look at?

Have a look at my example site here (code here). The shortcode that displays the page resources is here.

You can use .Parent variable.

.Parent
A section’s parent section or a page’s section.

.Parent.Resources.GetMatch "image.jpg"

I’ve created a minimal example of the issue I mention above and uploaded it here:

The example has the following directory structure:

content/
-_index.md
- page-bundle/index.md
- page-bundle/image.png
- branch-bundle/_index.md
- branch-bundle/image.png
- branch-bundle/branch-page.md

The example is set up to build correctly by default, thereby demonstrating that the img shortcode, which uses .Page.Resources.GetMatch works correctly on the leaf page. However, if you set draft = false in the branch-bundle/branch-page.md the build will fail because the image is not registered as a resource despite being at the root of the branch bundle. Even if you change the shortcode to use .Resources.GetMatch the build still fails for the same reason.

Given the documentation cited above, I would think that image.png within the branch bundle should be a registered resources, yet it isn’t. Also, variants of .Parent.Resources and .Parent.Page.Resources fail for the same reason.

Am I just grossly misunderstanding how resources work in branch bundles?

content
├── branch-bundle           # branch bundle | list page "container"
│   ├── branch-page.md      # non-bundle page; NOT a page resource | yoursite.com/branch-bundle/branch-page/
│   ├── image.png           # page resource for list page
│   └── _index.md           # list page:  yoursite.com/branch-bundle/
├── _index.md               # list page
└── leaf-bundle             # leaf bundle | single page "container"
    ├── image.png           # page resource for leaf bundle
    └── index.md            # single page |  yoursite.com/leaf-bundle/

Have a read as well about content organization.

branch-bundle/branch-page.md cannot have page resources because it is not a page bundle. It cannot see branch-bundle/image.png because this image page resource belongs to branch-bundle/_index.md.

Ok. I understand better now. So a branch bundle is really meant to serve as a method to aggregate leaves or other branches, not a method to organize a bunch of related content that might share resources. So in my situation, I should convert branch-page.md and image.png into a leaf bundle instead. I’ll do that.

Thank you very much for the clarification. I’ll re-read the pages and consider sending in a PR to make the documentation more clear to the casual reader.

If you wanted to get branch-bundle/image.png from inside branch-bundle/branch-page.md, you need to access it through the parent page’s resource:

{{ .Page.Parent.Resources }}

Edit:

So if you just wanted your pages to share resources, a headless page bundle is an easy way to do that: Page bundles | Hugo

├── branch-bundle
│   ├── headless-shared-bundle
│   │   ├── image.png       # shared page resource for leaf bundle
│   │   └── index.md        # make this headless
...

Then follow the docs on how to GetPage and get the resources.

Indeed. Unfortunately I don’t think headless bundles quite matches my use case. I’m attempting to make a directory which contains all of my software. Each software product gets a page and typically has 1-2 images associated with it. I’m using the auto list feature of the branch bundle to neatly display them. If I have to make a few extra directories, it isn’t that big of a deal.

Thank you again for your help!

I have a post with “main page” a subpage. I tried to have it as a branch bundle, but I don’t want to have to have the list of posts to be accessible. Also, I faced this issue with accessing resources, so the solution I used was: two top level direcories (main post / sub post) and I used the slug to create the desired url.

The sub page’s front matter I set slug: "main-post/sub-post". So this is the resulting directory → url mapping:

// directory               ->  url

./blog/main-post           ->  /blog/main-post/
./blog/main-post-sub-post  ->  /blog/main-post/sub-post
1 Like

I’m having the same troubles doing that, but your explanation is not clear to me, could you elaborate a little ? Maybe a screenshot would help

You can check out the post in question here: What's a split keyboard and how did it take me 4 months and 400€ to build one? · Filippo Orru
This is the secondary post, a list of parts relating to the main post: List of Parts and Tools · Filippo Orru

Part 1/2 because I get this popup:

Error: new users can only put 2 links in a post

1 Like

Part 2/2

The site is open source. This is the main post’s index.md file on github: https://github.com/ffactory-ofcl/personal-site-hugo/blob/d4be648bf8dea16b1669ca760c5eaac0641e04b3/content/blog/lily58/index.md
See the slug at the top of the file. Nothing unusual. What I didn’t know however, was that a slug can contain / slashes. So the secondary post lives in the same directory level, but its slug points to a subdirectory of the main post. See the secondary’s index.md file here: https://github.com/ffactory-ofcl/personal-site-hugo/blob/d4be648bf8dea16b1669ca760c5eaac0641e04b3/content/blog/lily58-parts/index.md
Feel free to ask me if you have any questions.

1 Like

Ok so if i understand, what you wanted is to have two blogposts, following the same “single.html” structure, but you wanted these posts being linked by their url, like the “subpost” being an extension of the main one, but not having to deal with a “list.html” that comes with a branch, is that correct ?

Exactly right.

Ok, in that case it makes sense, and looks good to me !

In my case (almost unrelated) I was trying to structure resources of an “_index” (branch) in a similar way we structure page bundle resources (in subfolders generally).

But as the documentation and bep says, resources of a branch must live in the same directory as the _index file, which breaks partials designed to look in the subfolders of the bundle when i want to use them in the branch “list.html” or homepage’s “index.html”

following of the discussion about this is here