Options

Did Someone Order a Full-Screen Homepage Slideshow?

mbonocorembonocore Registered Users Posts: 2,299 Major grins
edited December 26, 2013 in SmugMug Product News
Many of you told us that the full-screen homepage slideshow was essential to your website. We’ve got something new we think you’ll love: A full-screen slideshow for your pages and galleries!

Screen%20Shot%202013-12-19%20at%206.14.16%20PM-X2.png


How does it work?

We’ve added a brand-new background tab to your site customization, which means you can easily add a single image, a series of single images or a slideshow as the background of your homepage.

Additionally, Power, Portfolio and Business users can add unique backgrounds to other pages on their site: Folders, Galleries and Pages. This background sits behind the other content blocks that you’ve added on the page, exactly the same way that a color, texture, or graphic added from the Theme tab currently does.

How do I get started?

1) Open up your Customization and look for the new “Background” tab in the Customize panel.

i-HMJ6FHS-M.png

2) Choose where your new background will show. By default, your ‘background’ will be inherited from your entire site but you can display something across every page on your entire site, have it live just on your homepage, or make it appear on every single Folder or gallery page.

i-MrTRXcb-M.png

3) Choose the background type. To add a full-screen slideshow to your homepage, open up the drop down menu to choose the Slideshow option. Be sure the “Homepage” location is selected, too:

i-KzLdZFn-M.png

Note: Choosing “None” will evert your background to whatever is set in your Theme.

4) Save your new goodies by Publishing your changes. That’s it!

Can I customize those slideshow options?

Of course! You can set:
    your images playback speed transition type and speed a splash image to be used to entertain your viewers while the full slideshow loads

i-6bWPFzK-M.png

What else can I do with the new Background tab?

You’re not just limited to slideshows. Choose the “Photo” option to add an edge-to-edge photo to the background. We recommend setting it so that your visitors see a new image each time they visit your site!

i-fqngcng-M.png

To do this, create a gallery of background images, or select photos from several different galleries on your site. Opting to change the photo “every visit” gives your site a fresh new look each time your fan comes back.

i-QPcHQRk-M.png

Tip: Be sure that your selection of images play well with your text colors!

Is there anything I should watch out for?

These background images sit behind all of the content blocks on the pages to which that you add them. They will lie under your navigation menus, Galleries Blocks, Text Blocks, and so on. To avoid a completely cluttered experience, we recommend that you remove existing content blocks from your page if the slideshow is the focus of that page.

Is it available on MY SmugMug account?

Yes! Once again, all SmugMug users will be able to add background images or slideshows to their homepage. Power, Portfolio and Business accounts (levels that include additional customization options) will also be able to change the background content on any page on their site.

Where can I learn more about the new Background options?

If you still have questions about this feature, our brand new help page is there to help you. So are our Support Heroes!

So sit back, enjoy the (slide)show, and let us know what you think in the comments below. Don’t forget to share what you’re designing, too, as part of our ongoing Show Us Your SmugMug contest. :)

Comments

  • Options
    AndyAndy Registered Users Posts: 50,016 Major grins
    edited December 19, 2013
    Fricken AWESOME GUYS!!!!!!!
  • Options
    AndyAndy Registered Users Posts: 50,016 Major grins
    edited December 19, 2013
    Already implemented. Thanks SM!
  • Options
    thenickdudethenickdude Registered Users Posts: 1,302 Major grins
    edited December 20, 2013
  • Options
    southeasternphotographysoutheasternphotography Registered Users Posts: 647 Major grins
    edited December 20, 2013
    Fantastic!
    Can't wait to play with it! THANKS!:D
  • Options
    bike21bike21 Registered Users Posts: 836 Major grins
    edited December 20, 2013
    Looking good! Getting closer & closer for my photos to fully 'come home' to SM. Honestly I am digging my squarespace presence as my primary site but a few more tweaks to SM and I'm back.
  • Options
    The 48th RoninThe 48th Ronin Registered Users Posts: 48 Big grins
    edited December 20, 2013
    Is there a way to not have your photos extend off screen? Extend full width or height wise, so it fits.
  • Options
    dennismullendennismullen Registered Users Posts: 709 Major grins
    edited December 20, 2013
    The Firefox unneeded scroll bar bug is still rearing it's ugly head.
    There shouldn't be scroll bars if the picture is sized to fit the screen.

    http://www.dgrin.com/showthread.php?t=241183&highlight=scroll+bars

    Cheers,
    See my gallery at http://www.dennismullen.com
  • Options
    denisegoldbergdenisegoldberg Administrators Posts: 14,238 moderator
    edited December 20, 2013
    The Firefox unneeded scroll bar bug is still rearing it's ugly head.
    There shouldn't be scroll bars if the picture is sized to fit the screen.

    http://www.dgrin.com/showthread.php?t=241183&highlight=scroll+bars
    Can we please keep this thread to comments on the full-screen homepage slideshow?
    If you are having other problems, bumping the thread for that problem would be a better approach than commenting in an unrelated thread.

    Thanks.

    --- Denise
  • Options
    dennismullendennismullen Registered Users Posts: 709 Major grins
    edited December 20, 2013
    Can we please keep this thread to comments on the full-screen homepage slideshow?
    If you are having other problems, bumping the thread for that problem would be a better approach than commenting in an unrelated thread.

    Thanks.

    --- Denise

    The point I'm making is the full screen slideshow fills my screen but I get both a horizontal and vertical unneeded scroll bar from it. How is that not related?
    See my gallery at http://www.dennismullen.com
  • Options
    AndyAndy Registered Users Posts: 50,016 Major grins
    edited December 20, 2013
    The point I'm making is the full screen slideshow fills my screen but I get both a horizontal and vertical unneeded scroll bar from it. How is that not related?

    I get no scroll bars on your website in FF.
  • Options
    dennismullendennismullen Registered Users Posts: 709 Major grins
    edited December 21, 2013
    Andy wrote: »
    I get no scroll bars on your website in FF.

    I have to use code to hide them.

    Cheers,
    See my gallery at http://www.dennismullen.com
  • Options
    denisegoldbergdenisegoldberg Administrators Posts: 14,238 moderator
    edited December 21, 2013
    The point I'm making is the full screen slideshow fills my screen but I get both a horizontal and vertical unneeded scroll bar from it. How is that not related?
    The post you pointed to was not about a homepage slideshow. If you're having problems with the new slideshow (as opposed to a photo in lightbox where you are displaying the Original, which is what the other thread seems to be about) then adding a description here would be useful. If you want help from smug I'd suggest not hiding the scroll bars.

    --- Denise
  • Options
    LPCLPC Registered Users Posts: 481 Major grins
    edited December 21, 2013
    I like it very much but I wish 'recent photos' was an option for the slideshow background just as it is in the slideshow content block. Can this not be added?
  • Options
    pilotdavepilotdave Registered Users Posts: 785 Major grins
    edited December 21, 2013
    LPC wrote: »
    I like it very much but I wish 'recent photos' was an option for the slideshow background just as it is in the slideshow content block. Can this not be added?

    Not every image will work well as a full screen background. I'd recommend choosing images carefully.

    Dave
  • Options
    ian408ian408 Administrators Posts: 21,908 moderator
    edited December 21, 2013
    I have to use code to hide them.

    Cheers,

    That was brilliant. ne_nau.gif
    Moderator Journeys/Sports/Big Picture :: Need some help with dgrin?
  • Options
    AndyAndy Registered Users Posts: 50,016 Major grins
    edited December 21, 2013
    I have to use code to hide them.

    Cheers,

    Bravo! So why do you continue to complain about it then? You have a solution for your very highly customized site thumb.gif
  • Options
    LPCLPC Registered Users Posts: 481 Major grins
    edited December 22, 2013
    pilotdave wrote: »
    Not every image will work well as a full screen background. I'd recommend choosing images carefully.

    Dave

    If there was the possibility that any of my photographs would look bad as a full screen image then I wouldn't upload them in the first place mwink.gif

    I chose to go with a single image in the end anyway.
  • Options
    mbonocorembonocore Registered Users Posts: 2,299 Major grins
    edited December 23, 2013
    LPC wrote: »
    I like it very much but I wish 'recent photos' was an option for the slideshow background just as it is in the slideshow content block. Can this not be added?

    Great suggestion! I will pass it along :)
  • Options
    dennismullendennismullen Registered Users Posts: 709 Major grins
    edited December 23, 2013
    Both slideshows need the click through option as well.

    Cheers,
    See my gallery at http://www.dennismullen.com
  • Options
    phaserbeamphaserbeam Registered Users Posts: 452 Major grins
    edited December 26, 2013
    This is exactly what many of us were looking for. Nice add :)

    The only "problem" i do have with that new feature is that the background image loads much slower then when using the workaround described here. The picture builds up slowly from top to bottom of the screen. Using the "old method" the picture takes half a second to load and then appears on screen. Yes, not a real problem for most of us, i just like the old method better that's why i switched back to the "old method".

    Maybe the new code can be optimized by prefetch the background picture, using smaller sizes or doing some other changes.

    Anyway, nice to see that there is some work done on the new SM to improve it :)
  • Options
    thenickdudethenickdude Registered Users Posts: 1,302 Major grins
    edited December 26, 2013
    Which web browser are you using? It might not be able to display my hack's CSS background-images while they load, so it might only show the image when it has fully loaded. Meanwhile, the new SmugMug feature uses image tags, which it sounds like your browser can display as they load.

    FWIW, I'm using Chrome and the images from my hack and from SmugMug's new feature both load in from top to bottom, I can't tell a difference in performance (well, maybe a tiny one since the SmugMug feature requires the page JavaScript to finish loading before the download of the background image can begin).

    Are you sure that you're not just comparing the performance of cached images you've already seen from my background hack, against brand new image links created by SmugMug's new feature that may have never been seen by your browser before? Try clearing your cache and compare the methods again.
  • Options
    phaserbeamphaserbeam Registered Users Posts: 452 Major grins
    edited December 26, 2013
    Lamah wrote: »
    Try clearing your cache and compare the methods again.

    i'm using firefox26 and i tried the same on unsupported opera, on both your hack loads the photos at once while with the new feature they load from top to bottom... i also tested konqueror (also unsupported, i know) and here they load at once. For both methods i used photos from the same gallery.

    This seem to be a browser related issue even when using a supported browser (FF).

    I switched back to your hack. It's ok for me, i don't need the extra features from the new background slideshow.

    If you go to my site and click on the logo "phaserbeam" this should "reload" the page and you should get a new background on every click. Do you see the "top-to-bottom"-effect here? As said, i'm currently back on your hack. When using opera, firefox or konqueror the background images appears when fully loaded.
  • Options
    thenickdudethenickdude Registered Users Posts: 1,302 Major grins
    edited December 26, 2013
    Yes, I get the top-to-bottom effect there in Chrome, the loading is the same as SmugMug's version.

    It looks like the image loads in at once on some browsers because SmugMug generates Progressive JPEG images.

    Progressive JPEGs start out by loading a super blurry version from top to bottom (almost instantly), then load in successively sharper versions from top-to-bottom until the full resolution is achieved. But in browsers that don't support displaying these while they're loading, you instead just see an empty screen until it is completely loaded, then it pops in at full resolution, which it sounds like is the behaviour you want.

    I know that for Opera, progressive images can only be displayed during loading (i.e. display top-to-bottom) if they're in image tags like SmugMug's version, not with CSS backgrounds, which explains the behaviour difference. I imagine that Firefox has the same restriction.
  • Options
    phaserbeamphaserbeam Registered Users Posts: 452 Major grins
    edited December 26, 2013
    Lamah wrote: »
    It looks like the image loads in at once on some browsers because SmugMug generates Progressive JPEG images.

    yes, progressive JPEGs might be some reason... but... do we talk about the same? Here is a screenshot. You can see the photo is not completly loaded and unsharp. The unsharpd would be ok, but while loading you can see only parts of it. When using FF and your hack i do not have seen that on my site before. If this is chrome-related... ok, i don't recommend using chrome to visit my site then :D
  • Options
    thenickdudethenickdude Registered Users Posts: 1,302 Major grins
    edited December 26, 2013
    That's the first level of the JPEG progressive encoding loading in from top to bottom. Once that finishes loading, the next levels of detail will load in from top to bottom on top of it.

    Chrome's support of progressive JPEG is more advanced which allows the image to appear on the page seconds earlier than on some other browsers (as the blurry version), which is normally quite desirable. I guess for the page background though, it's more distracting than useful.
  • Options
    phaserbeamphaserbeam Registered Users Posts: 452 Major grins
    edited December 26, 2013
    Lamah wrote: »
    I guess for the page background though, it's more distracting than useful.

    Thanks for clarification. Looks like Chrome is always affected and Firefox only with the new SM-Feature. So i will stay with your hack which seem to work best for firefox.

    I'll give it a try again sometime next year... :D

    Right now your hack works as it should. I don't need to change anything here right now...
Sign In or Register to comment.