Header reduced quality (Widely theme)

  • Unknown's avatar
    majamalmcrona · Member ·

    Hello my dearest!

    So. I’m having trouble with my header image. My header dimensions are 541 x 1060 – which is perfect and exactly what I would like. However, under the Customize settings it tells me this for my specific theme (Widely):

    “While you can crop images to your liking after clicking Add new image, your theme recommends a header size of 960 × 490 pixels.”

    (It looks like this: https://majaelsas.files.wordpress.com/2015/06/screen-shot-2015-06-09-at-12-15-04.png)

    Therefore, when I upload a 541 x 1060 image, it automatically reduces it to 960 x 490 – and then enlarges it back again to 541 x 1060. This is causing a massive drop in the quality of my header image!

    And I have absolutely no clue how to solve this. :) Because you guys are geniuses, does anyone know what do to?

    Thank you so much in advance!

    Maja

    The blog I need help with is: (visible only to logged in users)

  • Unknown's avatar
    thesacredpath · Member ·

    When you go to insert your larger header image, when you come to the crop phase, are you grabbing the crop handles and pulling those so that the entire image is inside the crop area?

  • Unknown's avatar
    thesacredpath · Member ·

    Give this a try. It hides the existing image and then adds the 541px tall image to #masthead and I’ve then done a display: block; on the overlay link so that the new image is clickable as a header image. 

    .site-header {
    height: 100%;
    max-height: 681px;
}
#masthead {
    background: transparent url("https://majaelsas.files.wordpress.com/2015/06/2015-06-01-header.jpg") no-repeat scroll center 45px;
}
.custom-header img {
    visibility: hidden;
}
.custom-header a {
    display: block;
}
  • Unknown's avatar
    majamalmcrona · Member ·

    Biiiiiiig difference! Thank you thank you thank you dear, you are brilliant! :)

  • The topic ‘Header reduced quality (Widely theme)’ is closed to new replies.