Show pages under one folder in Jekyll? - jekyll

I think the native way of managing pages of Jekyll, i.e. by creating .md file / folders under the root folder, is a bit messy.
Thus I want to put, every page I want to show, into the folder called "pages". Additionally, I'd like these pages to have a cascaded structure: say if my folder has the structure:
pages
|-> parent1
|-> index.html
|-> son1.html
|-> son2.html
|-> parent2
|-> index.html
Then in the pages-listing page, it should be something like this:
page listing
* parent1
* son1
* son2
* parent2
And additionally, the other *.html file, which are not under pages folder, should not be shown in this page-listing page.
How should I do that?
Thanks a lot.

There is nothing preventing you from doing so. In the above scenario, yourdomain.tld/pages/prent1/son1.html would be the URL of the parent1/son1 file.
Creating a nested listing, however, will be more complicated. You could either epscify that structure in the YAML Front Matter, or use posts.
pages
|-> parent1
|-> _posts/
|-> index.html
|-> son1.html
|-> son2.html
|-> parent2
|->_posts
|-> index.html
=> That way your files would be posts in the categories parent1 and parent2 and you could create the listing by displaying the categories and their contents.
If you really want to display a tree structure without using posts and categories, then you will need to do more black magic. But fortunately, Liquid offers a split filter which you could use to split the path of the site into chunks, e.g.
{% for page in site.pages %}
{{ page.url | split:'/' | join:'+'}}
{% endfor %}
Instead of joining them (this is purely for demonstartion), you'd want to populate an array which holds the tree structure and then later on iterate over that array to display the directory tree. It is possible, but not easy. And i don't think there is something readily available.
Probably writing a plugin is easier.

Related

Jekyll Folder Structure. Having folders/lists on a page which each have specific posts

I have a page called blog.md which has some code like this.
permalink: /blog/
layout: collection
collection: blog
entries_layout: grid
classes: wide
Then I have a folder called _blog, with a number of .md files in.
Is there anyway I can add another level of order here and instead of displaying all the _blog .md files on the blog.md page.. I want to add two folders/lists which contain certain .md files.
Any ideas? Thanks
This should work by adding the path to your for loop. For example, let's assume you have a directory in your _blog directory called "orange." So your file path would be _blog/orange. To loop through only the files in the orange directory you could do this:
{% for post in site.blog.orange %}
{{ post.do-stuff }}
{% endfor %}
On a side note, Jekyll is going to look for blog posts in the _posts directory. I assume this _blog directory is a collection, but creating a "blog" collection will make things confusing if anyone else ever needs to touch this codebase.

Generate pages from _posts in subfolder in Jekyll

I have a project where I have posts on main page of the blog and I would love to have another posts folder inside subfolder(s).
I am talking about this structure:
_posts
_posts/2020-04-04-Testmain.md
subpage/_posts
subpage/_posts/2020-04-04-Testsub.md
subpage/index.html
index.html
I can access posts from subpage by using {% for post in site.categories.subpage %} inside subpage/index.html but I can't find a way how to force jekyll to also generate posts in the subpage folder so I can access it at page http://127.0.0.1:4000/subpage/testsub
Is it even possible? Or is it better to follow this structure?
_posts
_posts/2020-04-04-Testmain.md
_posts/subpage
_posts/subpage/2020-04-04-Testsub.md
If so, is there some setting required to make the post at http://127.0.0.1:4000/subpage/testsub ?
Found the solution!
In _config.yml you can use permalink: /:categories/:title
And with following file hierarchy:
_posts
_posts/2020-04-04-Testmain.md
subpage/_posts
subpage/_posts/2020-04-04-Testsub.md
subpage/index.html
index.html
You will get these websites:
http://127.0.0.1:4000/
http://127.0.0.1:4000/subpage/
http://127.0.0.1:4000/subpage/testsub
And you can still access all posts from selected subfolder with {% for post in site.categories.subpage %}

Jekyll site.categories is empty

I have tried this code {{site.categories | inspect}} in default.html, but it returns empty space like this {}.
My post has a front matter that includes categories: apple.
What have I missed?
oh i found..
My jekyll theme post was referenced from 'docs' folder, but jekyll said every posts should be placed in _post folder. so jekyll site variable could not read categories of posts in docs folder.

generate subpages from template in jekyll

Is it possible to have a template in Jekyll, that will be filled for each subpage of a certain category with different data..
Say I have portfolio page, then I link to my works from there, each separate work page is using the same template, just the text and pics are changing.
So what I would like to have is portfolio/work1, portfolio/work2 generated from the same template and then I would iterate over _data yml files to fill in details for each work...
Is that possible in Jekyll? I couldn't find any articles on that topic.
You can use default setup for your portofolio folder.
1. In _config.yml, set :
defaults:
-
scope:
path: "portofolio"
type: "pages"
values:
layout: "work"
2. Create a _layouts/work.html template.
_
3. In your portofolio/indexhtml page
If you want to override layout, just do :
---
layout: page
...
---
This can be done with 'Collections' which is a function in Jekyll. See Jekyll Collections. If you are not sure what Collections is for then maybe Ben Balter's explanation could help.
In your situation: You want a portfolio page with subpages for each piece of work. Create a collection named Portfolio in your _config.yml like below:
# Collections
collections:
portfolio:
output: true
Then create a folder called _portfolio in your jekyll files. You then can clarify in your front matter on each piece of work i.e. work1.md inside _portfolio which could display images, tags etc along with content like you would write a post in Jekyll. In your front-matter for each work example, you can define what template/layout you would want to use for the work examples.

In Jekyll is there an easy way to change an output path for a folder with html

I am using Jekyll for some static site templates and I have a folder of product html pages which I want to be bundled into the root site/ folder rather than into a site/products folder.
example below with just 2 product pages:
src folder
src/products/123.html
src/products/146.html
output to site
site/123.html
site/146.html
Is there an easy way to do this?
Additionally would there be an easy way to append products- to each file in this folder?
site/product-123.html
site/product-146.html
Try looking into Jekyll collections. You'll specifically want the Permalink feature. Hopefully the following snippet will get you started.
config.yml
collections:
products:
output: true
permalink: /product-:title/
source tree
_products
|
1.html
2.html
3.html
...
output tree
_site
|
product-1
|
index.html
product-2
|
index.html
product-3
|
index.html
...
This creates the "pretty permalinks" structure where file endings are removed by using index.html within a directory of the correct name. Of course you could set it to create the "ugly permalinks" (project-1.html, etc), but I like this style more.