I am trying to display items from a collection called fiction. Nothing other than the url is displaying on the website.
The for loop for collection is here
{% for fiction_item in site.fiction %}
<ul class="col-xl-3 col-lg-4 col-md-6 mb-4">
<li class="bg-white"><img class="img-fluid card-img-top" src="{{ fiction_item.image_url }}" alt="{{ fiction_item.title }}">
<div class="p-4 art-content">
<h5>{{ fiction_item.title }}</h5>
<h6>by {{ fiction_item.writer }}</h6>
<p class="small text mb-0">{{ fiction_item.caption }}</p><a class="btn border-pretty" href="{{ site.url }}{{ fiction_item.url }}">More</a>
</div>
</li>
</ul>
{% endfor %}
My _config.yml is written like this
name: The Book Project
url: '/experiment/'
baseurl: '/experiment/'
collections:
nonfiction:
output: true
fiction:
output: true
art:
output: true
poetry:
output: true
defaults:
- scope:
path: ""
type: "nonfiction"
values:
layout: "blog"
- scope:
path: ""
type: "fiction"
values:
layout: "blog"
- scope:
path: ""
type: "art"
values:
layout: "blog"
- scope:
path: ""
type: "poetry"
values:
layout: "blog"
The markdown content is like this:
---
layout: blog
title: History of India
image_url: https://upload.wikimedia.org/wikipedia/commons/thumb/a/a4/Cave_26%2C_Ajanta.jpg/348px-Cave_26%2C_Ajanta.jpg
writer: Adnan Abbasi
caption: Whendefining a collection as a sequence, its pages will not be rendered by default. To enable this, output: true must be specified on the collection, which requires defining the collection as a mapping. For more information, see the section Output. Gather your collections 3.7.0. You can optionally specify a directory to store all your collections in the same place with collections_dir: my_collections. Then Jekyll will look in my_collections/_books for the books collection, and in my ...
---
When defining a collection as a sequence, its pages will not be rendered by default. To enable this, output: true must be specified on the collection, which requires defining the collection as a mapping. For more information, see the section Output. Gather your collections 3.7.0. You When defining a collection as a sequence, its pages will not be rendered by default. To enable this, output: true must be specified on the collection, which requires defining the collection as a mapping. For more information, see the section Output. Gather your collections 3.7.0. YouWhendefining a collection as a sequence, its pages will not be rendered by default. To enable this, output: true must be specified on the collection, which requires defining the collection as a mapping. For more information, see the section Output. Gather your collections 3.7.0. You
When defining a collection as a sequence, its pages will not be rendered by default. To enable this, output: true must be specified on the collection, which requires defining the collection as a mapping. For more information, see the section Output. Gather your collections 3.7.0. You When defining a collection as a sequence, its pages will not be rendered by default. To enable this, output: true must be specified on the collection, which requires defining the collection as a mapping. For more information, see the section Output. Gather your collections 3.7.0. YouWhendefining a collection as a sequence, its pages will not be rendered by default. To enable this, output: true must be specified on the collection, which requires defining the collection as a mapping. For more information, see the section Output. Gather your collections 3.7.0. You
The same problem happens on individual collection page:
The link to the project is here: http://thebookproject.team/experiment/fiction.html
The link to its github is here: https://github.com/thebookproject/experiment
Where exactly am I going wrong?
The problem lies within the front matter of the markdown files.
When I tried building the site locally, I got an error saying that front matter parsing failed:
caption: blah blah collections_dir: my_collections.
In this line, there are multiple variable declarations, caption: and collections_dir:. To fix this, try enclosing your caption in quotes, like this:
caption: "blah blah collections_dir: my_collections."
This fixed the build error for me.
Related
Trying to get Jekyll collections to paginate using jekyll-paginate-v2 but I'm getting some odd behaviour where it uses the layout in the first pagination request it finds for all pages.
So for instance I have a number of different collections and for each collection I have a a folder with an index that is the same name as the collection but without the underscore.
So my events collection has _events with my markdown files and events with index.html that should display that collection. I have the same for "gallery" and "results" collections.
If I only activate pagination for one collection it works fine. As soon as I activate it for more than one the generated index.html's for every collection appear to use the first one it finds (in alphabetical order).
I've tested this by renaming folders and moving the pagination using index.html's around. Whichever index.html it hits first with pagination enabled becomes the one used for all of my index.html's that have collections enabled. Even if its in the root and called something else the same thing still happens.
My index.html's have similar front matter and pagination logic which is basically:
---
layout: page
title: Results
pagination:
enabled: true
collection: results
---
{% for result in paginator.posts %}
<a href="{{ result.url }}">
<h1 class="title results">
{{ result.title }}
</h1>
<h6 class="date results">
{{ result.date | date: "%A, %B %e, %Y at %I:%M%P" }}
</h6>
</a>
{% endfor %}
I'm aware you can use _layouts and in your pages do something like
---
layout: some_layout
title: Home
---
So say I have 20 pages. All using the same template but slightly different content and stuff inside.
Instead of creating 20 different pages.html files with different names and different permalinks.
Is there a way to create 1 page.html and based on the permalink change what's inside the {{ content }}?
Just create your-slug.md files. Let them all use the same layout, like this:
---
layout: some_layout
title: Your title
---
In the layout file (some_layout.html) you put some logic, like this:
{% if page.url contains '/your-slug' %}Put this on the screen.{% endif %}
You could organize the 20 pages under a collection and assign defaults on the collection.
For example, say your collection is labelled docs, then all those 20 pages need to be placed inside a directory named _docs, at the root of your source directory. Following that configure your collection to use the layout some_layout for its documents.
# _config.yml
# enable rendering on your collection(s)
collections:
docs:
output: true
another_collection:
output: true
# set defaults on your collection. (note the indentation..)
defaults:
-
scope:
type: docs
path: _docs
values:
layout: some_layout # The layout for this collections' files
-
scope:
type: another_collection
[...]
I have not tried this yet, but there is a closed github issue: https://github.com/jekyll/jekyll/issues/16
There are suggestions to write/use a jekyll plugin like the ones below. These are links from the issue and their state is unknown to me.
https://github.com/ixti/ixti.github.io/blob/source/_plugins/categories.rb
https://github.com/rfelix/my_jekyll_extensions/tree/master/category_gen
how to write a plugin: https://jekyllrb.com/docs/plugins/
I'm creating a website using Jekyll.
so far I have four pages which are created automatically from four md files which md files are in the root of the project.
index.md
about.md
login.md
register.md
Here is the content inside my login.md file
---
layout: layout-default
title: some login title
permalink: /login
theme: secondary-theme
nav:
menu-items:
- type: text
text: Don't have an account?
- type: link
text: SIGN UP
class: button
linkPath: /register
sections:
- type: 3
class: form-section
header-line-2: Login Section!
form:
api: http://127.0.0.1:8080/login
submit-text: LOG IN
form-controls:
- label-text: EMAIL ADDRESS
input-type: email
input-placeholder: Enter your email
input-name: email
- label-text: PASSWORD
label-link-text: Forgot password?
label-link-path: #
input-type: password
input-placeholder: Enter your password
input-name: password
---
What i do is iterating the sections and applying html attribute values depending on the variables inside each section. That way i can have as many sections rendered as i want on one page. And they can also be different depending on the classes and content i put in the md file.
The problem is that if the project gets too complicated with different styles for sections and so on. I would like to separate each section content. It would be nice if i could make a folder lets say login/sections folder
and then put md files inside and then inside login.md file include these section md files. This way the code would be much more organized.
Is there way to do that, and is my approach actually good.
Jekyll provides the ability to include files into another files. The magic directory for this is _includes. Example:
If you create a file named _includes/sections/s1.html, you can include that into any other file with the following tag:
{% include sections/s1.html %}
This approach works for:
including HTML file into HTML
including HTML file into Markdown (since Markdown can contain HTML code)
including Markdown into Markdown
If you want to include a Markdown file into a HTML, you have to use some trick:
{% capture m %}{% include sections/s1.md %}{% endcapture %}
{{ m | markdownify }}
I'm rebuilding my company's current site in Jekyll and attempting to set up the structure around a content model using objects (files in a collection) that have attributes (key/value pairs in YAML front-matter). Simple conceptual stuff designed to demonstrate effective content modeling to my team.
Anything on the site that gets reused becomes an object, with the type of object defined by the specific collection that contains its file. So, I have a "services" collection for services offered by the company, a "clients" collection, and a "people" collection with a file for each person.
The problem I'm having is referencing a specific item in a collection. For example, I want my posts to have authors. I've found a ton of solutions for this using _data, but I want my authors to have pages and collections automatically outputs a page for each person. I've been able to get _data to generate pages, but I have no control over the order in which items are listed, whereas with a collection there are a lot of ways for me to control the order.
My current solution feels hacky. I'm giving each person an id which is equal to "firstname-lastname" so in the YAML front-matter it would say id: steve-hickey. Then I use the following code to loop through every person on the site and return any that match the author-id specified in the post.
The post layout template:
---
layout: default
---
<header class="intro post-header">
<h1>{{ page.title }}</h1>
{% assign people = site.people | where:"id", page.author-id %}
{% for person in people %}
<p>Written by {{ person.first-name }} {{ person.last-name }} on <p>{{ page.date | date: '%B %d, %Y' }}</p></p>
{% endfor %}
</header>
<div class="post-body">
{{ content }}
</div>
A post's front-matter:
---
title: User Offboarding
layout: post
nav-area: blog
author-id: steve-hickey
---
A person file from the people collection:
---
id: steve-hickey
first-name: Steve
last-name: Hickey
job: User Experience Strategist & AUX Director
layout: person
nav-area: about
portrait-url:
---
It seems like there should be a way to identify a specific file or object based on a unique attribute that it already possesses, such as its name or url. That way I can just point to a specific object instead of evaluating all of them for a unique property I have to write. But after 3 days of searching I can't find a good answer to this.
If people are unique in your collection {% assign author = site.people | where:"id", page.author-id %} will return an array with one element.
In order to directly access this element do :
{% assign author = site.people | where:"id", page.author-id | first %}
This grab the first (and only) element in you array. You now do {{ author.anykey }} directly.
In a Jekyll layout, default.html, you initialize a variable
{% assign relative_path = "../../" %}
Inside a page using default layout, this variable is empty though.
How can you use inside pages variables set in layout?
This is the opposite of
Can you use Jekyll page variables in a layout?
After some research in Jekyll code, it seems that you cannot access layout variables from a page or post. The only information about layout a page can see is the layout's name {{ page.layout }}.
Then you can use this to store some layout related variables in _config.yml and get them from any post/page using the {{ page.layout }} variable.
_config.yml
layoutVars:
default:
relative_path: "../../"
post:
relative_path: "an other path"
page:
relative_path: "hello world"
use in a page or post
{% assign pagePath = site.layoutVars[page.layout].relative_path %}
You have two possibilities.
Store your variable in the layouts yaml-header, e.g.:
---
variable : value
---
Have a look at jekylls front matter defaults. You can declare variables depending on the type of posts/documents and the folder the posts are stored in.
I'm not if this is what you are looking for, but i hope it helps...