Post title, author, date and featured image in header? [screenshot]

Hi Lewis,

Something like this might get you going: https://generatepress.com/forums/topic/how-to-move-date-post-to-the-header/#post-223195

Let me know :)

Thanks for the quick reply!

So it's definitely going in the right direction, but there's a few issues: https://www.thefreelanceeffect.com/upwork-seo/

For example, the image needs to go below the title. It's also not centered and I can't set a background color in the content box without it automatically removing the featured image.

EDIT: Just to add, I didn't make any changes to the code. I noticed your comment in there, but wasn't sure if I was supposed to touch it. I assume it just applies to every post if I don't specify a post ID?

Hmm ok, you'll need some adjustments:

add_filter( 'generate_show_title', 'generate_hide_single_title' );
function generate_hide_single_title( $title )
{ 
    if ( is_single() )
        return false;

    return $title;
}

add_action( 'after_setup_theme','generate_remove_posted_on' );
function generate_remove_posted_on()
{
    remove_action( 'generate_after_entry_title', 'generate_post_meta' );
}

add_action('generate_after_header','generate_add_post_title_below_header');
function generate_add_post_title_below_header()
{ 
	// Add the single post IDs we want to target to the array below, separated by commas
	if ( is_single() ) : ?>
		<div class="page-header-content generate-page-header generate-content-header">
			<div class="inside-page-header-container inside-content-header grid-container grid-parent">
				<header class="entry-header">
					<?php the_title( '<h1 class="entry-title" itemprop="headline">', '</h1>' ); ?>
					<div class="entry-meta">
						<?php generate_posted_on(); ?>
					</div><!-- .entry-meta -->
					<?php if ( has_post_thumbnail() ) : ?>
						<div class="featured-image">
							<?php the_post_thumbnail(); ?>
						</div>
					<?php endif; ?>
				</header><!-- .entry-header -->
			</div>
		</div>
	<?php endif;
}

It'll need CSS styling, but should be closer to what you're after I think.

Hey Tom,

Man, you nailed it. Exactly what I needed, thank you.

Few small things to fix and it's good.

1) I now have 2 featured images but if I disable in my post settings, it removes both along with the entire header. Why is that happening?

2) Is there a setting to disable post titles/featured images globally? Or do I need to go to all my posts and disable elements one-by-one?

3) When choosing a background color in the content box, I actually have to put content in first. Does it matter if I just put a space or is there a better way?

Thanks again!

Just a quick update:

1) I fixed this by going to Customizer > Layout > Page Header > Hide

2) The fix above removed featured images across all posts, but I had to use CSS to hide post titles globally (without hiding everything).

3) Still need advice on this one.

The generate_show_title filter can be used to remove the post title globally. Do you want it removed on every single page and post, or only within certain conditions?: https://docs.generatepress.com/article/generate_show_title/

Using the code I provided means you shouldn't have to use the Page Header meta box at all. I assume you're just using it to apply a different background color to each page/post?

Hi Tom,

Sorry for the late reply.

1) I'm currently using CSS to hide the titles. I'd like to have it removed on all posts/pages where it's duplicated (as a result of the code you provided), would you recommend using the filter instead?

2) For now I'm using CSS to apply the same background color to all posts/pages. I do plan to have some posts with a unique background header color though.

I'm not sure what you mean by "you shouldn’t have to use the Page Header meta box at all" -- how else can I change the header background color individually?

Thanks,
Lewis.

Using the filter is a good idea, or using the Disable Elements meta box to disable the content title on each page you choose. This way the HTML isn't printed.

Loading the page header just to change the background color is probably overkill. Instead, I would use my Simple CSS plugin to apply a different background color to each page/post inside the CSS meta box.

Let me know if you need more info :)