Add Full Width Image before content/sidebar with Hook

[Robby Payne]

I'd like to be able to add a full-width image after the nav but before the content/sidebar area on this site:

http://affiliatedbaptist.com

Each page will need a unique picture, so I'm needing the proper code to insert in the page template for each page. I'm OK with registering and adding widget areas for the client to change out these pics, but I'd love to be able to allow them to make these changes via the "Featured Image" for each page. Either way, I just need to know what PHP code to drop into the page template to get it to drop the image up there. Below I will post a mock-up of what I'm going for here...

http://affiliatedbaptist.com

[Brad Dalton]

How many pages?

There's at least 5 ways to do this.

1. CSS
2. PHP custom function
3. PHP in Simple Hooks
4. Custom Widgets
5. Custom Fields

Adding a new widget for each page could be a problem if there's a lot of pages.

Another option is to use a custom field hooked into the same position. This will enable you to create a custom meta box for a second featured image where they can simply upload the image from any edit screen.

Which solution do you want Robby?

---

Tutorials for StudioPress Themes & WooCommerce.

[Robby Payne]

Thanks for the reply!

I'm thinking this option:

"Another option is to use a custom field hooked into the same position. This will enable you to create a custom meta box for a second featured image where they can simply upload the image from any edit screen."

This sounds like what I'm going for. Looking forward to your wise advice!

[Brad Dalton]

Here's the tutorial. Simply change the hook and conditional tag to suit your needs. http://wpsites.net/web-design/add-unique-header-images-using-custom-fields/

---

Tutorials for StudioPress Themes & WooCommerce.

[Robby Payne]

Thanks for the help! This is close to what I'd like to do, but I don't want to replace the header image. I would like to add a header-type image above the content but below the Navigation. If what you suggested is the way to do that, forgive my ignorance. I have the CSS and HTML stuff down, but I trip all over PHP and hooks. I read the linked article and think this is close to what I'm wanting, I just need to know how to get it to appear above the content, below the nav, and without replacing the main header.

Thanks again for all your help!!!

[Brad Dalton]

Simply change the hook position.

Running XHTML or HTML 5.

Replace

genesis_header

with another hook like

genesis_before_content_sidebar_wrap

Its that easy!

---

Tutorials for StudioPress Themes & WooCommerce.

[Robby Payne]

It's an XHTML install right now. If I change it over to HTML5, is there anything I need to change with this?

[Brad Dalton]

Only the Loop hooks have changed and the CSS class selectors which the tutorial doesn't include so no changes needed.

---

Tutorials for StudioPress Themes & WooCommerce.

[Robby Payne]

Worked like a charm! Thanks again for the help!

[Brad Dalton]

No worries.

---

Tutorials for StudioPress Themes & WooCommerce.

[Author]

Posts