How to show a preview of a post? (Using Jekyll Bootstrap theme)

jekyll

This is probably an easy question, but how do I show previews of my posts on the default page? I am using the Jekyll Bootstrap theme Tom.

Best Answer

This also works at least as of 1.0.0, is built in and is simple to use.

<ul>
  {% for post in site.posts %}
    <li>
      <a href="{{ post.url }}">{{ post.title }}</a>
      <p>{{ post.excerpt }}</p>
    </li>
  {% endfor %}
</ul>

See here.

Related Solutions

Local post assets with Jekyll

I wrote a plugin to let me organise assets in subdirectories easily:
https://github.com/samrayner/jekyll-asset-path-plugin

{% asset_path my-image.png %}

in post 2013-01-01-post-title would output:

/assets/posts/post-title/my-image.png

in page my-first-page would output:

/assets/my-first-page/my-image.png

Github – Using an image caption in Markdown Jekyll

I know this is an old question but I thought I'd still share my method of adding image captions. You won't be able to use the caption or figcaption tags, but this would be a simple alternative without using any plugins.

In your markdown, you can wrap your caption with the emphasis tag and put it directly underneath the image without inserting a new line like so:

![](path_to_image)
*image_caption*

This would generate the following HTML:

<p>
    <img src="path_to_image" alt>
    <em>image_caption</em>
</p>

Then in your CSS you can style it using the following selector without interfering with other em tags on the page:

img + em { }

Note that you must not have a blank line between the image and the caption because that would instead generate:

<p>
    <img src="path_to_image" alt>
</p>
<p>
    <em>image_caption</em>
</p>

You can also use whatever tag you want other than em. Just make sure there is a tag, otherwise you won't be able to style it.

Best Answer

Related Solutions

Local post assets with Jekyll

Github – Using an image caption in Markdown Jekyll

Related Topic