View Full Version : the usual header problem...
planeta
Mar-31-2008, 11:17 PM
Hi,
As many like me before, I have problems with setting up my header.
I'm new to code, so I copied / pasted everything as shown in the tutorial
#my_banner {
width: 750px;
height: 150px;
margin: 0 auto;
background: url(http://planeta.smugmug.com/gallery/4630462_jCC49#273246341_uBuXb-A-LB) no-repeat;
}
Still, nothing shows up when I update and submit http://www.dgrin.com/images/icons/sad.gif
also, i noticed that my location for the jpeg is in /gallery/, while in the tutorial it is in /photos/. Anything wrong there?
my homepage: http://planeta.smugmug.com (http://planeta.smugmug.com/gallery/4630462_jCC49#273246341_uBuXb-A-LB)
richW
Apr-01-2008, 02:49 AM
Hi,
As many like me before, I have problems with setting up my header.
I'm new to code, so I copied / pasted everything as shown in the tutorial
#my_banner {
width: 750px;
height: 150px;
margin: 0 auto;
background: url(http://planeta.smugmug.com/gallery/4630462_jCC49#273246341_uBuXb-A-LB) no-repeat;
}
Still, nothing shows up when I update and submit http://www.dgrin.com/images/icons/sad.gif
also, i noticed that my location for the jpeg is in /gallery/, while in the tutorial it is in /photos/. Anything wrong there?
my homepage: http://planeta.smugmug.com (http://planeta.smugmug.com/gallery/4630462_jCC49#273246341_uBuXb-A-LB)
I changed the url for the image to : http://planeta.smugmug.com/photos/273246341_uBuXb-XL.jpg
And added the banner division in the header section <div id="my_banner"> </div> :thumb
planeta
Apr-01-2008, 07:28 PM
I changed the url for the image to : http://planeta.smugmug.com/photos/273246341_uBuXb-XL.jpg
And added the banner division in the header section <div id="my_banner"> </div> :thumb
Thanx a bunch! http://www.dgrin.com/images/icons/Laughing.gif
I really appreciate you guys helping us out with these beginner issues!
S-Man
Apr-03-2008, 09:17 PM
I'm having the same problem. I even tried doing what you suggested here. And Nothing. It's very frustrating to say the least.:splat
I haven't read all the tutorials, but I'm very overwhelmed considering what I want to do with my site. I don't even know where to begin. I mean, if I can't figure out a simple tutorial code like this, how am I going to figure out the more complex stuff? Grrrrr...
Allen
Apr-03-2008, 09:31 PM
I'm having the same problem. I even tried doing what you suggested here. And Nothing. It's very frustrating to say the least.:splat
I haven't read all the tutorials, but I'm very overwhelmed considering what I want to do with my site. I don't even know where to begin. I mean, if I can't figure out a simple tutorial code like this, how am I going to figure out the more complex stuff? Grrrrr...
Have you made a banner and uploaded it yet?
Here's some generic code. It creates a clickable banner on your pages.
Plug in your numbers and see if this works.
The header code (not head tag box) Clickable banner.
<div id="my_banner">
<a href="http://nickname.smugmug.com">
<img src="/img/spacer.gif" width="750" height="100" border="0" alt="">
</a></div>
Supporting CSS to define image and format banner using a transparent png
#my_banner {
width: 750px;
height: 100px;
margin: 0 auto;
background: url(/photos/xxxxxxxx_xxxxx-O.png) no-repeat;
_background: none;
_filter:progid:DXImageTransform.Microsoft.AlphaIma geLoader (enabled=true,
sizingmethod=image, src='/photos/xxxxxxxx_xxxxx-O.png');
}
Make the spacer gif in the header html the same size as your banner, it's the
clickable area. Be sure to enter in the actual size of the banner photo.
If you're using a jpg instead of png replace above CSS with this.
#my_banner {
width: 750px;
height: 100px;
margin: 0 auto;
background: url(/photos/xxxxxxxx_xxxxx-O.jpg) no-repeat;
}
==== Here's another version generic code for a non-clickable banner. ====
The header code Non-Clickable banner using png.
<div id="my_banner"></div>
Supporting CSS to define image and format banner
#my_banner {
width: 750px;
height: 100px;
margin: 0 auto;
background: url(/photos/xxxxxxxx_xxxxx-O.png) no-repeat;
_background: none;
_filter:progid:DXImageTransform.Microsoft.AlphaIma geLoader (enabled=true,
sizingmethod=image, src='/photos/xxxxxxxx_xxxxx-O.png');
}
===== Note: For a transparent banner create a png and use above code =====
Here's some generic code if you're using a jpg.
The header code Non-Clickable banner using jpg.
<div id="my_banner"></div>
Supporting CSS to define image and format banner
#my_banner {
width: 750px;
height: 100px;
margin: 0 auto;
background: url(/photos/xxxxxxxx_xxxxx-O.jpg) no-repeat;
}
S-Man
Apr-08-2008, 12:00 AM
I haven't tried all of that (thanks for posting) but this is what I have in my css box under the "customize" tab.
#bioBox .photo {
display: none;
}
#my_banner {
width: 525px;
height: 300px;
margin: 0 auto;
background:url "http://www.slickpix.net/photos/273546830_ayLmz-L.jpg" width="750) no-repeat;
}
A slideshow plays of one particular gallery (I wish I could center the slideshow on the page) but there is no "banner" to be seen. The tutorials seem to be fruitless when I try to execute them as written.
Is the problem that I'm on a trial account?
I didn't know customization would be so difficult. Maybe it's not and I'm just HTML illiterate. I don't know.
Could somone tell me what I might be doing wrong here?
I eventually want to have a professional looking page that has info text, contact info etc. but it seems very daunting at the moment even to have a simple page.
Allen
Apr-08-2008, 08:18 AM
I haven't tried all of that (thanks for posting) but this is what I have in my css box under the "customize" tab.
#bioBox .photo {
display: none;
}
#my_banner {
width: 525px;
height: 300px;
margin: 0 auto;
background:url "http://www.slickpix.net/photos/273546830_ayLmz-L.jpg" width="750) no-repeat;
}
A slideshow plays of one particular gallery (I wish I could center the slideshow on the page) but there is no "banner" to be seen. The tutorials seem to be fruitless when I try to execute them as written.
Is the problem that I'm on a trial account?
I didn't know customization would be so difficult. Maybe it's not and I'm just HTML illiterate. I don't know.
Could somone tell me what I might be doing wrong here?
I eventually want to have a professional looking page that has info text, contact info etc. but it seems very daunting at the moment even to have a simple page.
Chnage this one line
background:url "http://www.slickpix.net/photos/273546830_ayLmz-L.jpg" width="750) no-repeat;
to this
background: url(/photos/273546830_ayLmz-L.jpg) no-repeat;
Which slideshow are you referring to? Style or fullscreen? If you have a
gallery that the banner is not showing you might have "Smugmug" checked
instead of "custom" for appearance.
S-Man
Apr-08-2008, 08:39 AM
Thanks Allen, But that still didn't do anything. It's like there's no effect on my page no matter what I do.
The only thing I changed successfully is the slideshow of the Brandon & Janet gallery. A 'help' page here on Dgrin helped with that. And I'm pretty sure its a 'style' slideshow, as it's not full screen. It's in my 'bio' box which says:
<html>
********>
var ssConfig = {
AlbumID: '4611698',
newWindow: 'false',
transparent: 'true',
splash: 'http://www.smugmug.com/img/ria/ShizamSlides/smugmug_black.png',
showLogo: 'false',
clickUrl: 'http://www.slickpix.net/gallery/4611698_3Xzus#272046969',
showThumbs: 'false',
showButtons: 'false',
crossFadeSpeed: '300'
};
SM.flash.insertSlideshow(600, 600, ssConfig, 'transparent');
</********
</html>
EDIT: Holy crap...I added <div id="my_banner"> </div> to my 'header' section and *presto!* I have a sweet banner. Nice. Thanks for the help. After you figure it out it's like, "That wasn't too hard, was it?" hah.
vBulletin® v3.8.5, Copyright ©2000-2012, Jelsoft Enterprises Ltd.