Display a random image

How To
1

Hi,
How can I display a random image?
I want to have a Picture of the Day.
The images would all be in the Media library and can be contained in a Happy Files folder to make organisation easier. But how to choose one at random each time?

2

You can use Unsplash API and add it as background URL https://source.unsplash.com/random/?city,night

The last two parameters are what generates a random image, you can write anything you want.

Btw this picture won’t be saved in your Media Library if you want to do something like that, that would require a bit of setup.

3

Here is great tutorial if you wish to do something more advanced - Upload Files to WordPress Media Library Programmatically

1 Like
4

You can just have a div → with query, type media, posts-per-page = 1, order = random. Then add an image inside and source=post_id.

If you want to limit to a happy files folder - use INCLUDE TERMS - and pick the HF folder.

3 Likes
5

Many thanks!

I already have the folder of photos in the media library/Happy Files, as the users upload them themselves.
A query on a div works a treat and displays a random choice from the folder.

But I would like to extend this a bit. How can I make the same photo display all day for 1 day. Then a new random selection the next day?
I assume I’ll need a function to decide if a new photo or an existing photo is chosen.

6

I found this snippet in Code Snippets

add_action( ‘init’, function () {

$hook = 'run_snippet_daily';
$args = array();

if ( ! wp_next_scheduled( $hook, $args ) ) {
	wp_schedule_event( time(), 'daily', $hook, $args );
}

} );

add_action( ‘run_snippet_daily’, function () {

// do something once each day

} );

Basicly what I would do is create a wp query that returns a single post every day and places that post in wordpress transients than get that trainsent as url to showcase the photo of the day.

The other way is to create CPT called photo of the day and daily insert a random post inside and rendering that cpt as the latest post with Bricks query.

7

When you set the query to random, an option appears: Random seed TTL
I believe you can set this to 24hrs - so it won’t regenerate and will pick the same image.

1 Like
8

Didn’t knwo that cool :slight_smile:

9

Thanks yet again.

The Div query is working well and initial testing of the TTL seems good. Bricks has so much hidden away if only I knew where to look!

The code snippet is also very helpful for another question I had but hadn’t got around to asking yet. I like this psychic help.

Cheers
Alan

10

I managed to solve it in the following way in case it helps anyone.

create a container within the container incorporate a block and within the block incorporate an image.

container
Flex wrap: Wrap
direction: horizontal

blocks
use query loop : on
query:
Type: Post
Post type: media
Mime type: image
Order by: Random
Random seed TTL : random-seed-ttl
Post per page: 1
in style block
custom css
:root {
–random-seed-ttl: 10s; /* 10 second TTL */
}

image
in content
{post_id}

2 Likes