It is nice to use post.excerpt instead of post.content on your Jekyll home page, but then users can’t see if there is more to read until they open the whole post.
To add Read more link, you can use this simple snippet.
{% if post.excerpt != post.content %}
<a href="{{ site.baseurl }}{{ post.url }}">Read more</a>
{% endif %}
I don’t use this setup anymore, it might be outdated, proceed with caution.
As you probably know this blog is powered by Jekyll. It is a really nice platform, but it lacks a few things I’m used to during development. First one is live reload on file changes (and injecting CSS), using SASS, autoprefixer, ES6…
Again, I’ve seen it somewhere on the internet and recreated it. This one uses jQuery, although I plan to rewrite it to vanilla JavaScript.
It switches between two sides of the cube, every time you hover. Depending from which side cursor entered the cube, it will rotate in opposite direction. It is fully responsive, and on touch devices, direction depends of where you tap.
Cube side is a regular div, and you can put any type of content in it.
Jekyll comes with simple pagination which has only Newer and Older links. I wanted a little bit more, now pagination shows at least five pages, with current in the middle. On the larger screens there are also first and last page links. Newer and Older links are, of course, still there.
Check the gist with the code.
You can see it at the bottom of this website, or just check the screenshot below:
Well I saw pretty nice mockup on Dribbble and decided to make it for fun. It didn’t include mobile/responsive solution, so I came up with my own.
Check the demo.
This is pure CSS solution - it uses :target selector for changing states. Find more about :target on MDN. This is neat, as it also can be bookmarked on both states, and browser button work too.
Grab the code on GitHub.