Twenty Sixteen Website title in Header

  • Resolved kietygory

    (@kietygory)


    8 years, 2 months ago

    For Twenty Sixteen child, how do we do the following:
    1) Move the header up to be the background of title?
    2) In addition, make feature image full width regardless of zooming?

    Header moves up: WPBeaches website showed how to move the header up into title by replacing twenty sixteen header.php and tweaks in style.css.

    Feature Image Full Width: @heatherland rightly suggested this code:

    .site-inner {
    max-width: 100%;
}

    This worked on a fresh twenty sixteen template BUT – I have not made it work together with WPbeaches header.php.

    I will try to compare WPbeaches header.php vs twenty sixteen and see if instead of replacing header.php, we can add on child header.php and still get feature image full width.

    Any ideas here?

    My website

    This follows from final comments of this support thread

    • This topic was modified 8 years, 2 months ago by kietygory.
    • This topic was modified 8 years, 2 months ago by kietygory.
    • This topic was modified 8 years, 2 months ago by kietygory.
Viewing 5 replies - 16 through 20 (of 20 total)

  • Hello,

    It doesn’t look like my code is getting picked up by the site? I’m not seeing that it’s even been overwritten so it’s probably more due to where the code has been placed. Is the child theme still activated?

    Sage

    Thread Starter kietygory

    (@kietygory)

    Sorry Sage. It worked on firefox but nothing was shown on Chrome or Edge. So I changed the child name to not contain any space and capital letters. Now it seems to work in Chrome. That is, what comes out on firefox comes also out in chrome. Does it work from your end now?

    Yup, working in Chrome for me now!

    Thread Starter kietygory

    (@kietygory)

    @sage, the below codes seems to work. It includes ur original suggestion. Not sure why it didnt work before. Guess im new at WP :(. 

    .post-thumbnail img {width: 100%;}
.site {margin: 0;}
.site-content { padding: 0; }
.site-inner {max-width: 100% !important;}

    Caveat: it works only for computer to certain extent. If zoomed extremely in, it revert back to side borders. My iphone 5 small screen still shows side borders.

    Overall, im ok with this solution though. Should we close this topic or is there anything we can do with the caveat?

    Hi Kietygory,

    That’s getting into responsive coding/media queries which gets more technical. Here’s a walkthrough https://www.w3schools.com/css/css_rwd_mediaqueries.asp

    If that doesn’t work for you then I’d suggest you might want to look to hire a web dev so they can get it all sorted for you easier than someone here could as they’d have all of the access.

    If you’re fine with that then it would be great if you wouldn’t mind setting the topic as resolved!

    Thanks,
    Sage

Viewing 5 replies - 16 through 20 (of 20 total)
  • The topic ‘Twenty Sixteen Website title in Header’ is closed to new replies.