Pinning the Header & Footer on Your SmugMug Site - Mike Matenkosky

Pinning the Header & Footer on Your SmugMug Site

If you want to pin both the Header and Foooter, add this to your theme’s CSS. If you just want to pin them on selected pages, add a CSS block to the selected pages.

CSS


/**
* Pins Header and Footer
************************************************/	
.sm-user-ui .sm-page-header, 
.sm-page-header.sm-user-ui, 
.sm-user-ui .sm-cart-header,
.sm-user-ui .sm-page-layout-region-header,
.sm-user-ui .sm-page-layout-region-footer {
	position: fixed;
	width: 100%;
	}
	
.sm-user-ui .sm-page-header, 
.sm-page-header.sm-user-ui, 
.sm-user-ui .sm-cart-header {
	z-index: 100;
	}	
	
.sm-user-ui .sm-page-layout-region-header,
.sm-user-ui .sm-page-layout-region-footer {
	z-index: 10;
	}	
	
.sm-user-ui .sm-page-layout-region-body {
	padding-top: 175px; /* Adjust this for your logo/nav */
	padding-bottom: 100px; /* Adjust this for your footer */
	}

.sm-user-ui .sm-page-layout-region-footer {
	bottom: 0px;
	}

Powered by SmugMug Log In