16

I would like to have a set of links

<li>
  <h2>Random Articles</h2>  
  <ul>
    <li><a href="#">Old article 1</a></li>
    <li><a href="#">Old article 1</a></li>
    <li><a href="#">Old article 1</a></li>
  </ul>
</li>

But I want to generate the links from a random selection of my posts. I'm using jekyll and liquid to generate the site. I must use built in parts of jekyll as I'm hosting on github. I'm not really sure where to start on this. Google searches on the topic are fruitless.

5 Answers 5

21

This is choosing a random quote from a JSON file in _data but the principle should work with your posts as well:

{% assign random = site.time | date: "%s%N" | modulo: site.data.inspirational-quotes.size %}

<blockquote>&ldquo;{{ site.data.inspirational-quotes[random].quote }}&rdquo; <cite>{{ site.data.inspirational-quotes[random].person }}</cite></blockquote>
4
  • 3
    This change works always or only when rebuilding the entire site?
    – eveevans
    Mar 13, 2015 at 22:25
  • 5
    Yes, Jekyll is a static site generator so cannot do anything dynamic outside of build time.
    – wjdp
    Apr 25, 2015 at 0:23
  • 3
    rather than use time/date I used page.title.size which allows this to work in an include (time/date is the same on every one). I use it to put a random ad/message at the bottom of an article/page.
    – Ron
    May 2, 2015 at 19:26
  • Can you please give us a whole example (json format, global variables, etc), I could not get this work... Jun 5, 2017 at 13:21
13

I found this article to be useful to generating numbers using Liquid, it is not straight forward, nonetheless, it is the most elegant way to generate a random number with min/max.

The following example is for a number between 65 & 80.

{% assign min = 65 %}
{% assign max = 80 %}
{% assign diff = max | minus: min %}
{% assign randomNumber = "now" | date: "%N" | modulo: diff | plus: min %}
1
  • 1
    how to make the number between 0 and 1, i feel like this approach will return integers and not real values.
    – bachr
    Jan 14, 2020 at 19:08
4

I had a similar idea for a web site I am working on and resorted to write a plugin (see below). As Peter pointed out, the random selection will happen at generation time, so if you are looking at something dynamic you will have to look elsewhere.

Anyhow, this in the plugin I wrote (I placed it in my _plugins directory, eg. .../_plugins/randomPage.rb):

# Outputs a random page link
#
# Usage:
#   {{ site.pages | random_page }}
#   {{ site.collection_name | random_page }}
#   {% assign myPage = site.collection_name | random_page %}
#   <a href="{{ myPage }}">{{myPage}}</a>
#   {% assign myPage = site.pages | random_page %}
#   <a href="{{ myPage }}">{{myPage}}</a>

module RandomPageSelector
    def random_page( input )
        index = rand(0...input.length)
        "#{input[index].url}"
    end
end

Liquid::Template.register_filter(RandomPageSelector)
3

I had a similar desire and got down to defining a custom Liquid tag (see http://github.com/mojombo/jekyll/wiki/Plugins) which accessed posts through context.registers and selected ones at random, but note that once Jekyll generates your site, that random selection remains static until the site is regenerated. I would suggest a different option: have Jekyll write those all those post links into an array in JavaScript (included inline in the layout), which is shuffled and the top three links are then displayed on the page. You could even enhance this so that those three links rotate with other ones in the array with a setInterval() call. It's not the most elegant solution, but dynamically generating random content doesn't seem quite inline with the design philosophy of Jekyll anyhow.

1

I wrote a small Jekyll plugin to generate random hexadecimal strings of any length. The plugin is documented along with my other Jekyll plugins. Here is the source code:

require 'securerandom'

module RandomNumber
    def random_hex_string(n)
      SecureRandom.hex(n)
    end
end

Liquid::Template.register_filter(RandomNumber)

Usage Example

This generates a random hex string 6 characters long and stores the result in a Liquid variable called id. Because this plugin is implemented as a filter, first write the number of hex characters to generate (6), followed by a pipe (vertical bar), then the name of the filter (random).

{% assign id = 6 | random_hex_string %}

The generated 6 characters might be: 51e2160d4bdf.

Installation

  1. Save the above code as random_hex.rb and place the file in the _plugins directory.
  2. Restart Jekyll.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.