I just got back on and need to develop https://www.psychedelicsdaily.com further, and I discovered that you’ve put in a lot of new features, which is awesome. I like the idea of page bundles but I am having a bit of difficulty understanding the structure.
If I wanted to consolidate my articles into page leaf bundles, here’s my understanding so far, is it correct? Please advise.
/content/psychedelics/psilocybin/do-shrooms-show-up-on-drug-test/index.md (the article title becomes the directory name to go in with an index.md that has the front matter? what happens to the front matter in the actual articles.md file itself? Does the index.md file now contain the article frontmatter and text content?)
/content/psychedelics/psilocybin/do-shrooms-show-up-on-drug-test/associated resorces and images here.jpg
Is this how I would convert to page leaf bundles? My goal is to consolidate resources, as currently my /static/img/ folder is overflowing with images.
Also, if this is correctly understood by me, how would I reference the images within the articles?
Usually, I just easily access the images by doing a shortcode like this:
I found the Resources documentation examples to be confusing. Especially because I use a shortcode to access images in my articles. That bit is still confusing.
I’ll check out the stuff again and read over the documentation again. I’m sure it is something I’m not understanding or looking over possibly.
In that case you can easily expose your images to Hugo’s image processing without reorganizing your content to Page.Bundles.
See resources.Get
The above function requires that you use an /assets/ directory for your images or you can simply turn /static/into the assets directory with assetDir = “static” in your project’s config.
/content/psychedelics/psilocybin/do-shrooms-show-up-on-drug-test/index.md (the article title becomes the directory name to go in with an index.md that has the front matter? what happens to the front matter in the actual articles.md file itself?)
If you only want to have one page in each leaf bundle then put everything in article.md into index.md in the leaf bundle. The index.md will get rendered when you navigate to /psychedelics/psilocybin/do-shrooms-show-up-on-drug-test/ (depending on your permalink setting). The rest of the md files in that directory (e.g. article.md, content1.md, content2.md) will be rendered individually if you navigate to their URLs directly.
All the resources go into the same directory in the leaf bundle. So images/pdf/etc are there and then you can access them directly. For example if you have index.md and picture.jpg inside the leaf bundle, you can use imgcap like:
{{<
imgcap src="picture.jpg"
title="N, N-DMT or DMT is one of the most powerful psychedelic drugs"
align=""
width="100%"
>}}
If the pictures are inside a directory in the leaf bundle. For example img/picture.jpg then you can use that in the shortcode src="img/picture.jpg".
Soon I will have someone covering daily news articles, and site is going to grow exponentially, so I want to make sure the /assets/ and/or images folder doesn’t get cluttered up. I want to keep the content with the resources together near each other.
Yes, I only want to have one page in each leaf bundle. Perhaps later I want to have more, but I am first trying to understand how this all pieces together. I’ve been away from hugo for a while and all these new features that complement each other seem rather confusing right now.
Ohh I see. Since I have never done that, what can I read documentation wise to help me understand how to do a multi part article should I ever need to?
You can use Hugo Taxonomies to make a series. See this topic for a relevant discussion:
Also there is Hugo’s Related Content feature that is blazing fast and it could work for a series.
See
A lot of things have changed in Hugo during the past year @Hash_Borgir may I suggest you look at the Docs, they contain many more examples than before and have been rewritten.
Thanks a lot guys, I think I got page bundles figured out. Some images I have to end up keeping in the main static folder, because many articles sometimes reference the same picture, but for the most part the /img/ folder is now pretty clean.
I am using lazy loading of images so that’s why there’s a place holder and data-src.
I am using it in default/single page html template to show 16 related items under every article on my site.
Hopefully someone finds this useful!
I have yet not had the need to create “series” based articles yet, so as soon as I do, I’ll look into the link you provided in depth. I took a cursory glance so far.