Site logo

Archived topic

Full Width Title On Single Post / Page

22 replies · Started by Hftt on May 9, 2015

Viewing posts 1–15 of 23

I couldn't be happier if GP can display post and page titles in full width.
Can I do like that in GP?

For example - Similar to this one:

http://prntscr.com/73j9eq

Is it possible?

Thanks T!

Do you mean having the page/post title be full width above the below content and sidebars?

If so, I may have an idea :)

Let me know!

Absolutely. :)

Full-width Page/Post Title (above). Content + Sidebar (below).

Would it be possible?

For sure :)

1. Install a child theme: http://generatepress.com/api/themes/generatepress_child.zip

2. Add the following code to your child theme's functions.php file:

add_filter( 'the_title', 'generate_remove_page_titles', 10, 2 );
function generate_remove_page_titles( $title, $id = null )
{
	global $post, $generate_content_filter_completed;
	
	if ( $generate_content_filter_completed ) {
		return $title;
	}
	
	if ( ( is_page() || is_single() ) && in_the_loop() && $title == $post->post_title )
		return '';
		
	return $title;
}

add_filter( 'the_content', 'generate_content_filter_completed' );
function generate_content_filter_completed( $content ) 
{
	global $generate_content_filter_completed;
	$generate_content_filter_completed = true;
	return $content;
}

3. Then add this CSS to your child theme's style.css file:

.page .entry-content,
.single .entry-content {
      margin-top: 0;
}

.page .entry-header,
.single .entry-header {
      display: none;
}

4. Now, you can re-add the title above using a function like this to your child theme's functions.php file:

add_action('generate_after_header','generate_add_title_below_header');
function generate_add_title_below_header()
{ 
	// If we're not on a page, don't do anything
	if ( is_page() || is_single() ) {
	?>
	<div class="page-header-content generate-page-header generate-content-header page-header-title">
		<div class="inside-page-header-container inside-content-header grid-container grid-parent">
			<header class="entry-header">
				<h1 class="entry-title" itemprop="headline"><?php the_title(); ?></h1>
			</header><!-- .entry-header -->
		</div>
	</div>
	<?php }
}

Gotcha! Bravo! Thanks T.

Follow your instruction.

1. Remove this from content-single.php.

		<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 -->
		</header><!-- .entry-header -->

2. I couldn't find -

... <h1 class="entry-title" itemprop="headline"> ...

in content.php. So I don't remove anything from content.php.

3. Add code snippet in functions.php.

4. :) :) I get full width title on single post / page.

Do I still need to change (add / remove) in content.php?

You can leave content.php as it is, it deals with the blog page, so you don't want to move those titles.

content-page.php and content-single.php are the files you want to alter :)

Alrighty. I will leave content.php as it is.

I don't even want to look at those .php file. Scared to touch. Just a teeny tiny bit of PHP skill. :(

I know CSS and style .entry-title class.

GP is sooooo (d a m n) cool!

Just out of curiosity, how many people are developing GP? Just you ... by yourself?

Just me! :)

Glad you got it all working!

Just an update, instead of having to copy the content-page.php and content-single.php files into your child theme, you can use this function to remove the title from pages and single post pages:

add_filter( 'the_title', 'generate_remove_page_titles', 10, 2 );
function generate_remove_page_titles( $title, $id = null )
{
	global $post, $generate_content_filter_completed;
	
	if ( $generate_content_filter_completed ) {
		return $title;
	}
	
	if ( ( is_page() || is_single() ) && in_the_loop() && $title == $post->post_title )
		return '';
		
	return $title;
}

add_filter( 'the_content', 'generate_content_filter_completed' );
function generate_content_filter_completed( $content ) 
{
	global $generate_content_filter_completed;
	$generate_content_filter_completed = true;
	return $content;
}

Then add this CSS:

.page .entry-content,
.single .entry-content {
      margin-top: 0;
}

.page .entry-header,
.single .entry-header {
      display: none;
}

A little bit cleaner :)

Ah, flaw in my code!

Try this function:

add_filter( 'the_title', 'generate_remove_page_titles', 10, 2 );
function generate_remove_page_titles( $title, $id = null )
{
	global $post, $generate_content_filter_completed;
	
	if ( $generate_content_filter_completed ) {
		return $title;
	}
	
	if ( ( is_page() || is_single() ) && in_the_loop() && $title == $post->post_title )
		return '';
		
	return $title;
}

add_filter( 'the_content', 'generate_content_filter_completed' );
function generate_content_filter_completed( $content ) 
{
	global $generate_content_filter_completed;
	$generate_content_filter_completed = true;
	return $content;
}

You will still need to use the function you linked to so it re-adds the title below the header. The function above basically makes it so you don't have to have custom content-page.php and content-single.php files.

:)

That one works! Thank you so so much. You're BATMAN! <-- My favorite superhero!

Haha you're very welcome! :)

can this still be used with the newest versions?
I added a child theme and added the code above. but it's not showing any title or author or date :(

Are you trying to remove the page title from all pages?

This archived topic is closed to new replies.