[Resolved] Page Header

[andrachans]

Hello there.

I would like to set up 2 separate Page Headers (one under the other), or, the Page Header, and then a separate content area underneath the Page Header.

The first Page Header will have a set height and width, but with different content, on each page and post.

The second Page Header / Content area, will also have a set height and width (different to the first Page Header though), and also having different content, on each page and post.

Do you have any documentation on this, as I do not seem to locate any.

I look forward to hearing from you.

Thank you.

[David]

Hi there,

i don’t think it is possible to register two page headers on the same page.
The alternative for the second header would be to use a Hook with some conditional templates.
You may want to check out GP 1.7 (its in Release Candidate), the new Elements module adds conditional display rules to Page headers (Page Heros) and Hooks.

[andrachans]

Hello there,

I decided to leave the Header and an additional Header area, and to rather Register a Widget Area in the header (just below the navigation menu).

I followed Tom’s advice found in ‘Create A New Widget Area’ support ticket (wherein he refers to documentation found at http://codex.wordpress.org/Widgetizing_Themes).

Although I am NOT a PHP expert, I have the new widget area up and running.

I have two questions:

1) Is the php code found in the http://codex.wordpress.org/Widgetizing_Themes documentation, the 100% best fit for generatepress themes coding? Is it ‘general solution’ type of php code that will work for any theme…including generatepress?

The reason I ask, is because, when viewing other documentation on how to Register a Widget Area, the php code suggested, differs quite considerably from that found in the http://codex.wordpress.org/Widgetizing_Themes documentation.

2) I am wanting to Register a second Widget Area directly below the one that I have already registered.

Because I do not understand php very well, I am getting muddled up with all the <?php and ?> and <?php endif; ?> etc etc So even though I do manage to position the second Widget Area directly below the first widget, I always end up with php code displayed on the page, when viewing the site live.

I do know that I could use two different widgets in the same Widget Area (I have tried this), but it is not quite the outcome that I am looking for.

So, could you please help me to put two sets of the php code found at http://codex.wordpress.org/Widgetizing_Themes together, for both the functions.php and header.php files, so that I do not continue getting the errors that I currently am getting.

Although I have been able to locate documentation on registering multiple widget areas across the site, I have thus far, been unable to find documentation that explains how to register multiple widget areas underneath each other.

I look forward to hearing from you.

Thank you.

[Tom]

Hi there,

1. Yes – nothing wrong with that code at all.

2. Any chance you can share the code you’re using? I should be able to fix it for you 🙂

[andrachans]

Hello Tom,

Thank you for your reply. Sorry, I should have included the code…see it at the bottom of my message.

I want to Register 2 x Widget Areas: ‘After Header 1’ and ‘After Header 2’.

I have the Widget Area for ‘After Header 1’ up and running, with using the code shown below.

What I need help with: Is how to Register a second Widget Area ‘After Header 2’, directly beneath the ‘After Header 1’ widget area.

1) I entered this code (exactly as shown) right at the bottom of the functions.php file (in the child-theme)
/home/kalladhealth/public_html/wp-content/themes/generatepress_child/functions.php

/**
* Register our sidebars and widgetized areas.
*
*/
function arphabet_widgets_init() {

register_sidebar( array(
‘name’ => ‘After Header 1’,
‘id’ => ‘after_header_1’,
‘before_widget’ => ‘

‘,
‘after_widget’ => ‘

‘,
‘before_title’ => ‘<h2 class=”rounded”>’,
‘after_title’ => ‘</h2>’,
) );

}
add_action( ‘widgets_init’, ‘arphabet_widgets_init’ );
?>

2) I copied the header.php file: /home/kalladhealth/public_html/wp-content/themes/generatepress/header.php

NOT THIS ONE: /home/kalladhealth/public_html/wp-content/themes/generatepress/inc/structure/header.php

I entered this code (exactly as shown) right at the bottom of the header.php file (in the child-theme)
/home/kalladhealth/public_html/wp-content/themes/generatepress_child/header.php

if ( is_active_sidebar( ‘after_header_1’ ) ) : ?>

<?php dynamic_sidebar( ‘after_header_1’ ); ?>

<!– #primary-sidebar –>
<?php endif; ?>

I look forward to hearing from you.

Thank you.

[andrachans]

Hello Tom

In addition to my message of earlier…

The above code is causing some problems…a blank screen when I clear cache with WP Rocket, and other functions that I am doing, are also causing a blank screen.

When I remove the code from header.php the problem persists. However, when I leave the code in header.php and remove it from functions.php the problem stops.

I don’t know what is causing that.

I look forward to hearing from you.

Thank you.

[Tom]

Hi there,

So, remove the code you added to functions.php, and remove the header.php file from your child theme.

Then add this to your child theme functions.php:

function arphabet_widgets_init() {
	register_sidebar( array(
		'name' => 'After Header 1',
		'id' => 'after_header_1',
		'before_widget' => '',
		'after_widget' => '',
		'before_title' => '<h2 class="rounded">',
		'after_title' => '</h2>',
	) );
}
add_action( 'widgets_init', 'arphabet_widgets_init' );

add_action( 'generate_after_header', function() {
	if ( is_active_sidebar( 'after_header_1' ) ) {
		dynamic_sidebar( 'after_header_1' );
	}
} );

[andrachans]

Hello Tom

Thank you very much for taking the time to do this for me – a very much simpler solution too. This is working 100%.

I have put this code together twice, so that I now have ‘After Header 1’ and ‘After Header 2’ widget areas.

Here is my version of the code (is it correct – it seems to be working fine).

All the best.

function arphabet_widgets_init() {
	register_sidebar( array(
		'name' => 'After Header 1',
		'id' => 'after_header_1',
		'before_widget' => '',
		'after_widget' => '',
		'before_title' => '<h2 class="rounded">',
		'after_title' => '</h2>',
	) );
	
	register_sidebar( array(
		'name' => 'After Header 2',
		'id' => 'after_header_2',
		'before_widget' => '',
		'after_widget' => '',
		'before_title' => '<h2 class="rounded">',
		'after_title' => '</h2>',
	) );
}
add_action( 'widgets_init', 'arphabet_widgets_init' );

add_action( 'generate_after_header', function() {
	if ( is_active_sidebar( 'after_header_1' ) ) {
		dynamic_sidebar( 'after_header_1' );
	}
	
	if ( is_active_sidebar( 'after_header_2' ) ) {
		dynamic_sidebar( 'after_header_2' );
	}
	
} );

[andrachans]

Hello Tom,

Further to my message of a bit earlier…

Would it be possible to also add in a <div id= to the code for both of the widget areas, as it is proving difficult to identify the widget area that I want to apply css to.

Thank you

[Tom]

Looks good!

For the containers, you can do this:

add_action( 'generate_after_header', function() {
	if ( is_active_sidebar( 'after_header_1' ) ) {
                echo '<div id="your-first-id">';
		    dynamic_sidebar( 'after_header_1' );
                echo '</div>';
	}
	
	if ( is_active_sidebar( 'after_header_2' ) ) {
                echo '<div id="your-second-id">';
		    dynamic_sidebar( 'after_header_2' );
                echo '</div>';
	}
	
} );

Hope this helps 🙂

[andrachans]

Hello Tom,

Thank you very much for sorting this out for me.

It works 100%

All the best.

[Tom]

You’re very welcome 🙂

[Author]

Posts