Snippets: Automatically Add Content Under All Pages With Overlay Header Enabled

If you are working on a site where you are using the overlay header for a specific design on multiple pages rather than using the Visual Composer to add the content under it (if it can be gathered dynamically) you can instead use a child theme function to automatically add a row beneath the overlay header which you can than apply CSS to...etc. This is a basic example but the possibilities are limitless!

// Add custom full-screen row for all overlay header pages
add_action( 'wpex_hook_header_after', function() {

	// Not needed if overlay header is disabled
	if ( ! wpex_has_overlay_header() ) {
		return;
	}

	// Your custom overlay header under the header output below
	// This is a basic example but you could do anything..
	// For example you could grab the page featured image and add it as a background to this row
	// via inline style
	// Or you could even return VC content via a templatera template see this article:
	// https://wpexplorer-themes.com/total/snippets/add-custom-content-multiple-pages-via-visual-composer/
	// ....etc ?>

	<div class="my-custom-overlay-header-under-content wpex-clr">
		<h1><?php the_title(); ?></h1>
		<?php if ( $subheading = wpex_page_header_subheading_content() ) { ?>
			<p><?php echo wp_kses_post( $subheading ); ?></p>
		<?php } ?>
	</div>

<?php } );

Snippet Type: PHP

Posted Under: Header

All PHP snippets should be added via a child theme's functions.php file.