PDA

View Full Version : How to get a Banner #2 on Homepage #2??


jeffu
Feb-09-2007, 09:29 AM
I hope this makes sense...I've followed the instructions on building a slideshow on my homepage, having a seperate gallery page, and having a customer banner.

All works fine except I can't seem to get a different banner on my galleries page - it uses the same one from the homepage, because it's sort of a copy of the homepage.

What category is the 2nd homepage (galleries)? I've tried just about everything I can think of.

I'd one banner on my home page, a different one on my "galleries" page, and then maybe others on the rest.

Sorry - I've searched and searched and I'm just not finding it after days.

My page, if you want to look is jeffulrich.smugmug.com

Thanks!

Barb
Feb-09-2007, 10:05 AM
I hope this makes sense...I've followed the instructions on building a slideshow on my homepage, having a seperate gallery page, and having a customer banner.

All works fine except I can't seem to get a different banner on my galleries page - it uses the same one from the homepage, because it's sort of a copy of the homepage.

What category is the 2nd homepage (galleries)? I've tried just about everything I can think of.

I'd one banner on my home page, a different one on my "galleries" page, and then maybe others on the rest.

Sorry - I've searched and searched and I'm just not finding it after days.

My page, if you want to look is jeffulrich.smugmug.com

Thanks!
Hi :)

Welcome to DGrin :wave

If you have not yet seen our tutorial on banners, you might want to check it out:

http://dgrin.smugmug.com/gallery/1932865

There are instructions in there for different banners on different pages.

If you run into problems after looking at the tutorial, be sure and holler back here :)

jeffu
Feb-09-2007, 10:17 AM
Hi :)

Welcome to DGrin :wave

If you have not yet seen our tutorial on banners, you might want to check it out:

http://dgrin.smugmug.com/gallery/1932865

There are instructions in there for different banners on different pages.

If you run into problems after looking at the tutorial, be sure and holler back here :)

Thanks - I've looked at that 100 times - I wouldn't be this far along if I hadn't already been there. I can get different banners on different pages - it's just when you break out your homepage to have a slideshow and a sort of "copy" of your homepage to have galleries, they both have the same banner. What do I specify for the "galleries" page to have a different banner?

Barb
Feb-09-2007, 10:24 AM
Thanks - I've looked at that 100 times - I wouldn't be this far along if I hadn't already been there. I can get different banners on different pages - it's just when you break out your homepage to have a slideshow and a sort of "copy" of your homepage to have galleries, they both have the same banner. What do I specify for the "galleries" page to have a different banner?

Hi :)

The "second" home page with galleries uses:

.galleries

As the identifier.

So,

.galleries #my_banner {
width: 756px;
height: 296px;
margin: 0 auto;
margin-top: 5px;
background: url(http://jeffulrich.smugmug.com/photos/128159694-O.jpg) no-repeat;
}

Of course, replace the banner link with the correct one.

jeffu
Feb-09-2007, 11:35 AM
Hi :)

The "second" home page with galleries uses:

.galleries

As the identifier.

So,

.galleries #my_banner {
width: 756px;
height: 296px;
margin: 0 auto;
margin-top: 5px;
background: url(http://jeffulrich.smugmug.com/photos/128159694-O.jpg) no-repeat;
}

Of course, replace the banner link with the correct one.

Thanks again Barb - I've tried that and have it entered right now - still no go - it won't change the banner on my galleries page - it's still the same banner as the Homepage. Any other ideas?? I'm really at a loss.

Barb
Feb-09-2007, 01:46 PM
Thanks again Barb - I've tried that and have it entered right now - still no go - it won't change the banner on my galleries page - it's still the same banner as the Homepage. Any other ideas?? I'm really at a loss.

Give me a bit, I'll check for you :)

Barb
Feb-09-2007, 02:05 PM
Give me a bit, I'll check for you :)

Okay, replace what you have for all of your "my_banners" with this:

#my_banner {
width: 750px;
height: 90px;
margin: 0 auto;
margin-top: 5px;
background: url(http://jeffulrich.smugmug.com/photos/128333075-O.jpg) no-repeat;
}

.galleries #my_banner {
width: 756px;
height: 296px;
margin: 0 auto;
margin-top: 5px;
background: url(http://jeffulrich.smugmug.com/photos/128159694-O.jpg) no-repeat;
}

.gallery_2450629 #my_banner {
width: 756px;
height: 296px;
margin: 0 auto;
margin-top: 5px;
background: url(http://jeffulrich.smugmug.com/photos/128159694-O.jpg) no-repeat;
}


What that is going to give you is the smaller banner on your home page each gallery page; the larger banner on your main galleries page, and the larger banner on your guestbook page. Is that what you are looking to do?

jeffu
Feb-12-2007, 03:58 AM
Okay, replace what you have for all of your "my_banners" with this:

#my_banner {
width: 750px;
height: 90px;
margin: 0 auto;
margin-top: 5px;
background: url(http://jeffulrich.smugmug.com/photos/128333075-O.jpg) no-repeat;
}

.galleries #my_banner {
width: 756px;
height: 296px;
margin: 0 auto;
margin-top: 5px;
background: url(http://jeffulrich.smugmug.com/photos/128159694-O.jpg) no-repeat;
}

.gallery_2450629 #my_banner {
width: 756px;
height: 296px;
margin: 0 auto;
margin-top: 5px;
background: url(http://jeffulrich.smugmug.com/photos/128159694-O.jpg) no-repeat;
}


What that is going to give you is the smaller banner on your home page each gallery page; the larger banner on your main galleries page, and the larger banner on your guestbook page. Is that what you are looking to do?

Thanks Barb - that worked perfect! Sorry I didn't reply sooner, I was out of town all weekend. Now I have full control over what banner goes on what page.

Thanks again!

Mourdyn
Dec-07-2010, 08:13 PM
Hello, I am having the exact same problem stated above. I've been through all the tutorials but still can't seem to get my second banner on the rest of my pages. Please help!

jfriend
Dec-07-2010, 08:37 PM
Hello, I am having the exact same problem stated above. I've been through all the tutorials but still can't seem to get my second banner on the rest of my pages. Please help!Those that could help would need a link to your site. It would be best to put the link in your dgrin signature so it's automatically attached to every post you make at dgrin.

Mourdyn
Dec-07-2010, 09:40 PM
Oh thank you!:D I will do this shortly. here is my link

http://londonmourdynphotoimagery.smugmug.com/

Also, I posted a question in the "header' category explaining my situation and what I would like to do. I will be back in a moment to repost this here.

Thank you

Mourdyn
Dec-07-2010, 09:42 PM
:thumbHerro!! I'm a newbie, am currently trying to build my site and seem to be lost on a couple things.

1. I'm having a problem finding the correct code to add separate banners to separate gallery pages that link to my navbar. I currently have this http://londonmourdynphotoimagery.smugmug.com/ banner on my home page and it is also the banner for the rest of my pages. What I would like to do is add three separate banners to individual galleries can I do this?

2. I would also like to create an "enter" page which has just a jpeg image and a one click link to a separate home page where my navbar will be visable and then also have seperate gallery pages etc. but I can't figure out where to find the tutorials on this specifically.

I've already read all the tutorials and they were very helpful however I am stuck.. can someone please help ??

Thank you, kindly.

jfriend
Dec-07-2010, 09:44 PM
Oh thank you!:D I will do this shortly. here is my link

http://londonmourdynphotoimagery.smugmug.com/

Also, I posted a question in the "header' category explaining my situation and what I would like to do. I will be back in a moment to repost this here.

Thank youFirst, remove this part in red from your CSS as it does not belong and is causing an error:


<div>#my_banner {
width: 1022px;
height: 445px;
margin: 0 auto;
background: url(http://londonmourdynphotoimagery.smugmug.com/Other/Front-page-banner/Homepage-banner/1118855987_fvknX-O.jpg) no-repeat;}

Then, please explain which banner you want to appear on which pages and why you have both a custom CSS banner and an Easy Customizer banner? I would think you only want one or the other, not both.

Mourdyn
Dec-07-2010, 09:50 PM
First, remove this part in red from your CSS as it does not belong and is causing an error:


<div>#my_banner {
width: 1022px;
height: 445px;
margin: 0 auto;
background: url(http://londonmourdynphotoimagery.smugmug.com/Other/Front-page-banner/Homepage-banner/1118855987_fvknX-O.jpg) no-repeat;}Then, please explain which banner you want to appear on which pages and why you have both a custom CSS banner and an Easy Customizer banner? I would think you only want one or the other, not both.

Ok Done and thank you very much for finding my error. :clap

The banner which is currently set is the one I prefer on my homepage and here is the second banner, which i would like on my "Galleries" page or "my photography" page from my navbar. I also plan on making a third which I will place in the rest of my galleries. http://londonmourdynphotoimagery.smugmug.com/photos/1096182349_ocTL8-L.jpg

jfriend
Dec-07-2010, 09:58 PM
Ok Done and thank you very much for finding my error. :clap

The banner which is currently set is the one I prefer on my homepage and here is the second banner, which i would like on my "Galleries" page or "my photography" page from my navbar. I also plan on making a third which I will place in the rest of my galleries. http://londonmourdynphotoimagery.smugmug.com/photos/1096182349_ocTL8-L.jpgIn your CSS, change this part:

.galleries #my_banner
width: 1022px;
height: 445px;
margin: 0 auto;{
background: url(http://www.smugmug.com/photos/1096182349_ocTL8-X3-O.jpg) no-repeat;
http://londonmourdynphotoimagery.smugmug.com/photos/1096182349_ocTL8-O.jpg

}

to this:

.galleries #my_banner {
width: 533px;
height: 143px;
margin: 0 auto 20px auto;
background: url(http://www.smugmug.com/photos/1096182349_ocTL8-X3-O.jpg) no-repeat;
}

Mourdyn
Dec-07-2010, 10:15 PM
In your CSS, change this part:

.galleries #my_banner
width: 1022px;
height: 445px;
margin: 0 auto;{
background: url(http://www.smugmug.com/photos/1096182349_ocTL8-X3-O.jpg) no-repeat;
http://londonmourdynphotoimagery.smugmug.com/photos/1096182349_ocTL8-O.jpg

}to this:

.galleries #my_banner {
width: 533px;
height: 143px;
margin: 0 auto 20px auto;
background: url(http://www.smugmug.com/photos/1096182349_ocTL8-X3-O.jpg) no-repeat;
}


Thank you very much, you are a great help!! I surely appreciate it!

May I ask what the "20px auto" is so in the future I can understand? heh.. Also, I intend on making a third banner what would this code look like ? omitting the width, height and address of gallery of course? :scratch

Also, I'm considering creating an entry page with a link to my homepage and navbar do you have any idea if this is possible?

jfriend
Dec-07-2010, 10:22 PM
Thank you very much, you are a great help!! I surely appreciate it!

May I ask what the "20px auto" is so in the future I can understand? heh.. Also, I intend on making a third banner what would this code look like ? omitting the width, height and address of gallery of course? :scratch

Also, I'm considering creating an entry page with a link to my homepage and navbar do you have any idea if this is possible?

There are four margins (top, right, bottom, left) for any object. When you only specify two values for the margin like:

margin: 0 auto;

that means the two values are repeated to fill in the other two spots:

margin: 0 auto;

is internally expanded to:

margin: 0 auto 0 auto;

in order to fill out all four values for top, right, bottom, left.

Now, when I put in your second banner, it looked smushed up against your navbar, so I decided to put a little bottom margin on your 2nd banner. To isolate just the bottom margin, while still specifying the others, I needed to expand out the shortcut 0 auto to include all four values so I could fill in the one for the bottom with some extra spacing.

That's how I ended up with:

margin: 0 auto 20px auto.

That is:

top margin = 0
right margin = auto
bottom margin = 20px
left margin = auto

The auto values are used to center the banner left/right on the page.

The third banner CSS would look similar to the 2nd banner. You have to change the height and width to match the new image. You have to change the ".galleries" CSS identifier to make the new banner appear on match the desired page or pages. You have to change the URL of the image to what you want.

I don't really know what you mean by an entry page.

Mourdyn
Dec-07-2010, 10:38 PM
I don't really know what you mean by an entry page.

WOW, thank you. That's a lot of information and exactly what I was looking for. :D

As far as "entry page, I'll give you two examples: http://www.deviantmuse.com (http://www.deviantmuse.com/) and http://www.emilieautumn.com/
Do you know of any way?

jfriend
Dec-07-2010, 10:45 PM
WOW, thank you. That's a lot of information and exactly what I was looking for. :D

As far as "entry page, I'll give you two examples: http://www.deviantmuse.com (http://www.deviantmuse.com/) and http://www.emilieautumn.com/
Do you know of any way?It can be done. It's not easy. You'd have to move your slideshow to another copy of the homepage (an extension of the galleries page hack using the multi-homepage script) and then you'd put a single clickable image on your actual homepage and the click from that would go to your galleries page and you'd hide your banner and navbar on the entry page.

But, I'd ask why? Why make an extra click for your visitors just to get to the meat of your site? Are you really showing them something important with that entry page?

Mourdyn
Dec-07-2010, 10:56 PM
It can be done. It's not easy. You'd have to move your slideshow to another copy of the homepage (an extension of the galleries page hack using the multi-homepage script) and then you'd put a single clickable image on your actual homepage and the click from that would go to your galleries page and you'd hide your banner and navbar on the entry page.

But, I'd ask why? Why make an extra click for your visitors just to get to the meat of your site? Are you really showing them something important with that entry page?

Well, it's like this jfriend... I want to create something unique and wonderful - An interesting site that has many artistic facets that will make the audience BEEM with excitement. Catch my drift? lol I enjoy that extra click and have great plans for it. :deal

At the end of the day, I will be happy.... so, I'm going to have to look up this 'ol multi-homepage script and get started. Where might I find it quickly? (No matter how confusing it may be, I'm sure I will get there. With your help... lol. That is if you are willing ... I may get stuck. *chuckles*)

jfriend
Dec-07-2010, 10:59 PM
Well, it's like this jfriend... I want to create something unique and wonderful - An interesting site that has many artistic facets that will make the audience BEEM with excitement. Catch my drift? lol I enjoy that extra click and have great plans for it. :deal

At the end of the day, I will be happy.... so, I'm going to have to look up this 'ol multi-homepage script and get started. Where might I find it quickly? (No matter how confusing it may be, I'm sure I will get there. With your help... lol. That is if you are willing ... I may get stuck. *chuckles*)Multi-homepage is #31 here (http://www.dgrin.com/showthread.php?t=135068).

Mourdyn
Dec-08-2010, 01:44 AM
hello again, can someone help me with some navbar code, purdy please? I'd like to create two separate unique navbars. I've added the multi-homepage hack to my site and what I'd like to do if it is possible is to make my current banner actually clickable to my second homepage which will have a banner, a slideshow and a seperate navbar, for now. The only way I figured I could do this was by adding hyperlink image code to my navbar container code which will link a photo (or my current front page banner) to my second homepage.

I see from above that there is a way to create a second navbar correct? So now all I need to know is how to name each navbar within the <div> tags that I create in the custom header, are following me? Can someone point me in the right direction?

Many thank yous

Allen
Dec-08-2010, 05:57 AM
hello again, can someone help me with some navbar code, purdy please? I'd like to create two separate unique navbars. I've added the multi-homepage hack to my site and what I'd like to do if it is possible is to make my current banner actually clickable to my second homepage which will have a banner, a slideshow and a seperate navbar, for now. The only way I figured I could do this was by adding hyperlink image code to my navbar container code which will link a photo (or my current front page banner) to my second homepage.

I see from above that there is a way to create a second navbar correct? So now all I need to know is how to name each navbar within the <div> tags that I create in the custom header, are following me? Can someone point me in the right direction?

Many thank yous
To make the homepage banner clickable change this in your header

<div id="my_banner"></div>

to this

<div id="my_banner">
<a href="link here">
<img src="/img/spacer.gif" width="1022" height="940" border="0" alt="">
</a></div>

If it was me I'd crop off most of the top blank area of the banner.

Why a separate navbar? Remove to one on the homepage because the
image will link to your second homepage.

You can see what it would look like cropped using this banner CSS.
/* temp disable this
#my_banner {
width: 1022px;
height: 940px;
margin: 0 auto;
background: url(http://londonmourdynphotoimagery.smugmug.com/Other/Front-page-banner/Homepage-banner/1119119433_rxKU8-O.jpg) no-repeat;}
*/

#my_banner {
width: 1022px;
height: 840px;
margin: -260px auto 0;
background: url(http://londonmourdynphotoimagery.smugmug.com/Other/Front-page-banner/Homepage-banner/1119119433_rxKU8-O.jpg) no-repeat;}

jfriend
Dec-08-2010, 08:10 AM
To make the homepage banner clickable change this in your header

<div id="my_banner"></div>

to this

<div id="my_banner">
<a href="link here">
<img src="/img/spacer.gif" width="1022" height="940" border="0" alt="">
</a></div>

If it was me I'd crop off most of the top blank area of the banner.

Why a separate navbar? Remove to one on the homepage because the
image will link to your second homepage.

You can see what it would look like cropped using this banner CSS.
/* temp disable this
#my_banner {
width: 1022px;
height: 940px;
margin: 0 auto;
background: url(http://londonmourdynphotoimagery.smugmug.com/Other/Front-page-banner/Homepage-banner/1119119433_rxKU8-O.jpg) no-repeat;}
*/

#my_banner {
width: 1022px;
height: 840px;
margin: -260px auto 0;
background: url(http://londonmourdynphotoimagery.smugmug.com/Other/Front-page-banner/Homepage-banner/1119119433_rxKU8-O.jpg) no-repeat;}Mourdyn, you have to be careful with making the banner clickable. You can't use the technique that either Allen or I provided you above for having different banners in different places and have each of them either a different size or clickable to different places. To do that, you have to physically add two separate banners and then hide one vs. the other (a different technique). You'd actually insert my_banner2 and then hide one and show one in different places.