Add widget before site-banner-header in Beautiful Pro Theme

[TracyRochester]

http://coach4.businesswebstrategies.com/
username: coach4
password: template

I wanted to add some organic shapes to the site-header-banner and so added a widget area below the header using this code:

genesis_register_sidebar( array(
'id' => 'after-header',
'name' => __( 'After Header', 'beautiful' ),
'description' => __( 'This is the after header widget area.', 'beautiful' ),
) );

//* Hook after header widget area after site header
add_action( 'genesis_after_header', 'bws_after_header_widget_area' );
function bws_after_header_widget_area() {

genesis_widget_area( 'after-header', array(
'before' => '</div></div>',
'after' => '<div class="after-header widget-area"><div class="wrap">',
) );

}

It seems to work fine. I now have a widget area called "After Header", and I was able to add an image to it.

The theme already had a before header widget area. To test, If I put something there like search it appears above the site title.

What I want is for a widget to appear after the site title area and before the site-header-banner. (That way I can add an image to the top and bottom of the site-header-banner image to make it organically shaped. )

The next div after the header is: <div class="site-header-banner"></div>

In the code above, if I replace "genesis__after_header" with "genesis_after_site_header_banner" I get a widget, but when I put an image in it, nothing shows on the page.

I know I'm missing a step, but I don't know what it is.

Thanks in advance for suggestions.

http://coach4.businesswebstrategies.com/

[emasai]

"genesis_after_site_header_banner" is not a hook, so although your function may be correct the widget is not attached. See the Visual Hook Guide to understand the available hooks.

---

Need Website Customization or a Responsive CSS fix? Contact Me
Lynne emasai.com

[TracyRochester]

Thank you. That was my thinking, too. May seem like silly question, but is it possible to write a hook?

[emasai]

No it is not possible to write a hook. You have to use the available ones and then restyle them to fit with css.

---

Need Website Customization or a Responsive CSS fix? Contact Me
Lynne emasai.com

[Summer]

Maybe I'm overthinking this, or misunderstanding what you want to achieve, but could you just add a :before and :after to site-header-banner in CSS to get the before & after images you want?

That way you can add your decorative styling without needing to fuss with extra widgets. That's how a lot of themes do the decorations for blockquotes, so I'm guessing it would be the same for a particular header... again, unless I'm misunderstanding what you're trying to accomplish.

---

WordPress / Genesis Site Design & Troubleshooting: A Touch of Summer | @SummerWebDesign
Slice of SciFi | Writers, After Dark

[Author]

Posts