How to relocate Page Titles below Header in Digital Pro

Posted on
5/5 - (162 votes)

Looking to move titles from their usual position (inside .entry-header in content) to below the site header in their own div on static Pages in Digital Pro?

We shall remove entry header (having the entry title) and add entry title wrapped inside a custom .page-title div below the header.

Step 1

Add the following in functions.php:

// Reposition Page Title
add_action( 'genesis_header', 'custom_page_title' );
function custom_page_title() {

	if ( is_page() and !is_front_page() ) {
		remove_action( 'genesis_entry_header', 'genesis_entry_header_markup_open', 5 );
			remove_action( 'genesis_entry_header', 'genesis_do_post_title' );
		remove_action( 'genesis_entry_header', 'genesis_entry_header_markup_close', 15 );

		add_action( 'genesis_after_header', function () {
			echo '<div class="page-title"><div class="wrap">';
		} );
			add_action( 'genesis_after_header', 'genesis_do_post_title' );
		add_action( 'genesis_after_header', function () {
			echo '</div></div>';
		} );
	}

}

Step 2

Add the following in style.css:

.page .site-inner {
	margin-top: 0;
}

.page-title {
	margin-top: 91px;
	padding: 60px 0;
	background-color: #f7f7f7;
	text-align: center;
}

.page-title .wrap {
	max-width: 1280px;
	margin: 0 auto;
}

.page .entry-title {
	margin-bottom: 0;
}

@media only screen and (max-width: 800px) {

	.page-title {
		margin-top: 0;
	}

}