# Random Images (at build time)?

**URL:** <https://discourse.gohugo.io/t/random-images-at-build-time/188>\
**Category:** support\
**Created:** [October 8, 2014, 2:38am UTC](https://discourse.gohugo.io/t/random-images-at-build-time/188 "2014-10-08T02:38:37Z")\
**Posts on this page:** 13\
**Page:** 1

<div class="post-metadata">

**Author:** ![TheLoneCuber](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/thelonecuber/32/71_2.png) [@TheLoneCuber](https://discourse.gohugo.io/u/TheLoneCuber)\
**Post date:** [October 8, 2014, 2:38am UTC](https://discourse.gohugo.io/t/random-images-at-build-time/188/1 "2014-10-08T02:38:37Z")

</div>

Is there any way to randomly assign an image at Hugo build time? I have the random images in my /static/img folder, and they’re file-named 1.jpg, 2.jpg, 3.jpg, etc. This doesn’t need to be pretty; any work-around will suffice.

---

<div class="post-metadata">

**Author:** ![spf13](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/spf13/32/37_2.png) [@spf13](https://discourse.gohugo.io/u/spf13)\
**Post date:** [October 8, 2014, 4:08am UTC](https://discourse.gohugo.io/t/random-images-at-build-time/188/2 "2014-10-08T04:08:14Z")

</div>

Honestly, I’d just write a shell script to do it.

---

<div class="post-metadata">

**Author:** ![bep](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/bep/32/3332_2.png) [@bep](https://discourse.gohugo.io/u/bep)\
**Post date:** [October 8, 2014, 10:54am UTC](https://discourse.gohugo.io/t/random-images-at-build-time/188/3 "2014-10-08T10:54:48Z")

</div>

I don’t think there are any random functions exposed in the templates, but it is possible to be a little creative with the [time API](http://golang.org/pkg/time/#Time.Second).

```
{{ add 1 (div .Now.Second 6) }}.jpg

```

Should give:

```
[1..10].jpg

```

You said it didn’t have to be pretty 😉

---

<div class="post-metadata">

**Author:** ![tom](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/tom/32/80_2.png) [@tom](https://discourse.gohugo.io/u/tom)\
**Post date:** [October 8, 2014, 12:48pm UTC](https://discourse.gohugo.io/t/random-images-at-build-time/188/4 "2014-10-08T12:48:55Z")

</div>

Or maybe some simple JavaScript?

---

<div class="post-metadata">

**Author:** ![michael\_henderson](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/michael_henderson/32/10490_2.png) [@michael\_henderson](https://discourse.gohugo.io/u/michael_henderson)\
**Post date:** [December 1, 2014, 5:19am UTC](https://discourse.gohugo.io/t/random-images-at-build-time/188/5 "2014-12-01T05:19:43Z")

</div>

Run something like this prior to every build and have your template always use the “randomImage.png” file.

```auto
#!/bin/bash
# copy a random .png file to "randomImage.png"
# assumes we're in the directory to copy to.
# will be a noop if there are no .png files.
# will not select the displayMe.png file as both src and tgt.
tgt="randomImage.png"
src=$( find . -type f -name '*.png' | grep -v "^${tgt}\$" | sort -R | sed 1q )
[-f "${src}"] && cp "${src}" "${tgt}"

```

---

<div class="post-metadata">

**Author:** ![bradorego](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/bradorego/32/1488_2.png) [@bradorego](https://discourse.gohugo.io/u/bradorego)\
**Post date:** [April 14, 2016, 2:15pm UTC](https://discourse.gohugo.io/t/random-images-at-build-time/188/6 "2016-04-14T14:15:55Z")

</div>

Not to necro an old post, but I’m trying to do exactly this and getting an error:

```auto
ERROR: 2016/04/14 template: partials/page-header.html:2:2: executing 
"partials/page-header.html" at <div .Now.Second 10>: error calling div: 
Can't apply the operator to the values in partials/page-header.html

```

Relatively new to Hugo (and this, Golang), so I’m totally lost on this one…

---

<div class="post-metadata">

**Author:** ![bep](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/bep/32/3332_2.png) [@bep](https://discourse.gohugo.io/u/bep)\
**Post date:** [April 14, 2016, 4:28pm UTC](https://discourse.gohugo.io/t/random-images-at-build-time/188/7 "2016-04-14T16:28:31Z")

</div>

If you want to “necro” an old post like this, you would have to provide more context. And error message is only good enough for prophets.

---

<div class="post-metadata">

**Author:** ![bradorego](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/bradorego/32/1488_2.png) [@bradorego](https://discourse.gohugo.io/u/bradorego)\
**Post date:** [April 14, 2016, 5:02pm UTC](https://discourse.gohugo.io/t/random-images-at-build-time/188/8 "2016-04-14T17:02:44Z")

</div>

If I put `{{div .Now.Second 10}}` anywhere a template, I get that error. If you really want to see the full source you can but it’s irrelevant.

---

<div class="post-metadata">

**Author:** ![moorereason](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/moorereason/32/592_2.png) [@moorereason](https://discourse.gohugo.io/u/moorereason)\
**Post date:** [April 14, 2016, 5:42pm UTC](https://discourse.gohugo.io/t/random-images-at-build-time/188/9 "2016-04-14T17:42:11Z")

</div>

It works fine for me. I noticed that you’re in a partial template. Make sure you’re passing a page into the partial as the initial context.

```auto
{{ partial "page-header.html" . }}

```

---

<div class="post-metadata">

**Author:** ![bep](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/bep/32/3332_2.png) [@bep](https://discourse.gohugo.io/u/bep)\
**Post date:** [April 14, 2016, 6:43pm UTC](https://discourse.gohugo.io/t/random-images-at-build-time/188/10 "2016-04-14T18:43:09Z")

</div>

> [@bradorego](#):
>
> but it’s irrelevant.

OK, then.

---

<div class="post-metadata">

**Author:** ![bep](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/bep/32/3332_2.png) [@bep](https://discourse.gohugo.io/u/bep)\
**Post date:** [April 14, 2016, 8:41pm UTC](https://discourse.gohugo.io/t/random-images-at-build-time/188/11 "2016-04-14T20:41:12Z")

</div>

On an added note, in the latest Hugo (0.16-DEV, not released) there is a shuffle func, so you can do something like:

```auto
{{ readDir "cool-images" | shuffle | first 1 }}

```

---

<div class="post-metadata">

**Author:** ![Matteo\_Demaria](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/matteo_demaria/32/9071_2.png) [@Matteo\_Demaria](https://discourse.gohugo.io/u/Matteo_Demaria)\
**Post date:** [July 8, 2019, 12:48pm UTC](https://discourse.gohugo.io/t/random-images-at-build-time/188/12 "2019-07-08T12:48:52Z")

</div>

hello, sorry to re-necro this post,  
i am really new to hugo and to coding in general i guess,

i made a .md file inside my content folder, and i would like to have it showing a random .jpg from a set of .jpgs contained in a folder inside the static folder.

could you please help me ?

thank you and eventually sorry for my english

---

<div class="post-metadata">

**Author:** ![maiki](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/maiki/32/16384_2.png) [@maiki](https://discourse.gohugo.io/u/maiki)\
**Post date:** [July 8, 2019, 3:20pm UTC](https://discourse.gohugo.io/t/random-images-at-build-time/188/13 "2019-07-08T15:20:07Z")

</div>


