i have an blog index page with a list of blog posts and excerpts.
once i click on the "read more" link, the full blog post is opened but lacks of its title and date of creation.
the blog index is structured like so:
{% for post in paginator.posts %}
<div class="entry">
<h1>{{ post.title }}</h1>
<span class="date"><i class="fa fa-clock-o"></i> {{ post.date | date: "%m-%d-%Y"}}</span>
{{ post.excerpt }}
<a class="more-link" href="{{ post.url }}">continue reading <i class="fa fa-chevron-right"></i></a>
</div>
{% endfor %}
i've tried throwing {{ post.title }} and the date in blog posts, both in the front matter or inline in the article, but it just shows up empty.
how can i show the title in my opened blog post?
thanks!
To edit how your blog posts are displayed you have to edit the template file in the _layouts folder. By default Jekyll uses post.html as a template for blog posts. Make sure that you have {{ page.title }} in the used layout file and regenerate your site. Now the blog title will appear on all of your individual post pages, please note that it won't appear if the post title is not specified in the front matter of the post.
Related
I'm using the hydeout theme in jekyll and I am trying to have 3 sections in the side bar;
Home - A list of all posts including pagination (working already)
College - A list of all college category posts with pagination
Fun - A list of all fun category posts with pagination
So far using the theme I have the sections in the side bar and the home page is showing all posts from both categories including pagination.
However my issue is that the category layout is only setup to show post titles and I cannot get it to act as a full list of posts let alone include pagination.
category.html:
{% unless page.content == '' %}
{{ content }}
{% endunless %}
<ul class="posts-list">
{% assign category = page.category | default: page.title %}
{% for post in site.categories[category] %}
<li>
<h3>
<a href="{{ site.baseurl }}{{ post.url }}">
{{ post.title }}
<small>{{ post.date | date_to_string }}</small>
</a>
</h3>
</li>
{% endfor %}
</ul>
Here is a link to the hosted site and the code on github.
I essentially want the college and fun subsections to display posts the exact same way the home page does but only posts that belong in their given category
Any help would be greatly appreciated.
I have a personal website built with jekyll and hosted on Github pages. I am trying to add a sub-site blog within the same domain. For this, I set up a blog.md page and followed the instructions from this website: https://www.garron.me/en/blog/multi-blog-site-jekyll.html. The idea is that if I access http://<mydomain>.com it will go to my personal website, and if I go to http://<mydomain>.com/blog it will go to a different site also set up with jekyll.
My file structure is different than what they suggest in the link above. It is like this:
/personalwebsite
config.yml
index.md
(other personal website pages).md
blog.md
/_site
/_layouts
/_posts
My index.md page is completely customized, and I wrote my own layout for that website. It is a static site and everything in _posts is ignored by it. My blog.md page is also on the root folder and it changes according to _config.yml. I am trying to use Github jekyll themes for it. The theme loads, but instead of showing the posts, it shows the code:
This is what blog.md looks like:
---
layout: blog
title: the blog
permalink: blog
---
{% raw %}
{% for post in site.posts %}
{% if post.categories contains 'blog' %}
<div class="post">
<h3 class="title">{{ post.title }}</h3>
<p class="meta">Date: {{ post.date }}</p>
<div class="entry">
{{ post.content | strip_html | truncatewords: 100 }}
</div>
</div>
{% endif %}
{% endfor %}
{% endraw %}
And this is what a post looks like:
---
layout: post
title: New test
category: blog
---
This is a test post
If I remove the {% raw %} parts in blog.md, the posts show up like this:
I have already checked that my posts are in the right place, the category parameter is filled in, the dates and post filenames are properly formatted. What am I doing wrong? Jekyll does not show any error messages other than a Github metadata warning:
GitHub Metadata: No GitHub API authentication could be found. Some fields may be missing or have incorrect data
blog.md is a markdown file.
In markdown a four space indentation represents code or preformatted text.
Kramdown will wrap this code in <pre> tag, resulting on what you actualy see on your site.
If you remove your indentation (or keep it under 4 spaces), your problem is solved.
{% for post in site.posts %}
{% if post.categories contains 'blog' %}
<div class="post">
<h3 class="title">{{ post.title }}</h3>
<p class="meta">Date: {{ post.date }}</p>
<div class="entry">
{{ post.content | strip_html | truncatewords: 100 }}
</div>
</div>
{% endif %}
{% endfor %}
I am trying to creating a blog on my website using markdown but I am having trouble with the blog titles.
I have created a loop to bring in the latest title and excerpt onto my home page which works fine.:
{% for post in site.posts limit: 1 %}
On my site I have a list of my blogs (https://jenjnif.github.io/blog.html)
and when you click on one to read the whole blog I would the title for only that blog to show up.
I used the same code as above {% for post in site.posts limit: 1 %} to only show one title as all blog titles were showing without this but obviously then it will only show the latest title regardless of which blog I am actually viewing. Here is the markdown for that page:
---
layout: default
---
<div id="post">
<div class="blog-header">
{% for post in site.posts limit: 1 %}
</div>
<h2 class="blog-title">{{ post.title }}</h2>
{% endfor %}
{{ content }}
</div>
I know the limit: 1 will not work because it is only then going to take the latest title but I don't know how else to get only one title showing up on each blog post. Is there a way to make sure only one title shows - only showing the correct, current blog title, not all of them?
All files can be found in my GitHub repository: https://github.com/jenjnif/jenjnif.github.io
When using Jekyll and its Liquid templating engine, they have several sets of variables. Instead of using a for loop to go through all the posts, you can use page.title to get the title for the current blog post.
<div id="post">
<div class="blog-header">
</div>
<h2 class="blog-title">{{ page.title }}</h2>
{{ content }}
</div>
I would like to display a randomly chosen post in the front page of my Jekyll site.
Do you have any idea how I could loop and chose a random post each time the page is loaded ?
This is the index that I have at the moment.
---
layout: default
title: Home
---
<h1 class="content-listing-header sans">Posts</h1>
<ul class="content">
{% for post in site.posts %}
<li class="listing">
<hr class="slender">
<h4 class="contrast">{{ post.title }}</h4>
<span class="smaller">{{ post.date | date: "%B %-d, %Y" }}</span> <br/>
<div>{{ post.excerpt }}</div>
</li>
{% endfor %}
Thanks
Jekyll generates static files. You can chose a random post to be inserted in your home page, but this page will be static and random post will only be changed when you site is generated.
{% assign random = site.time | date: "%s%N" | modulo: site.posts.size %}
<h1>{{ site.posts[random].title }}</h1>
As liquid has no random tag, you can mimic randomness based on time.
See https://stackoverflow.com/a/28323813/1548376
The only way to load a different post on each reload is to do it with javascript. And here it will become complicated.
you will need to create a posts list for javascript to choose from,
you will have to generate specific page for each post with only post's html in it. No head, navigation and so on. And this can only be accomplished with a Jekyll generator plugin.
I have a Jekyll blog where the main page is a bunch of links to posts, but where I also want to include a link to a project's gh-pages page and I want the list to stay sorted by date. Right now, I'm just manually inserting it at the top of the page.
<ul class="posts">
<li>
<span class="post-date">Jul 8, 2015</span>
<a class="post-link" href="/QuisCustodiet/">The Most Influential Works, According to TvTropes</a>
</li>
{% for post in site.posts %}
<li>
<span class="post-date">{{ post.date | date: "%b %-d, %Y" }}</span>
<a class="post-link" href="{{ post.url | prepend: site.baseurl }}">{{ post.title }}</a>
</li>
{% endfor %}
</ul>
This looks okay, but it will break in a week or two when I make another post. Is there a way to create another "post" and insert it into the list of site.posts in a way that it stays sorted? Is there some other much better way of doing this that I don't know about?
If I understand your problem right, you want to have some "special project posts" in your list of posts that are only links to another specific project site but have a date and therefore can be sorted together with the other posts.
Here is what I came up with:
You create an empty Post in _posts/ with front matter like this:
---
layout: post
title: "Project Example"
customlink: http://www.example.org
date: 2015-07-12 12:50:25
---
The customlink attribute is for the link to your project page. In your html, where you list all your posts, you make an if-statement to check for the attribute and handle it properly. Like this for example:
<ul>
{% for post in site.posts %}
<li>
{% if post.customlink %}
{{ post.title }}
{% else %}
{{ post.title }}
{% endif %}
</li>
{% endfor %}
</ul>
Your project post is treated as your other posts and sorted with them by date, but its link will direct the user to your project page.
Jekyll will still create the html for this post and serve it like all the other posts under a specific path. To prevent this you could add an empty permalink attribute in the posts front matter like permalink: "" and your post would lie under the root of your blog. Jekyll would still create a ".html" file for this post in the _site folder.
You need to create the posts for every external project manually but I do not know a better solution.