How to remove header & footer from single page

[Stina]

I would like to remove the header from this page (http://jcphotography-us.smugmug.com/gallery/9060105_bpRK9). I tried turning off showing site owner in the gallery settings but then I have the default smugmug header and footer that I don't know how to remove. Please help.

[jfriend]

You can do that fairly easily by making two changes:

First, change this piece of your header HTML from this:

<div align="center">
<a href="http://www.jcphotography.us"><img src="http://www.jcphotography.us/photos/366232625_f3D99-M.png" border="0" height="150" width="500"></a>
</div>
to this:

<div id="mainHeader" align="center">
<a href="http://www.jcphotography.us"><img src="http://www.jcphotography.us/photos/366232625_f3D99-M.png" border="0" height="150" width="500"></a>
</div>

Second, add this CSS:

.gallery_9060105 #mainHeader, .gallery_9060105 #navcontainer {display:none;}

[Stina]

Thanks that worked great for the header. :clap

Now how do I get rid of the Footer that says "All Images © J&C Photography"? I want it on my other pages but these images are not mine they are provided for me so I would like to remove that from this page also.

[jfriend]

Thanks that worked great for the header. :clap

Now how do I get rid of the Footer that says "All Images © J&C Photography"? I want it on my other pages but these images are not mine they are provided for me so I would like to remove that from this page also. I guess I would have hoped you would have seen what was done with the header and just done the same kind of thing to the footer:

Change the footer HTML from this:
<center>All Images © J&amp;C Photography</center>
to this:
<div id="myFooter">All Images © J&amp;C Photography</div>
Add this CSS:
.gallery_9060105 #myFooter {display:none;}

[Stina]

Sorry, I got the overall theory however I have problems figuring out the variable name in the CSS. or I guess that is what the HTML defines? I'm basically just a weekend warrior with this stuff, I just know enough to be dangerous. Thanks for taking the time to help though.

[jfriend]

Sorry, I got the overall theory however I have problems figuring out the variable name in the CSS. Is their a master list anywhere? I've tried using the Firefox web developers toolbar but I can't seem to figure it out.

"mainHeader" and "myFooter" are just two variable names that I made up. I put them in your HTML and then I referred to them in CSS. It's good to use something unique that Smugmug doesn't also use. Usually starting them with "my" is safe. I didn't use myHeader because you already have a myHeader object.

As for the object IDs and classes in Smugmug's pages, you just have to look at them to see what's there. The low tech way to do that is with View/Source in the browser and then search through the raw HTML for the items of interest.

The more powerful way to do it is to get a tool that lets you look at all the objects in the page in a hierarchy. I use Firebug which is a free add-on to Firefox. I right click on the item of interest in the page, select Inspect Element and it pops open a window that shows me everything about that object including it's CSS ID and classes along with the whole hieararchy of the page.

FYI, I wasn't really complaining that you didn't do it yourself, just encouraging you to give it a try. I'd rather teach someone to fish than just bring them fish regularly.

[Stina]

FYI, I wasn't really complaining that you didn't do it yourself, just encouraging you to give it a try. I'd rather teach someone to fish than just bring them fish regularly.

:D Don't worry I didn't take it that way, I really would rather learn and I have learned a lot through the forums here. I glad people are willing to take the time to answer questions. My biggest downfall is I work on my page for awhile and the do little to it for long periods and have to relearn a bit each time. Thanks again for taking the time to explain. That is something new to add to my knowledge base. Have a great day