Search Results - Banner

Hi there,

Can you link us to the site in question so we could check?

If the blue area is created with Header Element, You should add a display rule inclusion to the existing Header Element, excluding Search Result page.

You then add this PHP snippet to your site.

add_shortcode('search_results_title',function(){ ?>
	
	<header class="page-header">
		<h1 class="page-title">
			<?php
				printf( /* translators: 1: Search query name */
					__( 'Search Results for: %s', 'generatepress' ),
					'<span>' . get_search_query() . '</span>'
					);
			?>
		
		</h1>
	</header>
<?php });

This is so you could use the shortcode [search_results_title] on the Header Element.

You then create a new Header Element with display rule specifically for Search Results page. You can copy all the settings from the other Header Element, except change {{post_title}} to [search_results_title] so it displays Search Results for:

Unfortunately my site is local so I'm unable to share it. I made your recommend changes. It's closer, but not there yet. I should have mentioned I am using a Header element. I'd also want to remove the "Search Results for: author" text from the body of the page if possible.

I've included a screenshot.

https://share.getcloudapp.com/llu9Xndy

Try adding this CSS so it's completely hidden from view:

body.search header.page-header {
    display: none;
}

Made the CSS change unfortunately it not only made the "Search results for" text disappear in the body, but it also made it disappear at the top. How do I get it back at the top and integrated into the blue banner as on the other pages?

Before CSS
https://share.getcloudapp.com/llu9Xndy

After Css
https://share.getcloudapp.com/NQuJp4vl

Hi there,

replace the Shortcode Elvin provided with the one i provide in this topic:

https://generatepress.com/forums/topic/basics-of-customizing-search-page-results/#post-1392150

Then the CSS provided further down in that topic to remove the default title.

Perfect. Thanks!

You're welcome