Header Image crops in twentyfourteen

  • I’m trying to make a new site accommodate a 1440 resolution and running into a problem with the header image. I made sure the image is 1440×240 but when I upload it it only gives to option to “crop and publish” When I use firebug to look at the page code it shows the dimensions for the cropped image (1260×240) instead of the full width that I need.

    When I browse the table in the database it shows it is directing the page to use “cropped-logo_wide.jpg” instead of “wide_logo.jpg” which is the file I wanted to use. Any way to overcome this? I thought about just changing the name in the table but I’m not sure how that will affect things.

Viewing 5 replies - 1 through 5 (of 5 total)

  • Do not edit the Twenty Fourteen theme. It is the current default WordPress theme and having access to an original, unedited, copy of the theme is vital in many situations. First create a child theme for your changes. Or install a custom CSS plugin.

    Thread Starter Pvteyez

    (@pvteyez)

    I am working in a child theme. I’ll try a custom css plugin an see if that helps.

    If you have a child theme, you do not need a custom CSS plugin. You an add your new CSS to your child theme’s stylesheet. Try using Firefox with the Firebug add-on for this kind of CSS troubleshooting. Or use whatever developer tool is available in your web browser.

    Thread Starter Pvteyez

    (@pvteyez)

    Firebug is how I found the problem. Originally I had a thick whit line down the right side of the screen when I looked at it on my laptop (1440×900).

    I got around that by changing the child style.css ad adjusting .site max-width to 1440 and ,header max-width to 1440.

    That took care of everything except the header image was still about an inch short of the right side of the screen so I resized the image to 1440×240 and uploaded it.

    The problem I have now is that when I upload the new header image it ONLY gives me the option to crop and publish which shortens the imaged back down to a width of 1260px before using it. I need it to use the full length of the image to fill the screen.

    I can make the change in firebug and it corrects it on the screen but of course only as long as I’m still looking at it. I’m trying to figure out how to make wordpress use the original image I uploaded instead of it’s own “cropped” version.

    I had the very same problem. Tried updating my style.css without any success at all. Still, there is a way to solve your problem.

    The key to your problem is not within the style.css (though I still assume you have to change the header width there as well), but lies in \inc\custom-header.php. Simply search for the current width (1260) and change it to your desired width. This way your header will only be cropped down to your now altered header width.

    Worked for me.

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘Header Image crops in twentyfourteen’ is closed to new replies.