Sridhar Katakam

Genesis and WordPress Tutorials

How to relocate Page Titles below Header in Digital Pro

by 12 Comments

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?

digital-pro-relocate-page-titles

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;
	}

}

  • I really appreciate this tutorial and tried it on a website I’m using with Digital Pro. The only problem is that on the main Blog page, the post titles (entry-title) are removed for some reason from the list of posts. The entry-meta and entry-content all show up fine.

    Below is snippet of the entry-title code that is being removed for some reason. Any suggestions on how to fix this? Thanks.

    Post Title

    Further below is the code I have in my theme’s functions.php file.

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

    if(is_singular( 'post' ) || is_archive() || is_page_template( 'page_blog.php' )) {
    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 '';
    } );
    add_action( 'genesis_after_header', 'genesis_do_post_title' );
    add_action( 'genesis_after_header', function () {
    echo '';
    } );
    }

    }

    Reply

  • Thanks for responding so quickly.

    The Blog (Press) page is here: https://www.bbls.net/cms2/press/

    The other pages on the website were created using the Beaver Builder plugin with a full-page-width page template I added to my digital pro theme directory. This was done to allow me to have more control over the layout of the pages as well as to have a full width custom page title bar (entry-header), with a background image, positioned immediately below the site-header section and above the entry-content section. See this page to understand what I’m referring to: https://www.bbls.net/cms2/portfolio/okyanos/

    On the blog page, single posts pages and archives page the beaver builder plugin does not apply so I’m trying to replicate the same entry-header style (full width page title bar with background image and page tile text centered) as the other pages have.

    However, for the blog page, single posts pages and archives page I’d like the page title text (archive-description or archive-title) to all be named “Press.”

    Below is the latest tweak I’ve done to the original code you posted in this tutorial. FYI, I also set the Reading Settings under “Your homepage displays” to static page > homepage: Home and Posts page: Press.

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

    if(is_singular( 'post' ) || is_archive() || is_home()) {
    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 '';
    } );
    add_action( 'genesis_after_header', 'genesis_do_post_title' );
    add_action( 'genesis_after_header', function () {
    echo '';
    } );
    }

    }

    Reply
    • >