Someone Please Help: Header on Front Page or No Scroll Slider


#1

My law firm is ready to launch it’s website, and I can’t figure out how to make the header show on the static front page. I only need one image, it’s a full page image that has been created as a landing page (Basically the size of the Quill demo slider).

I’m pretty savvy and messed around with this theme to get it the way I wanted, included making the services show my own custom font/icons but I just can’t figure out how to get the header onto the front page.

After getting the header to the front I will need to make the header size larger or just make the slider stop scrolling because it throws off the main front page I have.

Please help, anyone, I want to launch the website and this is the final piece. I don’t want to go to another theme because I love the style of the quill theme. Thank you, and I’ll try to help anyone that has any questions about the theme that I may know.

The website is www.cyruslawgroup.com


#2

Ok after tinkering a bit, I got the header on the front page, I can explain if someone needs help, although I don’t think I did it the right way.

I also moved the navigation bar under the header, and I just need to figure out how to remove that excess gray area that is below the navigation area…I only need 10px underneath the navigation menu. I was able to make the top of the navigation bar 10px but if I try to mess with the #masthead underneath it (like just delete it) I lose the gray area and it becomes clear. My guess is I have to figure out how to make the mast head only 10px under the navigation menu.

Please help if anyone knows how, www.cyruslawgroup.com


#3

I may have eliminated the masthead from the equation. I deleted it from the header.php but it’s still showing the same amount of space under the header under the navigation menu. Put that back, still tinkering to find what is padding that area between the content so much.


#4

Now I’ve isolated the section I believe I need to edit from the .css:

/*--------------------------------------------------------------
Structure
--------------------------------------------------------------*/
.site-header {
	position: relative;
	overflow: hidden;
	background-color: #2e2e2e;
}
.logo-image {
	max-width: 200px;
}
.header-overlay {
	background-color: #000;
	opacity: 0.7;
	position: absolute;
	width: 100%;
	height: 100%;
	z-index: -1;
}
.site-content {
	padding: 0;
}
.page-template-page_front-page-php .site-content {
	margin-top: 0;
}
.site-content.container {
	margin-top: -0px;
	padding: 0 15px;
}
.site-branding {
	padding: 60px 30px;
	clear: both;
	text-align: center;
}
.site-title {
	font-size: 100px;
	text-transform: uppercase;
	font-weight: 800;
	margin: 0;
}
.site-title a {
	color: #fff;
	text-decoration: none;
	text-shadow: 0 5px 5px #000;
}
.site-description {
	font-size: 20px;
	color: #fff;
}
.content-area {
	width: 750px;
	float: left;
}
.fullwidth,
.home.page .content-area {
	width: 100%;
}
.widget-area {
	width: 360px;
	float: right;
	margin-bottom: 60px;
}
.site-header.has-banner {
	background-color: transparent;
}

#5

Got it!

To edit the header area that contains the Main Menu you have to change this area of the css:

.site-branding {
	padding: 60px 30px;
	clear: both;
	text-align: center;
}

I made mine:

.site-branding {
	padding: 1px 1px;
	clear: both;
	text-align: center;
}

#6

To change the padding for the main navigation you need to edit this area of the css file:

.main-navigation {
	clear: both;
	padding-top: 20px;
	display: block;
	float: left;
	width: 100%;
	text-align: center;
	font-family: 'Open Sans Condensed', sans-serif;
}

I made mine 20, I don’t remember what it was originally.