"you refer to "margins"; can you recall where you amended those margins settings?
Fabio" (I forgot to hit Reply for the quote)
Went to Customize, entire site, Active theme and click on the wrench. You will see the header color option there!
The margins are found at Customize, Entire Site, Layout and you will find margin settings.
Went to Customize, entire site, Active theme and click on the wrench. You will see the header color option there!
The margins are found at Customize, Entire Site, Layout and you will find margin settings.
I could fix the header color but as for margins top/bottom are already set to "0" by default in my Customization area and changing them to different values doesn't solve the problem. I now have the slideshow under layed the header and threfore the slideshow results cropped on top.
One thing though; I don't understand what will happen to the space where Customization bar is now once the site will be unveiled.
Please bear if I might sound insistent but I'm stuck on this issue since more than a week already and I still don't see a solution :cry
p.s. using the same Theme you are using would maybe make things a bit easier to understand for myself, would you mind me doing that?
Did you put the CSS code into the CSS box of the HTML block?
Hi Simon
I'm trying, as you may see from my posts, to sort out few issues about using the full width slideshow
I had a look at your site and noticed a couple of things that could work well for myself too:
- how did you get to have the header stitched to the top of the page? Mine is a stripe that leaves a certain amount of space between its upper border and the top border of the page
- and, of course, how did you get rid of "Photo Sharing by SmugMug" in footer?
thanks
Hi Simon
I'm trying, as you may see from my posts, to sort out few issues about using the full width slideshow
I had a look at your site and noticed a couple of things that could work well for myself too:
- how did you get to have the header stitched to the top of the page? Mine is a stripe that leaves a certain amount of space between its upper border and the top border of the page
- and, of course, how did you get rid of "Photo Sharing by SmugMug" in footer?
thanks
Do you have Top Margin set to "0"? If you think you have CSS changing it to more than 0 then you need to find it and remove it as I believe the CSS is going to over-ride the menu Layout settings. and, yes, darkening the header background will make the top get cut-off. I am using the zoom slideshow, and it seems to be ok enough for my selected images 'cause the zoom is going to cut it off anyway.
Please bear if I might sound insistent but I'm stuck on this issue since more than a week already and I still don't see a solution :cry
It took me over two months to make my site simple and how I wanted! Had to do what you are doing asking for help, waiting for bug fixes, looking at MANY posts in the different DGRIN SmugMug threads to see who had items I wanted and solutions. Some of the folks who used to respond with help have finally finished their sites and seem not to log into DGRIN anymore. So, ya might need more time than you would have thought.
p.s. using the same Theme you are using would maybe make things a bit easier to understand for myself, would you mind me doing that?
Not sure what you are asking. I am using SmugMug Theme. If you switch themes you will have to add all the code you put in your current theme into the new theme. Then, if you make changes, they will not appear in your earlier theme so you would have to remember everything to put into that theme when you go back. Make sense? Meaning coding you put in one theme does not get auto added to other themes.
Keep hacking at it! I finally like my new site better than my legacy site. Like I said, it took over two months!
Scroll down so the Customize area and color disappear to the top of your header color. That is what it will look like! That simple!
Uhm...I don't know why but I just can't scroll down in homepage, I can scroll down only in other pages where there's content below the fold.
In fact, slideshow images exceed the lower part of homepage but still I can't scroll down.
And, needless to say, homepage is on top of my priorities...
Do you have Top Margin set to "0"? If you think you have CSS changing it to more than 0 then you need to find it and remove it as I believe the CSS is going to over-ride the menu Layout settings.
There are two portions of CSS code of the slideshow where it appears the "Top" item but they are already set to "0"
.cb-slideshow li span {
width: 100%;
height: 100%;
position: absolute;
top: 0px;
left: 0px;
color: transparent;
background-size: cover;
background-position: 50% 50%;
background-repeat: none;
opacity: 0;
z-index: 0;
-webkit-backface-visibility: hidden;
-webkit-animation: imageAnimation 36s linear infinite 0s;
-moz-animation: imageAnimation 36s linear infinite 0s;
-o-animation: imageAnimation 36s linear infinite 0s;
-ms-animation: imageAnimation 36s linear infinite 0s;
animation: imageAnimation 36s linear infinite 0s;
}
Ah, ok. Then how about this...check out your file you are using for the header. Is there empty space there? Hmmm...maybe that is just typed in...hmmmm....how about the size of the Menu block. It is on the same line as your name and THAT might be creating the extra space at the top. My setup is different, so can't say what to look for.
I am trying this without success. I have added the HTML and CSS boxes to my homepage. Is that right?
The gallery I am pulling the images from is an unlisted gallery? Please help as I do like my background but i'd far prefer this slideshow option!
Thanks!
Tell us more to understand your problem, "I am trying this without success" is rather generic.
What's your problem at the moment? What exactly is NOT working? What do you see and what you don't?
A link to your actual page would be the best thing, otherwise you can post a screenshot.
I'm also using images from an unlisted gallery so that shouldn't be a problem; one thing I can suggest, as I'm not a master on this, is to double check the CSS and HTML codes you pasted.
Do you have other Photo Content blocks active in homepage? Not sure, but if you do that might conflict with your Full Width slideshow.
Are all images in the slideshow exactly the same size? Check that too, I did use just one picture slightly different and the whole thing got stuck.
Many small details can derail this customized feature but (almost) everything can be fixed!
It started playing the images that are in the sample (I guess the guy who created the show his images) that makes sense as the links in the CSS go to his stuff. When I went to replace them links to a gallery I have unlisted as "slideshow gallery" or something like that - it doesn't work. Not sure what I am doing wrong.
Should I try this again, leave it then come back here and post for you to see it?
It started playing the images that are in the sample (I guess the guy who created the show his images) that makes sense as the links in the CSS go to his stuff. When I went to replace them links to a gallery I have unlisted as "slideshow gallery" or something like that - it doesn't work. Not sure what I am doing wrong.
Should I try this again, leave it then come back here and post for you to see it?
I'm just speculating, but there might be mistakes in the link to your images.
Did you retrieve the links from the "Share>Get link" option in the unlisted gallery from where pictures are pulled in?
But please, don't keep saying "doesn't work", try to describe more in detail what's happening.
I'm just speculating, but there might be mistakes in the link to your images.
Did you retrieve the links from the "Share>Get link" option in the unlisted gallery from where pictures are pulled in?
But please, don't keep saying "doesn't work", try to describe more in detail what's happening.
No i clicked the photos, had it open in the lightbox and just grabbed that link. Is that what I am doing wrong?
No i clicked the photos, had it open in the lightbox and just grabbed that link. Is that what I am doing wrong?
I think so.
Go to the image you want to use, click on "Share>Get link" below the image itself and then click on "Copy" in correspondence of the size of the image link from the list, I use X2 Large
Then go to your slideshow CSS and paste that code where you want your image to be, you have to replace the red part I highlighted in my sample below with the code you copied as I explained before
Ok I got it to work - but please go look at my page as I am incuring another problem. One of the photos in my slideshow is also the photo I have as the Theme's background photo. You see it appear sometimes between transitions which is no bueno. But everything I have tried to remove it also removes it as the background of teh Gallery section when you click that which I don't want. So my question is now, how do I get the background out of the homepage but keep it everywhere else?
Go to Customize Site>Homepage>Theme>Active theme.
Click on the wrench and Edit Theme will appear, now select Background; you should be able to remove the background image (if you have one set as background) from the Photo>Background photo section.
But it looks like you sorted it out already, I don't see any problem in your homepage....
Go to Customize Site>Homepage>Theme>Active theme.
Click on the wrench and Edit Theme will appear, now select Background; you should be able to remove the background image (if you have one set as background) from the Photo>Background photo section.
But it looks like you sorted it out already, I don't see any problem in your homepage....
Well it's been partially sorted out. I have already tried the method you noted however if I do that the background in the galleries and everywhere else other than the homepage ALSO disappears and I don't want that. I just want it gone from the background. Can I have two themes run on a website, like one theme for my homepage and one theme for the rest of the site? that way I can have no background for the home page but keep it for the rest? Any thoughts anybody?
This was the only thing preventing me from unveiling and you've now solved that!!! Works great! Not the simplest of solutions (would love to just be able to upload a photo to a gallery and have it pick) but it works!!!
Looking forward to SmugMug implementing this and not having to use this "hack" (that's not the right word). You made my day/night/week/month! I'm doing a little dance I'm so happy. Thank you!
I tried out the slideshow on a test page and it worked perfect. Aaron I love the way you have the vertical menu setup with the dark background on the left side. Can you shed some light on how you did that, thanks.
Can I have two themes run on a website, like one theme for my homepage and one theme for the rest of the site? that way I can have no background for the home page but keep it for the rest? Any thoughts anybody?
Someone else more experienced will answer this but, my opinion, is no, you can't have two different themes installed at the same time.
I tried out the slideshow on a test page and it worked perfect. Aaron I love the way you have the vertical menu setup with the dark background on the left side. Can you shed some light on how you did that, thanks.
Not sure but I think it probably depends on the template he is using.
I'll put it down again, hope to get a hint on this:
is anybody using more/less than the six images that come with the default code of this slideshow? If yes how did you amend the code?
Particularly I'd like to understand which parts of the code I should remove to have it running with only 4 images.
thanks
I'll put it down again, hope to get a hint on this:
is anybody using more/less than the six images that come with the default code of this slideshow? If yes how did you amend the code?
Particularly I'd like to understand which parts of the code I should remove to have it running with only 4 images.
thanks
Fabio
Sorted.
I now have 4 images running, these are the portions of code I removed from CSS
Does anybody know:
1 - how to make the slideshow clickable to send visitors to a given gallery/page?
2 - how to change the transition speed (fading) between images?
:help :help
I am using the css3 animations, however they aren't compatible in ie9 and prior. I'm trying to figure out a way to redirect to another page based on ie version or use the modernizr javascript but we can't even load it from an external site. So far having no luck, so I thought I would post it here and see if someone else might come up with something...
You must either be using Chrome, Firefox, or ie10 to view the transitions, otherwise it shows a black screen.
Here is the code, just create a page and use the css and html blocks
Hi Don
I used your code on my website and it's working just fine except for one thing:
when I scroll down, top and bottom sections (navbar and FB) goes up and out of sight, but the slideshow don't, so what happens is that the FB logo I have beneath the slideshow itself goes over the slideshow image.
Is there any way to fix this issue?
thanks
Not sure on that answer. I didn't think the scrollbars were there at first. It is doing it on mine as well. Let me look in to it and see if I can figure something out.
Comments
Venice PhotoBlog
Fabio" (I forgot to hit Reply for the quote)
Went to Customize, entire site, Active theme and click on the wrench. You will see the header color option there!
The margins are found at Customize, Entire Site, Layout and you will find margin settings.
One thing though; I don't understand what will happen to the space where Customization bar is now once the site will be unveiled.
Please bear if I might sound insistent but I'm stuck on this issue since more than a week already and I still don't see a solution :cry
p.s. using the same Theme you are using would maybe make things a bit easier to understand for myself, would you mind me doing that?
Venice PhotoBlog
I'm trying, as you may see from my posts, to sort out few issues about using the full width slideshow
I had a look at your site and noticed a couple of things that could work well for myself too:
- how did you get to have the header stitched to the top of the page? Mine is a stripe that leaves a certain amount of space between its upper border and the top border of the page
- and, of course, how did you get rid of "Photo Sharing by SmugMug" in footer?
thanks
Fabio
Venice PhotoBlog
Go here for tutorial to remove the Photo Sharing
http://www.dgrin.com/showthread.php?t=237115&highlight=photo+sharing+smugmug
Do you have Top Margin set to "0"? If you think you have CSS changing it to more than 0 then you need to find it and remove it as I believe the CSS is going to over-ride the menu Layout settings. and, yes, darkening the header background will make the top get cut-off. I am using the zoom slideshow, and it seems to be ok enough for my selected images 'cause the zoom is going to cut it off anyway.
Scroll down so the Customize area and color disappear to the top of your header color. That is what it will look like! That simple!
It took me over two months to make my site simple and how I wanted! Had to do what you are doing asking for help, waiting for bug fixes, looking at MANY posts in the different DGRIN SmugMug threads to see who had items I wanted and solutions. Some of the folks who used to respond with help have finally finished their sites and seem not to log into DGRIN anymore. So, ya might need more time than you would have thought.
Not sure what you are asking. I am using SmugMug Theme. If you switch themes you will have to add all the code you put in your current theme into the new theme. Then, if you make changes, they will not appear in your earlier theme so you would have to remember everything to put into that theme when you go back. Make sense? Meaning coding you put in one theme does not get auto added to other themes.
Keep hacking at it! I finally like my new site better than my legacy site. Like I said, it took over two months!
In fact, slideshow images exceed the lower part of homepage but still I can't scroll down.
And, needless to say, homepage is on top of my priorities...
Venice PhotoBlog
There are two portions of CSS code of the slideshow where it appears the "Top" item but they are already set to "0"
.cb-slideshow, .cb-slideshow:after { position: fixed; width: 100%; height: 100%; top: 0px; left: 0px; z-index: -99999; }.cb-slideshow li span { width: 100%; height: 100%; position: absolute; top: 0px; left: 0px; color: transparent; background-size: cover; background-position: 50% 50%; background-repeat: none; opacity: 0; z-index: 0; -webkit-backface-visibility: hidden; -webkit-animation: imageAnimation 36s linear infinite 0s; -moz-animation: imageAnimation 36s linear infinite 0s; -o-animation: imageAnimation 36s linear infinite 0s; -ms-animation: imageAnimation 36s linear infinite 0s; animation: imageAnimation 36s linear infinite 0s; }Venice PhotoBlog
Ah, ok. Then how about this...check out your file you are using for the header. Is there empty space there? Hmmm...maybe that is just typed in...hmmmm....how about the size of the Menu block. It is on the same line as your name and THAT might be creating the extra space at the top. My setup is different, so can't say what to look for.
The gallery I am pulling the images from is an unlisted gallery? Please help as I do like my background but i'd far prefer this slideshow option!
Thanks!
__________________________________
http://www.MakeItABradford.com
Which portions of the code should I remove and/or edit????
Venice PhotoBlog
What's your problem at the moment? What exactly is NOT working? What do you see and what you don't?
A link to your actual page would be the best thing, otherwise you can post a screenshot.
I'm also using images from an unlisted gallery so that shouldn't be a problem; one thing I can suggest, as I'm not a master on this, is to double check the CSS and HTML codes you pasted.
Do you have other Photo Content blocks active in homepage? Not sure, but if you do that might conflict with your Full Width slideshow.
Are all images in the slideshow exactly the same size? Check that too, I did use just one picture slightly different and the whole thing got stuck.
Many small details can derail this customized feature but (almost) everything can be fixed!
Venice PhotoBlog
It started playing the images that are in the sample (I guess the guy who created the show his images) that makes sense as the links in the CSS go to his stuff. When I went to replace them links to a gallery I have unlisted as "slideshow gallery" or something like that - it doesn't work. Not sure what I am doing wrong.
Should I try this again, leave it then come back here and post for you to see it?
__________________________________
http://www.MakeItABradford.com
I'm just speculating, but there might be mistakes in the link to your images.
Did you retrieve the links from the "Share>Get link" option in the unlisted gallery from where pictures are pulled in?
But please, don't keep saying "doesn't work", try to describe more in detail what's happening.
Venice PhotoBlog
No i clicked the photos, had it open in the lightbox and just grabbed that link. Is that what I am doing wrong?
__________________________________
http://www.MakeItABradford.com
Go to the image you want to use, click on "Share>Get link" below the image itself and then click on "Copy" in correspondence of the size of the image link from the list, I use X2 Large
Then go to your slideshow CSS and paste that code where you want your image to be, you have to replace the red part I highlighted in my sample below with the code you copied as I explained before
.cb-slideshow li:nth-child(1) span {
background-image: url(http://www.imaginevenice.com/photos/i-kvJw5tv/0/X3/i-kvJw5tv-X3.jpg)
}
You then have to do the same for all other 5 images
Venice PhotoBlog
p.s. there's still a lot to do so please bear with with me for the "very basic" content
Venice PhotoBlog
__________________________________
http://www.MakeItABradford.com
Click on the wrench and Edit Theme will appear, now select Background; you should be able to remove the background image (if you have one set as background) from the Photo>Background photo section.
But it looks like you sorted it out already, I don't see any problem in your homepage....
Venice PhotoBlog
Well it's been partially sorted out. I have already tried the method you noted however if I do that the background in the galleries and everywhere else other than the homepage ALSO disappears and I don't want that. I just want it gone from the background. Can I have two themes run on a website, like one theme for my homepage and one theme for the rest of the site? that way I can have no background for the home page but keep it for the rest? Any thoughts anybody?
__________________________________
http://www.MakeItABradford.com
I tried out the slideshow on a test page and it worked perfect. Aaron I love the way you have the vertical menu setup with the dark background on the left side. Can you shed some light on how you did that, thanks.
Venice PhotoBlog
Not sure but I think it probably depends on the template he is using.
Venice PhotoBlog
is anybody using more/less than the six images that come with the default code of this slideshow? If yes how did you amend the code?
Particularly I'd like to understand which parts of the code I should remove to have it running with only 4 images.
thanks
Fabio
Venice PhotoBlog
Thanks, anyone know what theme it is, kinda looks like Arrow...?
Sorted.
I now have 4 images running, these are the portions of code I removed from CSS
.cb-slideshow li:nth-child(5) span { background-image: url(http://fabiothian.smugmug.com/photos/i-tNnft8S/0/X3/i-tNnft8S-X3.jpg); -webkit-animation-delay: 24s; -moz-animation-delay: 24s; -o-animation-delay: 24s; -ms-animation-delay: 24s; animation-delay: 24s; } .cb-slideshow li:nth-child(6) span { background-image: url(http://fabiothian.smugmug.com/photos/i-hStbCRT/0/X3/i-hStbCRT-X3.jpg); -webkit-animation-delay: 30s; -moz-animation-delay: 30s; -o-animation-delay: 30s; -ms-animation-delay: 30s; animation-delay: 30s; }And this is the HTML amended to display 4 images<ul class="cb-slideshow"> <li> <span>Image 01</span> </li> <li> <span>Image 02</span> </li> <li> <span>Image 03</span> </li> <li> <span>Image 04</span> </li> </ul>Venice PhotoBlog
1 - how to make the slideshow clickable to send visitors to a given gallery/page?
2 - how to change the transition speed (fading) between images?
:help :help
Venice PhotoBlog
I used your code on my website and it's working just fine except for one thing:
when I scroll down, top and bottom sections (navbar and FB) goes up and out of sight, but the slideshow don't, so what happens is that the FB logo I have beneath the slideshow itself goes over the slideshow image.
Is there any way to fix this issue?
thanks
Venice PhotoBlog