[Implemented] Randomly chosen background image

jib63 · August 4, 2013

Hello It would be nice to be able to add in the home page a single image as it is already possible currently but picked-up randomly in a gallery or a list of images defined.

Thanks
JB

southeasternphotography · August 4, 2013

Makes sense to me.

Pat664422 · August 4, 2013

Definitely agree. This option would make doing a theme like Sierra more interesting than just seeing the same pic every time.

thenickdude · August 14, 2013

Randomly chosen background image
It would be really cool if we could choose multiple images for our theme background, and a random image would be chosen from that selection upon each page load.

BigRed · August 23, 2013

Lamah wrote: »

It would be really cool if we could choose multiple images for our theme background, and a random image would be chosen from that selection upon each page load.

Folks, please note how appealing this is on Lamah's homepage. It shows off the best of his images to their best full-screen advantage, while keeping it fresh with rotating images -- so return visitors see potentially a different image every time. A nice alternative to the full-screen, randomized slideshow that many have requested -- and even better if you want visitors to linger admiringly on a single image (and fewer, I assume, of the potential performance issues). I'd love to be able to do this.

Lamah wrote: »

Currently, my method requires JavaScript to generate a random number which chooses the background, so unfortunately it can't really be used on New SmugMug.

pileofprints · September 6, 2013

Lamah wrote: »

It would be really cool if we could choose multiple images for our theme background, and a random image would be chosen from that selection upon each page load.

I am in complete agreement with this, as I posted in another thread -- I believe this, a different fullscreen everytime a viewer returns, is the way to make our sites get return visitors.

You are very close to achieving this already on the site you reference. What is missing?

TheBradford · September 12, 2013

OMG Lamah - I want that random photo generation! How do I do that? I don't see the customization CSS on your site for tihs and would love to know how to achieve this. This, plus client login are like the only two things I need to make my site be what I want it to be and finally make it go live.

WHAT IS THE HOLD UP SM? How do you totally revamp your UI like this, make it look so awesome so easy and intuitive yet forget to have a client login function for all the highest paying PRO Users?

thenickdude · September 12, 2013

Sorry, it requires JavaScript to generate a random number, which isn't supported.

TheBradford · September 15, 2013

lamah wrote: »

sorry, it requires javascript to generate a random number, which isn't supported.

dammit!!!

thenickdude · September 17, 2013

Hey guys, I figured out how to do this without JavaScript, so please check out the details here and try it out

http://dgrin.com/showthread.php?t=240846

BigRed · September 17, 2013

Lamah wrote: »

Hey guys, I figured out how to do this without JavaScript, so please check out the details here and try it out

http://dgrin.com/showthread.php?t=240846

Brilliant work, Lamah! Thank you so much for all your contributions.

leftquark · September 20, 2013

+1 for me. I'm going to try to implement your code from your website tomorrow morning when I'm not so exhausted, but it'd be great if SmugMug allowed us to do this without having to do tricks like this!

pileofprints · September 20, 2013

Lamah wrote: »

Hey guys, I figured out how to do this without JavaScript, so please check out the details here and try it out

http://dgrin.com/showthread.php?t=240846

If i want the images to appear in the order they are in the gallery. Or in a pre-determined order. Can I do that as well? Is that just too easy or too hard?

I want this because my site is based on a pile of prints metaphor and I want to create a pile that unstacks itself.

thenickdude · September 20, 2013

It doesn't display as an animation, it just loads one random photo when the page is first loaded.

There's no way to remember which image the user saw last time, so you couldn't have it load images in sequence upon successive page loads.

What are you trying to achieve, exactly?

phaserbeam · September 20, 2013

Lamah wrote: »

Hey guys, I figured out how to do this without JavaScript, so please check out the details here and try it out

http://dgrin.com/showthread.php?t=240846

Awesome!!!

Much better then the SM slideshow which always shows the same photo on start. Loving it!

thenickdude · September 20, 2013

phaserbeam wrote: »

Awesome!!! Much better then the SM slideshow which always shows the same photo on start. Loving it!

Looks like it works great on your homepage!

mbonocore · September 22, 2013

Nice work Lamah! I have submitted this to be in the UI to make it easier. Thanks!

phaserbeam · September 22, 2013

Lamah wrote: »

Looks like it works great on your homepage!

Yes... indeed it works. You did a really great job on that, thanks again

mbonocore wrote: »

Nice work Lamah! I have submitted this to be in the UI to make it easier. Thanks!

Now that would be cool! Instead of select a single background image for a theme... select a gallery where the UI take the background image from. Of course this must happen randomly. Not like the slideshow always starting with the first image in a gallery

pileofprints · September 23, 2013

Lamah wrote: »

It doesn't display as an animation, it just loads one random photo when the page is first loaded.

There's no way to remember which image the user saw last time, so you couldn't have it load images in sequence upon successive page loads.

What are you trying to achieve, exactly?

Thank you so much for clarifying my confused thoughts with this reply.

I want to use your random bg image on home page as it was intended as a splash screen on my "home page" or base url, but add what is currently on my home page -- featured galleries to a new "hub" page. I'm hoping the smugmug system is flexible enough to let me do that with a custom folder page.

update below:

Ah, yes, I see from the experimental "browse" page on your http://www.sherlockphotography.org/browse site that what I want to do is possible. -- You asked for comments in the other thread, so I will make them there. But thanks again for showing me the way.

pileofprints · September 28, 2013

My images have a black background and I'm using a black background for my site. So, I was cropping the images tightly thinking they would be shown at original size and centered. This hasn't worked. They seem to be getting blown up. I assume that I just need to expand that black background. What size do you recommend that I make the images? In photoshop speak, what size should I make the canvas-- I can extend it to any size.

Thanks.

thenickdude · September 28, 2013

Change the CSS from "background-size: cover" to "background-size: contain" to fill the screen on at least one edge, or "background-size: auto auto" to use the original image size.

pileofprints · September 28, 2013

Lamah wrote: »

Change the CSS from "background-size: cover" to "background-size: contain" to fill the screen on at least one edge, or "background-size: auto auto" to use the original image size.

This stopped the image from being expanded and positions it correctly. (I also changed background position from center center to

background-position: center top;

However, now the background image is tiling. I wouldn't notice this on my laptop if I hadn't cropped these images tightly. So it was a good thing you advised me not to increase their canvas size before. One solution would be to extend the canvas size of the images massively now. However, with the size of monitors these days I thought I'd check if the tiling could be stopped in the CSS code.

Thanks again, so much for this code.

thenickdude · September 28, 2013

Try adding background-repeat: no-repeat; to the CSS, I think that should do the trick!

jib63 · December 1, 2013

Any news of this feature ? Is it implemented ?

thenickdude · December 2, 2013

jib63 wrote: »

Hello It would be nice to be able to add in the home page a single image as it is already possible currently but picked-up randomly in a gallery or a list of images defined.

You can display a single random image on the page (not as a background) using the Slideshow block. Add it to the page, set the source up (e.g. recent photos, keyword, specific gallery). On the Playback tab, set Auto Start to off, and Randomize Images to on. On the Controls tab, set everything to Off.

You'll end up with one randomly displayed photo, very similar to a Single Photo block, with an added and quite attractive fade-in upon load. You can disable the fade-in by setting the Transition to None.

mbonocore · December 2, 2013

This is an active Feature Request. We will keep you posted!

mbonocore · December 2, 2013

Merged the two threads

mbonocore · December 19, 2013

Implemented today

http://dgrin.com/forumdisplay.php?f=62

[Implemented] Randomly chosen background image

Comments