Andrew Nevins
(@anevins)
WCLDN 2018 Contributor | Volunteer support
I have tried to do this in header.php, but have failed miserably!
What happened? This sounds like the right file.
I tried to put it in the end (after the dropdown menu code) but it still uses the header formatting (black background) , and puts it before the dotted line.
Ideally, I’d like to have the header as it looks currently, and below the dotted line have the entry for the banner, followed by the page.
Am I barking up the wrong tree?!
Andrew Nevins
(@anevins)
WCLDN 2018 Contributor | Volunteer support
Could you post here the code you’re using for the banner?
This is the end of the existing header code:
<nav class="primary-menu-dropdown">
<?php
$menu_name = PC_CUSTOM_NAV_MENU_1;
$locations = get_nav_menu_locations();
if ( has_nav_menu( $menu_name ) ) {
$menu = wp_get_nav_menu_object( $locations[ $menu_name ] );
$menu_items = wp_get_nav_menu_items($menu->term_id);
$menu_list = '<select onchange="if (this.value) window.location.href=this.value">';
$menu_list .= '<option selected="selected">-- Main Menu --</option>';
foreach ( (array) $menu_items as $key => $menu_item )
$menu_list .= '<option value="' . $menu_item->url . '">' . $menu_item->title . '</option>';
$menu_list .= '</select>';
echo $menu_list;
}
else { /* Display fallback menu. */
$args = array( 'depth' => -1 );
$menu_items = get_pages($args);
$menu_list = '<select onchange="if (this.value) window.location.href=this.value">';
$menu_list .= '<option selected="selected">-- Main Menu --</option>';
foreach ( (array) $menu_items as $key => $menu_item ) {
$permalink = get_permalink( $menu_item->ID );
$menu_list .= '<option value="' . $permalink . '">' . $menu_item->post_title . '</option>';
}
$menu_list .= '</select>';
echo $menu_list;
}
?>
</nav>
</header>
</div><!-- #header-container -->
I’ve just tried putting an <img> tag after the last </div> entry and it brings the image in after the menu! I didn’t think this would work. Is it OK to put it after the container?
It now needs a white border above it to make it clear the dotted line, and to format it centrally – <img src=”…” align=”center”> doesn’t work?! Do I need to assign it a CSS entry?
Thanks for your help!
Andrew Nevins
(@anevins)
WCLDN 2018 Contributor | Volunteer support
Is it OK to put it after the container?
Yep, just wrap it in a <div> for good practice. E.g,
</div><!-- #header-container -->
<div class="banner">
<img src="..." alt="..." />
</div>
It now needs a white border above it to make it clear the dotted line
You can use CSS to control the appearance of these things, e.g,
.banner img { border-top: 1px solid white; }
, and to format it centrall
Not sure what you mean, I thought you said you want it 100% width.
Ah I see…by giving the DIV a class the browser will then search for a CSS entry with that name? Great…
Sorry I was unclear when I said 100% width – I meant that the banner area should be 100% width (so there’s no sidebar either side). Looks like that’s sorted!
Thanks for your wisdom! Much appreciated.
Steve
…one more thing! Is it possible to have the content of the banner page-specific? Would that involve some in-depth scripting?
Andrew Nevins
(@anevins)
WCLDN 2018 Contributor | Volunteer support
Different images on different pages?
Andrew Nevins
(@anevins)
WCLDN 2018 Contributor | Volunteer support
You use conditional tags http://codex.ww.wp.xz.cn/Conditional_Tags
For example,
if ( is_home() ) {
?>
<img src="..." alt="..." />
<?php
}
Andrew Nevins
(@anevins)
WCLDN 2018 Contributor | Volunteer support
If you have loads of pages and don’t want to do loads of if statements/ a big switch statement, you could rename your banner images with “banner-28” and “28” representing the page’s ID.
Then just do what you were doing before and in the image’s ‘src‘ attribute you can append the page’s ID to it.
E.g,
<?php
//Assuming you don't have a global $post already
global $post;
?>
<div class="banner">
<img src="banner-<?php echo $post->ID ?>" alt="..." />
</div>
But then you may have issues picking an accurate description for the ‘alt‘ attribute.
Ah OK that makes complete sense. I’ll give your second suggestion a try…thanks so much again for your help!
