WordPress Child Theme – Remove Title, Description, White Space, Black Lines in Header Section

WordPress Child Theme Case Study: 2020 Euro Lens Bath

WordPress version: 3.1
WordPress Theme: Child Theme for Twenty Ten 1.2

Section 1 of 4

1. Copy header.php file to Child Theme folder
2. Delete the following lines (approx 60-66) from header.php:

<?php $heading_tag = ( is_home() || is_front_page() ) ? 'h1' : 'div'; ?>
				<<?php echo $heading_tag; ?> id="site-title">
					<span>
						<a href="<?php echo home_url( '/' ); ?>" title="<?php echo esc_attr( get_bloginfo( 'name', 'display' ) ); ?>" rel="home"><?php bloginfo( 'name' ); ?></a>
					</span>
				</<?php echo $heading_tag; ?>>
				<div id="site-description"><?php bloginfo( 'description' ); ?></div>

Section 2 of 4

Let’s also remove 30px white space/gap between top of header art and top of page. Copy from the Twenty Ten theme CSS, paste into the Child theme CSS, and edit.

Change:

#header {
	padding: 30px 0 0 0;
}

To:

#header {
	padding: 0;
}

Section 3 of 4:

We want to remove the top margin and side padding from the header area, so the header is right up against the top of the view port. Copy from the Twenty Ten theme CSS, paste into the Child theme CSS, and edit.

Change:

#wrapper {
	background: #fff;
	margin-top: 20px;
	padding: 0 20px;
}

To:

#wrapper {
	background: #fff;
	margin-top: 0;
	padding: 0;
}

Section 4 of 4:

Finally, we want to get rid of the 2 black lines that are at the top and bottom of the header graphic in the Twenty Ten theme. Copy from the Twenty Ten theme CSS, paste into the Child theme CSS, and edit.

Change:

#branding img {
	border-top: 4px solid #000;
	border-bottom: 1px solid #000;
	display: block;
	float: left;
}

To:

#branding img {
	border-top: none;
	border-bottom: none;
	display: block;
	float: left;
}