Header full-screen background image

  • conescu

    (@conescu)


    11 years ago

    Is there a way to wrap the #masthead in a div that spans the width of the page, to put a responsive full-width image behind the header?

    Really great work, this is an excellent theme.

    Jeremy

Viewing 3 replies - 1 through 3 (of 3 total)
  • Anonymous User 12851872

    (@anonymized-12851872)

    Hi,

    I think we need the code -> framework “Custom Code in Header” and “Custom CSS”
    in the Dashboard -> Appearance -> Coller Setting

    I’m not sure if this is exactly what you were looking for, as I am a newbie.

    I wanted an image behind the header also so this is what I did.

    In the backend admin panel click on appearance–> background.

    Upload a file that is 1280 x 245.

    As for the display options beneath the upload:
    Position: Center
    Repeat: No Repeat
    Attachment: Scroll
    Background Color: **This is the color that will appear for
    everything below the Main Nav Menu**

    Click “Save Changes” and you should have that image behind the header while the rest of the page will display the color specified in “Background Color” option.

    The nav menu acts as the divide making it lok very nice!
    Hopefully that is what you are looking for!

    Woops, I noticed that If you don’t upload an image logo that is 360 x 125, the original size I said for the background pic (1280 x 245) may be to big or small.

    You will just have to play around with what height you need.

    I recommend just styling everything first (logo, social icons, menu) than get a ruler plugin for firefox and measure the size you need. (I use the add-on called “MeasureIt”

    Will save you time playing with resizing.

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Header full-screen background image’ is closed to new replies.