Pinning Footer to all pages on my site and anomolies

Pezpix

Greetings, I am trying to track down a way to add CSS code to pin my footer to the bottom of every page on my site. www.pezman.net

I ran into the code for pinning the header and footer on this thread ( http://gallery.imagesinthebackcountry.com/Smugmug-customization/Pinning-the-Header-and-Footer ) however, it gives me strange anomalies on my site which lock down and make all my customization abilities unselectable which I have screen captured below.

I have stripped all CSS coding and tried the "Pinning Header and Footer" code from the above link and it still continues to cause this issue. Is there a code out that allows the footer itself to be pinned?

Hikin' Mike

I wrote the tutorial and it works on the test page (http://gallery.imagesinthebackcountry.com/Gallery-Examples/Pinning-Header-Footer-Example/n-Rh5ZKH).

I just added that code in your '... /Shop/Book' page using one of the web tools and it works.

Did you actually publish it? Looking at the screen print, you didn't.

Pezpix

Hi Mike, I have not tested it officially yet, but what I am seeing is errors on my front page www.pezman.net and all other pages which lock up the ability to select any further options on any of my bars (Usually green bars to select options/dimensions/remove block) All I see is red bars and unselectable text.

Halp lol

Hikin' Mike

It's possible you copied the code wrong, like missing a closing } causing the error? I'm not getting any errors.

Where are you putting the code?

Pezpix

Mike, I am putting the code directly in my css on my main page... but still not seeing any change that lets me select any customization after.
Using Google Chrome web browser Version 63.0.3239.132 (Official Build) (64-bit) fyi

Hikin' Mike

Again, are you sure you got the whole code? Other than that, I don't have an answer. My code works on my site. Using the web tools with Chrome, your site works too.

Publish and see what happens. Pretty sure if you "break it", somebody in SM (not on the forum) can get it back running.

Jtring

Let me toss a few things to out, although any attempt at debugging SmugMug pages in customize mode from a distance is basically just guesswork. It looks to me like the footer is "on top" of the that little red box with wrench and the "ON ENTIRE SITE" caption that pops up. That's why you can't click it to bring up the CSS editor. I suspect Mike never had the problem because the layout of his site never landed any editing tools on top of the footer. First of all, you should still be able to get to the CSS by moving the mouse over the CSS tab at the right (the one under "ON HOMEPAGE") and clicking the wrench that appears while you are hovering there. Second, you might be able to fix the "on top" problem. Try adding this to the CSS. This attempts to move footer under the red editing box.

.sm-user-ui .sm-page-layout-region-footer {
     z-index:-1;
}  

If that doesn't work, you can try moving the red box on top

.sm-widgetselector-red {
     z-index:100 !important;
}

You'll need the !important since SM sets the z-index for that red box in HTML, not in CSS.

No guarantees on any of this. I don't know whether it would have undesirable side effects, and I don't have a good way to test this stuff on my site.