Calling beans_header elsewhere

Hi,

I would like to move the beans_headerinto a pre-built div in a template - not wrapping in a new div (with echo beans_open_markup) but just call it/move it to another div in the html markup. I have tried the following:

<div class="myDiv">
    <?php
    echo beans_open_markup( 'beans_head', 'head' );

        do_action( 'beans_head' );

        wp_head();

    echo beans_close_markup( 'beans_head', 'head' );
    ?>
</div>

but no luck...

Cheers,

Hey Mike,

beans_header and beans_head are not the same. beans_head is the head par of the page which contain all meta tags scripts etc. while beans_header is where the logo and nav are.

I am not sure I understand 100% where you want to move the header, do you have a markup id which you want to move the header to?

If you want to manually call it on your HTML what you can do is removed the action which attach the header to beans_site_prepend_markup and then call the function manually in your HTML. So like this:

beans_remove_action( 'beans_header_partial_template' );

Then you can call the function in your HTML as such:

<div class="myDiv">
  <?php beans_header_partial_template(); ?>
</div>

If instead you wanted to move it, then you would change the hook to what ever you want. Let's assume you want to move it above the footer for the sake of the example, you would simply have to do so:

beans_modify_action_hook( 'beans_header_partial_template', 'beans_footer_before_markup' );

Hope that makes sense,

Hi Thierry,

Thanks the examples above kinda work however i then get two menus?

Essentially i was trying to move the menu to within a div that has a background image(hero image)...the menu would have a transparent background so that the image from the containing div would show through and float above the hero image.

I have however since given the header section a position of absolute which then alows the menu to sit above the hero image section now.

Weird that you have two menus, some of your code might varie or you perhaps added all snippet above.

I am not sure if you already know but If you want to add a div around any markup you can use the beans_wrap_markup() function (see its code reference here). So if you wanted to add a div around beans_header, you could do as follow:

beans_wrap_markup( 'beans_header', 'example_header_wrap', 'div', array( 'class' => 'example-class' ) );

If you wanted to add a div inside a div wrapping all children, then you would use beans_wrap_inner_markup() (see its code reference here) in the same fashon.

Hope that helps,

Cool thanks Thierry. All working now, I was heading on the wrong tangent with what i was trying to achieve.