Insert Image Above Header

Beaver Builder
1

I’d like to insert an image between the top bar and the header - will be on every page.

Is this simply a matter of adding the markup to all the templates (I’m using the child theme), or is there a smarter way that I’ve overlooked?

Thanks.

2

Hi Aaron,

You will want to use a child theme and add and edit the header.php file, then add your image code. Alternatively, use could use an action hook via the functions.php file. Like so:

add_action('fl_before_header', 'my_custom_banner');
  function my_custom_banner(){ ?>
    // Add HTML here!
  <?php
}

Thanks,
Danny

3

Thanks Danny.

While the header.php is quick and easy, I’m not sure whoever takes over managing the site will know what to do with that.

So, for the hook, can I use the same idea to just create a widget area there? And will that be visible on pages and posts or just pages?

Thanks.

4

Hi Aaron,

To add a widgetized area, you will want to register a sidebar, you can find more information on the regarding this on the WordPress codex and forums.

https://developer.wordpress.org/reference/functions/register_sidebar/

As you’re adding this to the header, it will be visible on all pages this includes posts and custom post types. If you want this widgetized area to only appear on specific pages, you will want to use the WordPress conditionals in the hook.

https://developer.wordpress.org/themes/basics/conditional-tags/

Thanks,
Danny