IE7 issues displaying slideshows created on my blog

CS2009 · February 26, 2009

It has been brought to my attention that slideshows I have created for my blog at blogspot, are not displaying properly in IE7. Instead of the full slideshow being displayed, it shows-up in IE7 as halved. Firefox, so far does not present any issue. I am wondering if anyone here could assist with correcting this issue.

The address for my blog is: http://chicsavage.blogspot.com/

Any assistance would be most welcome.

Thank you.

jfriend · February 26, 2009

Can you post a link directly to a page that has a Smugmug slideshow in your blog that isn't working in IE7 or describe exactly where it is? I don't know where they are. Can't help without seeing them.

denisegoldberg · February 26, 2009

I just did view source on your blog. The slideshows that I see on the first page of your blog are referring to picassa, not to smugmug, like this - src="http://picasaweb.google.com/s/c/bin/slideshow.swf".

Can you supply a direct link to a post containing a smugmug slideshow? Preferably a link that shows just one slideshow.

--- Denise

CS2009 · February 26, 2009

denisegoldberg wrote:

I just did view source on your blog. The slideshows that I see on the first page of your blog are referring to picassa, not to smugmug, like this - src="http://picasaweb.google.com/s/c/bin/slideshow.swf".

Can you supply a direct link to a post containing a smugmug slideshow? Preferably a link that shows just one slideshow.

--- Denise

Hi Denise,

Thank you for the response. Unfortunately, I have no idea what "smugmug" is. I e-mailed a member of this forum and he suggested I post my issue here, as he didn't have IE7. So now I am even more confused. Did the blog address I posted in my original post not work?

Were you able to view the slideshows or not (which would be an even worse problem than the one I originally wrote about) because when I view my blog in IE7 all of the slideshows are halved.

Please, advise.

Thank you.

CS2009

CS2009 · February 26, 2009

jfriend wrote:

Can you post a link directly to a page that has a Smugmug slideshow in your blog that isn't working in IE7 or describe exactly where it is? I don't know where they are. Can't help without seeing them.

Hi John,

Thank you for the response. Please, kindly see below, my response to Denise, as it addresses the same issue to you about "smugmug".

Best,

CS2009

denisegoldberg · February 26, 2009

CS2009 wrote:

Hi Denise,

Thank you for the response. Unfortunately, I have no idea what "smugmug" is. I e-mailed a member of this forum and he suggested I post my issue here, as he didn't have IE7. So now I am even more confused. Did the blog address I posted in my original post not work?

Were you able to view the slideshows or not (which would be an even worse problem than the one I originally wrote about) because when I view my blog in IE7 all of the slideshows are halved.

Please, advise.

Thank you.

CS2009

This forum is to help people who have photo galleries hosted at www.smugmug.com.

Your original post was in the Dgrin Forum Support forum, which is to ask for help with using the Dgrin forum.

I moved your post to SmugMug Support, thinking that you were asking about embedding a smugmug slideshow in your blog.

Unfortunately, I can't offer any help with accessing slideshows hosted at Picassa on your blog - both owned by Google. The only thing I can suggest is that you change your blog format to use a stretchy format. I believe the problem that you are having is that you are trying to show a slideshow in a space that is much too small for that show. I can't explain why Firefox shows the full slideshow even though it overlaps your blog sidebar and IE7 doesn't. I'd suggest you ask on a blogger forum, maybe starting at http://groups.google.com/group/blogger-help?pli=1.

If you want to see how a blog hosted on blogspot that uses a stretchy format looks, look at mine (link below).

And yes, I can see your slideshows on your blog. They look to be the right height, but they are only showing half of the width.

--- Denise

CS2009 · February 26, 2009

denisegoldberg wrote:

This forum is to help people who have photo galleries hosted at www.smugmug.com.

Your original post was in the Dgrin Forum Support forum, which is to ask for help with using the Dgrin forum.

I moved your post to SmugMug Support, thinking that you were asking about embedding a smugmug slideshow in your blog.

Unfortunately, I can't offer any help with accessing slideshows hosted at Picassa on your blog - both owned by Google. The only thing I can suggest is that you change your blog format to use a stretchy format. I believe the problem that you are having is that you are trying to show a slideshow in a space that is much too small for that show. I can't explain why Firefox shows the full slideshow even though it overlaps your blog sidebar and IE7 doesn't. I'd suggest you ask on a blogger forum, maybe starting at http://groups.google.com/group/blogger-help?pli=1.

If you want to see how a blog hosted on blogspot that uses a stretchy format looks, look at mine (link below).

And yes, I can see your slideshows on your blog. They look to be the right height, but they are only showing half of the width.

--- Denise

Hi Denise,

Thank you, again, for your response and for taking the time to view my blog in both Firefox and IE7. MUCH appreciated!
I like the look of your blog at blogspot, VERY nice!
Prior to posting in the digitalgrin forum, I have indeed, tried posting my issue to the blogspot help forum, but as of yet, have had no response whatsoever.

I am not, as you may have already surmised all that tech savvy and remain in the dark about the "stretchy" format. Even viewing your blogspot space, I am unclear as to what it means, could you elaborate? Does Blogspot offer such a format as a setting, if so, might you direct me to the proper place in blogspot?

Could my issue be as simple as reducing the size of the slideshows, which I would loathe doing because then the images would be smaller and not as eay to view.

Any additional assistance you may be able to provide, would be most welcome.

Best,

CS2009

denisegoldberg · February 26, 2009

CS2009 wrote:

Thank you, again, for your response and for taking the time to view my blog in both Firefox and IE7. MUCH appreciated!
I like the look of your blog at blogspot, VERY nice!
Prior to posting in the digitalgrin forum, I have indeed, tried posting my issue to the blogspot help forum, but as of yet, have had no response whatsoever.

I am not, as you may have already surmised all that tech savvy and remain in the dark about the "stretchy" format. Even viewing your blogspot space, I am unclear as to what it means, could you elaborate? Does Blogspot offer such a format as a setting, if so, might you direct me to the proper place in blogspot?

Could my issue be as simple as reducing the size of the slideshows, which I would loathe doing because then the images would be smaller and not as eay to view.

You're very welcome.

I agree that you shouldn't reduce the size of your slideshows.

There are a few blogger templates that they have defined as "stretchy". You could change to one of those templates, or you can alter your blog to stretch side-to-side. If you haven't made any changes to your blogger template, then it might be as easy as changing templates. To do that, click the Layout tab, then Pick New Template. Look for the template called Minima Stretch. That's a stretchy version of the template you are using now. That template stretches the full width of the browser. If you want some empty space to the sides (and I personally think that makes your blog easier to read), keep reading below.

I posted a thread here on how to change a blogger blog to match a customized smugmug gallery. You don't need most of the information in that thread since you're not trying to match an existing gallery. But I did make one post about how to change an existing blog to stretch to the sides of the browser window. Take a look at this post for an explanation of how I changed my blog template to stretch (as opposed to switching to one of blogger's stretchy templates) and see if it helps you - http://www.dgrin.com/showpost.php?p=943120&postcount=217.

You are using the same blogger template that I used as a starting point.

Given that you say you're not that tech savvy, let me try to give you a starting point. When you're logged on to blogger, click the Layout tab. Within that, click Edit HTML. Look for the code I have pasted below (I copied it from your blog, so you should find an exact match).

#outer-wrapper {
[B][SIZE=3]width: 660px;[/SIZE][/B]
margin:0 auto;
padding:10px;
text-align:left;
font: normal normal 100% Georgia, Serif;
}
#main-wrapper {
[B][SIZE=3]width: 410px;[/SIZE][/B]
float: left;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden;     /* fix for long non-text content breaking IE sidebar float */
}
#sidebar-wrapper {
[B][SIZE=3]width: 220px;[/SIZE][/B]
float: right;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden;      /* fix for long non-text content breaking IE sidebar float */
}

To change to a stretchy format, you need to change the width entries in all three entries (where the entry starts with # and is followed by a name) to percentages. Here's an example of the code with percentages:

#outer-wrapper {
[B][SIZE=3]width: 80%;[/SIZE][/B]
margin:0 auto;
padding:10px;
text-align:left;
font: normal normal 100% Georgia, Serif;
}
#main-wrapper {
[B][SIZE=3]width: 70%;[/SIZE][/B]
float: left;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden;     /* fix for long non-text content breaking IE sidebar float */
}
#sidebar-wrapper {
[B][SIZE=3]width: 25%;[/SIZE][/B]
float: right;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden;      /* fix for long non-text content breaking IE sidebar float */
}

You will need to experiment with the widths to get the look that you want. Keep in mind that most of the photos you have posted are in portrait mode, so you will end up with a large amount of white space around them. Of course that's not a problem, I just didn't want you to be surprised.

Let me know how this works out for you.

--- Denise

CS2009 · February 26, 2009

denisegoldberg wrote:
You're very welcome.

I agree that you shouldn't reduce the size of your slideshows.

There are a few blogger templates that they have defined as "stretchy". You could change to one of those templates, or you can alter your blog to stretch side-to-side. If you haven't made any changes to your blogger template, then it might be as easy as changing templates. To do that, click the Layout tab, then Pick New Template. Look for the template called Minima Stretch. That's a stretchy version of the template you are using now. That template stretches the full width of the browser. If you want some empty space to the sides (and I personally think that makes your blog easier to read), keep reading below.

I posted a thread here on how to change a blogger blog to match a customized smugmug gallery. You don't need most of the information in that thread since you're not trying to match an existing gallery. But I did make one post about how to change an existing blog to stretch to the sides of the browser window. Take a look at this post for an explanation of how I changed my blog template to stretch (as opposed to switching to one of blogger's stretchy templates) and see if it helps you - http://www.dgrin.com/showpost.php?p=943120&postcount=217.

You are using the same blogger template that I used as a starting point.

Given that you say you're not that tech savvy, let me try to give you a starting point. When you're logged on to blogger, click the Layout tab. Within that, click Edit HTML. Look for the code I have pasted below (I copied it from your blog, so you should find an exact match).
#outer-wrapper {
[B][SIZE=3]width: 660px;[/SIZE][/B]
margin:0 auto;
padding:10px;
text-align:left;
font: normal normal 100% Georgia, Serif;
}
#main-wrapper {
[B][SIZE=3]width: 410px;[/SIZE][/B]
float: left;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden;     /* fix for long non-text content breaking IE sidebar float */
}
#sidebar-wrapper {
[B][SIZE=3]width: 220px;[/SIZE][/B]
float: right;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden;      /* fix for long non-text content breaking IE sidebar float */
}
To change to a stretchy format, you need to change the width entries in all three entries (where the entry starts with # and is followed by a name) to percentages. Here's an example of the code with percentages:
#outer-wrapper {
[B][SIZE=3]width: 80%;[/SIZE][/B]
margin:0 auto;
padding:10px;
text-align:left;
font: normal normal 100% Georgia, Serif;
}
#main-wrapper {
[B][SIZE=3]width: 70%;[/SIZE][/B]
float: left;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden;     /* fix for long non-text content breaking IE sidebar float */
}
#sidebar-wrapper {
[B][SIZE=3]width: 25%;[/SIZE][/B]
float: right;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden;      /* fix for long non-text content breaking IE sidebar float */
}
You will need to experiment with the widths to get the look that you want. Keep in mind that most of the photos you have posted are in portrait mode, so you will end up with a large amount of white space around them. Of course that's not a problem, I just didn't want you to be surprised.

Let me know how this works out for you.

--- Denise

Hi Denise,

Thank you, so VERY much for your effort on my behalf.

I have experimented with the code you provided, and while the slideshows display almost three quarters, they are still not as "perfect" as they appear in Firefox.

With you as my guide, I was able to move 98% to the left, which overall isn't too bad in Firefox, but still in IE7 it's simply not identical.

Would you have a look at my blog once more in both Firefox and IE7 and provide me your honest opinion of the blog with the changes?

Since you are a blogspot member, do you think we might exchange e-mail addresses, for more direct contact?

Best,

CS2009

IE7 issues displaying slideshows created on my blog

Comments