When I select preview, the images are not scaled (or being scaled) to fit the screen I am viewing. They are either blowup up out of proportion and/or spill over the edges of the screen. Same is true for when I select a single image. If the images are suppose to be scaled properly for the viewing device being used - not does occur on my MB Pro 15 monitor.
When I select preview, the images are not scaled (or being scaled) to fit the screen I am viewing. They are either blowup up out of proportion and/or spill over the edges of the screen. Same is true for when I select a single image. If the images are suppose to be scaled properly for the viewing device being used - not does occur on my MB Pro 15 monitor.
They're scaled to completely fill the screen, not to fit it. So for example, if the image is portrait and your screen is widescreen, it'll be scaled until the left and right sides of the photo touch the edge of the screen, which will result in the top and bottom of the image ending up outside the screen, and being cropped off.
I have attached a screen shot of image from the preview and this image does appear to the screen sized in either direction. If I am understanding this correctly, all images for a background slideshow must be sized for a standard screen in one direction or the other - one must pick and deal with the off the screen bleed.
I have attached a screen shot of image from the preview and this image does appear to the screen sized in either direction. If I am understanding this correctly, all images for a background slideshow must be sized for a standard screen in one direction or the other - one must pick and deal with the off the screen bleed.
What does that background image look like on its own? It would be easier to see what's going on if we could see the image you're trying to use.
But I think you have it right. It's a full background so it has to fill in the entire screen without leaving any gaps. My recommendation is to create a gallery for your background images. Not a smart gallery or collection because you may have to crop or even flip images to work better as a background photo. If the main part of your image is too far to the right, you may be able to crop off some of the left side to move it over. Just remember to test it out on different aspect ratio monitors and mobile devices.
A lot of people also want the ability to click the image to go to that gallery. That's not practical since its a background image. So what I did was create a collection of all the images I used for my slideshow. That way visitors can get a better look at my background photos and get links to the galleries they come from. The complication is that I'm not showing visitors the actual gallery that the background images come from since it has no captions, keywords, or links back to the original galleries and has images that have bizarre crops and are flipped horizontally. I had to go back, find all the background images I was using in their original galleries, and collect them to a new, public background photos gallery. Pain in the butt, but nice and smooth for visitors. If I had any... not unveiled yet. Waiting for so many bug fixes.
So what are the suggested or preferred dimensions for the background slideshow? All of the images from the gallery I selected are "oversized" to the screen. If I need to create a separate gallery, then what are the recommended or preferred image sizes for the background slide show. Appears to be another poorly thought out "released" feature that simply does not work as demonstrated or at least the appropriate settings for the feature to work properly for every user were not communicated.
Wendell
I think the feature works great. I'm so happy with it. It runs much better than the CSS version. The above posts discuss this pretty in depth so I won't repeat, but what I've done is created a separate gallery and re-uploaded the images in higher resolution. All of my other galleries are set to a max size of X2 or X3 ... so if I collected the images into a "Slideshow" gallery, they'd also be stuck at X2 or X3 ... stretching an X2 or X3 sized image to a large monitor resulted in ugly photos. I'd rather the original photos be used at whatever size they need to be, then let SmugMug scale it down. My "Slideshow" gallery is set to hidden and original sizes.
Yes Aaron, I would love to move it over to the right some.
If you'd like to move the left-nav bar (actually, the entire layout, with the background being the only thing that doesn't move) to the right, to create a gap like I did, use this code:
/* Move the entire layout a bit to the right to give the left navbar some space on the left */
.sm-page-layout {
margin-left: 15px !important;
}
If you'd like to move the left-nav bar (actually, the entire layout, with the background being the only thing that doesn't move) to the right, to create a gap like I did, use this code:
/* Move the entire layout a bit to the right to give the left navbar some space on the left */
.sm-page-layout {
margin-left: 15px !important;
}
Thanks for the time to respond and the additional information on the efficient use / setup of the background feature.
Be nice if SM would update one or two of the standard templates / designs that incorporates the use of this feature in greater detailed than has been explained.
I will give it a shot, but once again, another feature that is not as "simple" and "easy to use" as advertised.
Thanks for the time to respond and the additional information on the efficient use / setup of the background feature.
Be nice if SM would update one or two of the standard templates / designs that incorporates the use of this feature in greater detailed than has been explained.
I will give it a shot, but once again, another feature that is not as "simple" and "easy to use" as advertised.
Regards,
Wendell
Wendell, I'm confused by what you are having trouble with. What can be more simple than selecting a gallery to pull images from and giving you options to set the transition, play time, etc. Seems simple and easy to use to me. I had it up and running in about 15 seconds.
It sounds like the issues you are talking about aren't related to SmugMug's implementation of the slideshow. It works exactly as it should and exactly as one would intend it to. It's called a full-screen slideshow for a reason ... it has to fill the screen. All screen sizes are different -- you could have your browser to fill the entire screen, or you can have it at any one of almost infinite different window sizes. SmugMug fills it no matter what -- exactly as we want since it's our background image(s). But when a photo is a different aspect ratio from the window, what is it supposed to do? I find that the image scales actually quite beautifully as I change the aspect ratio and size of my browser window. So kudos to SmugMug for that.
Perhaps what you're looking for is some greater help pages that describe the more subtle details of using it. Things that are fairly obvious but you may not have thought about before trying to use it: like what happens if your images are smaller in size than the window (it will scale it up, making the photo look pixelated and bad ... so you should upload higher resolution images), etc?
Well, for me, it is not working exactly as "advertised" and today I took more time to attempt to figure this out, but to no avail. No 15 second implementation for me (but congrats). I very capable to follow the instructions provided (multiple times) and still does not produce the result as describe. Feature does not work exactly it should ... for me. Images are not resized (or resizing) in either direction and pixelated. There is no rescaling of the images I choose for the background slide show ... the results are images that "overfilled" screen.
I have searched the help pages for the subtle details and did not find the answers to my questions (hence my questions here). If there are, in fact, "subtle" details that one my account for when using the feature then why are they not covered in the main instructions.
Well, for me, it is not working exactly as "advertised" and today I took more time to attempt to figure this out, but to no avail. No 15 second implementation for me (but congrats). I very capable to follow the instructions provided (multiple times) and still does not produce the result as describe. Feature does not work exactly it should ... for me. Images are not resized (or resizing) in either direction and pixelated. There is no rescaling of the images I choose for the background slide show ... the results are images that "overfilled" screen.
I have searched the help pages for the subtle details and did not find the answers to my questions (hence my questions here). If there are, in fact, "subtle" details that one my account for when using the feature then why are they not covered in the main instructions.
Hopefully I can clear up some of the confusion about the background slideshow feature.
It's really quite simple. It takes your photo, scales it so it covers the entire screen, and centers the image on the screen.
Here are some examples to help illustrate what's happening.
The background photos I'm going to use for a test are:
As you can see, one is landscape and the other is portrait oriented. These are the exact same image, just rotated.
Here's what happens when they are used as backgrounds:
Landscape:
Portrait:
You can now easily see that the portrait background is scaled way up so that the width matches the screen width. Then the top and bottom end up getting cut off because it's centered vertically. The landscape background is also getting the top and bottom cut off simply because the image height is taller than the height of the browser window. If I went with a very short, wide image, it would scale to the top and bottom of the browser window and the left and right sides would get cut off.
As far as pixelization goes, the slideshow will only use the largest display size you make available. If you limit display size to something smaller than the screen size, the image will be upscaled and look pixelated. Put your background photos in their own unlisted gallery and allow originals. And make sure you upload images big enough to be sharp when viewed full screen.
Thanks for your time to explain and very helpful as the images I am attempting to display as part of a background slideshow are exactly as described in your last screen shot. Which leads me back to my original question regarding image size for this feature. If understanding correctly, the use of a portrait sized image in the background slideshow would required the image to be size differently than a landscape (even tho some of the landscapes are cropped off as well). Or maybe the intent of the feature is to fill the screen only and portrait images are not suited for this feature.
What are the sizes of the rectangles in the illustration?
I have created a test gallery and uploaded a variety of sized images (processed in LR5) and set the gallery display style to original with same results as before. Then changed the image size to medium (as a check) and still no change / difference when the background slideshow is displayed.
Hi I have been able to get the slideshow to work, but I have an annoying white bar across the top of the page. Based on testing, it seems this is a "place for content blocks". In edit mode the space is labeled "center" and I can add content blocks to it. But without out any content blocks why would it display a white block?
Obviously there is something I have set somewhere - but I am missing it. Can I delete this "center" space? make is transparent?
Hi I have been able to get the slideshow to work, but I have an annoying white bar across the top of the page. Based on testing, it seems this is a "place for content blocks". In edit mode the space is labeled "center" and I can add content blocks to it. But without out any content blocks why would it display a white block?
Obviously there is something I have set somewhere - but I am missing it. Can I delete this "center" space? make is transparent?
Thanks for your time to explain and very helpful as the images I am attempting to display as part of a background slideshow are exactly as described in your last screen shot. Which leads me back to my original question regarding image size for this feature. If understanding correctly, the use of a portrait sized image in the background slideshow would required the image to be size differently than a landscape (even tho some of the landscapes are cropped off as well). Or maybe the intent of the feature is to fill the screen only and portrait images are not suited for this feature.
What are the sizes of the rectangles in the illustration?
I have created a test gallery and uploaded a variety of sized images (processed in LR5) and set the gallery display style to original with same results as before. Then changed the image size to medium (as a check) and still no change / difference when the background slideshow is displayed.
Again, thanks for your time to offer an explanation and my aging brain is missing it. It will click eventually.
Best,
Wendell
The actual size of the rectangles doesn't matter since the image scales to the size of the screen. The background examples I used were 1920x1080 (I think) just because that's what I already had open in photoshop. I wasn't worried about using any particular size.
I wouldn't use any portrait oriented photos for the background slideshow. If you really want to use them, you could use photoshop or another program to add a black landscape background behind them. Then you'd get the full photo with black bars on the sides. I don't think that would look good and I don't particularly like the example site you are trying to emulate (which is not a smugmug site). I think you can do much better with smugmug.
What are the dimensions of the photos you are uploading? Upload them in full resolution and let smugmug deal with the smaller display copies. If your backgrounds look the same when the max display size is set to medium as they do when it's set to original, I'd guess the files you're uploading are too small.
The background slideshow isn't like other slideshows on smugmug. It's not really great for displaying photos. It just shuffles a full screen background image. You need to pick images carefully that will work well as background images. You don't want to use images that will interfere with the foreground site content. The colors need to work, important parts of the image can't be cropped off or covered by site content (on different aspect ratio monitors, phones, etc), and so on.
Again, thanks for your time to reply / comment and I appreciate the feedback. I have a much better understanding of the background feature and the challenges / requirements for the feature to work as I had envisioned.
Comments
Yes Aaron, I would love to move it over to the right some.
They're scaled to completely fill the screen, not to fit it. So for example, if the image is portrait and your screen is widescreen, it'll be scaled until the left and right sides of the photo touch the edge of the screen, which will result in the top and bottom of the image ending up outside the screen, and being cropped off.
Please check out my gallery of customisations for the New SmugMug, more to come!
What does that background image look like on its own? It would be easier to see what's going on if we could see the image you're trying to use.
But I think you have it right. It's a full background so it has to fill in the entire screen without leaving any gaps. My recommendation is to create a gallery for your background images. Not a smart gallery or collection because you may have to crop or even flip images to work better as a background photo. If the main part of your image is too far to the right, you may be able to crop off some of the left side to move it over. Just remember to test it out on different aspect ratio monitors and mobile devices.
A lot of people also want the ability to click the image to go to that gallery. That's not practical since its a background image. So what I did was create a collection of all the images I used for my slideshow. That way visitors can get a better look at my background photos and get links to the galleries they come from. The complication is that I'm not showing visitors the actual gallery that the background images come from since it has no captions, keywords, or links back to the original galleries and has images that have bizarre crops and are flipped horizontally. I had to go back, find all the background images I was using in their original galleries, and collect them to a new, public background photos gallery. Pain in the butt, but nice and smooth for visitors. If I had any... not unveiled yet. Waiting for so many bug fixes.
Dave
I think the feature works great. I'm so happy with it. It runs much better than the CSS version. The above posts discuss this pretty in depth so I won't repeat, but what I've done is created a separate gallery and re-uploaded the images in higher resolution. All of my other galleries are set to a max size of X2 or X3 ... so if I collected the images into a "Slideshow" gallery, they'd also be stuck at X2 or X3 ... stretching an X2 or X3 sized image to a large monitor resulted in ugly photos. I'd rather the original photos be used at whatever size they need to be, then let SmugMug scale it down. My "Slideshow" gallery is set to hidden and original sizes.
Former SmugMug Product Team
aaron AT aaronmphotography DOT com
Website: http://www.aaronmphotography.com
My SmugMug CSS Customizations website: http://www.aaronmphotography.com/Customizations
If you'd like to move the left-nav bar (actually, the entire layout, with the background being the only thing that doesn't move) to the right, to create a gap like I did, use this code:
/* Move the entire layout a bit to the right to give the left navbar some space on the left */ .sm-page-layout { margin-left: 15px !important; }Former SmugMug Product Team
aaron AT aaronmphotography DOT com
Website: http://www.aaronmphotography.com
My SmugMug CSS Customizations website: http://www.aaronmphotography.com/Customizations
Aaron, that worked out perfect, thank you.
Be nice if SM would update one or two of the standard templates / designs that incorporates the use of this feature in greater detailed than has been explained.
I will give it a shot, but once again, another feature that is not as "simple" and "easy to use" as advertised.
Regards,
Wendell
Wendell, I'm confused by what you are having trouble with. What can be more simple than selecting a gallery to pull images from and giving you options to set the transition, play time, etc. Seems simple and easy to use to me. I had it up and running in about 15 seconds.
It sounds like the issues you are talking about aren't related to SmugMug's implementation of the slideshow. It works exactly as it should and exactly as one would intend it to. It's called a full-screen slideshow for a reason ... it has to fill the screen. All screen sizes are different -- you could have your browser to fill the entire screen, or you can have it at any one of almost infinite different window sizes. SmugMug fills it no matter what -- exactly as we want since it's our background image(s). But when a photo is a different aspect ratio from the window, what is it supposed to do? I find that the image scales actually quite beautifully as I change the aspect ratio and size of my browser window. So kudos to SmugMug for that.
Perhaps what you're looking for is some greater help pages that describe the more subtle details of using it. Things that are fairly obvious but you may not have thought about before trying to use it: like what happens if your images are smaller in size than the window (it will scale it up, making the photo look pixelated and bad ... so you should upload higher resolution images), etc?
Former SmugMug Product Team
aaron AT aaronmphotography DOT com
Website: http://www.aaronmphotography.com
My SmugMug CSS Customizations website: http://www.aaronmphotography.com/Customizations
I have searched the help pages for the subtle details and did not find the answers to my questions (hence my questions here). If there are, in fact, "subtle" details that one my account for when using the feature then why are they not covered in the main instructions.
Hopefully I can clear up some of the confusion about the background slideshow feature.
It's really quite simple. It takes your photo, scales it so it covers the entire screen, and centers the image on the screen.
Here are some examples to help illustrate what's happening.
The background photos I'm going to use for a test are:
As you can see, one is landscape and the other is portrait oriented. These are the exact same image, just rotated.
Here's what happens when they are used as backgrounds:
Landscape:
Portrait:
You can now easily see that the portrait background is scaled way up so that the width matches the screen width. Then the top and bottom end up getting cut off because it's centered vertically. The landscape background is also getting the top and bottom cut off simply because the image height is taller than the height of the browser window. If I went with a very short, wide image, it would scale to the top and bottom of the browser window and the left and right sides would get cut off.
As far as pixelization goes, the slideshow will only use the largest display size you make available. If you limit display size to something smaller than the screen size, the image will be upscaled and look pixelated. Put your background photos in their own unlisted gallery and allow originals. And make sure you upload images big enough to be sharp when viewed full screen.
Dave
Thanks for your time to explain and very helpful as the images I am attempting to display as part of a background slideshow are exactly as described in your last screen shot. Which leads me back to my original question regarding image size for this feature. If understanding correctly, the use of a portrait sized image in the background slideshow would required the image to be size differently than a landscape (even tho some of the landscapes are cropped off as well). Or maybe the intent of the feature is to fill the screen only and portrait images are not suited for this feature.
What are the sizes of the rectangles in the illustration?
I have created a test gallery and uploaded a variety of sized images (processed in LR5) and set the gallery display style to original with same results as before. Then changed the image size to medium (as a check) and still no change / difference when the background slideshow is displayed.
Here is what I want to achieve as a sample:
http://www.markpain.com/
Here is my current state:
http://bwjcaptures.smugmug.com/
Again, thanks for your time to offer an explanation and my aging brain is missing it. It will click eventually.
Best,
Wendell
Obviously there is something I have set somewhere - but I am missing it. Can I delete this "center" space? make is transparent?
http://www.mikepierson.com/
Thanks,
Mike
It's not white, but a light gray (#eeeeee). Not really sure what the "center" space is, but you can try this to hide it:
.sm-user-ui .sm-page-content > .sm-page-layout > .sm-page-layout-region > .sm-page-layout-region-center { background-color: transparent !important; }Images in the Backcountry
My SmugMug Customizations | Adding CSS to Your Site | SEO for the Photographer | Locate Your Page/Widget Number | SmugMug Help Desk
Ok I got it solved. It was the "body" setting in the Theme.
I did not end up using (or trying) the CSS you offered, but thank you for giving it a shot. Appreciate your help.
Mike
The actual size of the rectangles doesn't matter since the image scales to the size of the screen. The background examples I used were 1920x1080 (I think) just because that's what I already had open in photoshop. I wasn't worried about using any particular size.
I wouldn't use any portrait oriented photos for the background slideshow. If you really want to use them, you could use photoshop or another program to add a black landscape background behind them. Then you'd get the full photo with black bars on the sides. I don't think that would look good and I don't particularly like the example site you are trying to emulate (which is not a smugmug site). I think you can do much better with smugmug.
What are the dimensions of the photos you are uploading? Upload them in full resolution and let smugmug deal with the smaller display copies. If your backgrounds look the same when the max display size is set to medium as they do when it's set to original, I'd guess the files you're uploading are too small.
The background slideshow isn't like other slideshows on smugmug. It's not really great for displaying photos. It just shuffles a full screen background image. You need to pick images carefully that will work well as background images. You don't want to use images that will interfere with the foreground site content. The colors need to work, important parts of the image can't be cropped off or covered by site content (on different aspect ratio monitors, phones, etc), and so on.
Dave
Again, thanks for your time to reply / comment and I appreciate the feedback. I have a much better understanding of the background feature and the challenges / requirements for the feature to work as I had envisioned.
Best Regards,
Wendell