Full Width Header Image

[shorthills]

I have an image that I’d like to use as the background above the nav. Is there a “best practice” for doing something like this? If keep it at the full “standard” width of 960px, for example, all is well. But once you stretch the screen width, then the image stays stuck in the middle. So is there a cross-browser compatible way to do something like this — to max out witdth somehow on the full width theme?

or is there a way to make this a fixed-width theme?
thank you

Topic

[Jason Bobich]

Hello,

If I understand what you’re asking, there’s not going to be any feature in the theme to accommodate it, unfortunately; this would be a customization you’d need to make.

The theme works within a container that has a max width of the 960px; so I’m not quite sure how the header image would sit outside of that. Anything within any element of theme is going to sit within this container. Even all content areas of the “full width” layout still confine everything to an inner section with max-width.

You could maybe hook some kind of custom content to themeblvd_before which would just sit before everything in the theme (and confining thus any containers). As far as setting up an image that is going to stretch 100% of the browser no matter what, that’s going to be tricky. You can search google for a solution, but you’re going to find there’s not really any easy answer.

http://dev.themeblvd.com/tutorial/primary-framework-action-hooks/

[shorthills]

Thanks.
I’m going to try it like this:

I will modify the header background file (see my other post) with the “extra” parts of my image (left and right).
Then I’m going to drop in my content by hooking in the image and the text via a custom function in the child theme (as you very nicely documented).

Hopefully this will work.

If not, is there a way to make this into a “Fixed-width at 960px” theme?
thank you agian.

[Author]

Replies