Header Image not responsive

Home Forums WordPress Themes – Premium Pure & Simple Header Image not responsive

Viewing 15 posts - 1 through 15 (of 16 total)
  • Author
    Posts
  • #17275
    Anonymous
    Inactive

    Hi

    I have different images in the header of the index page and other pages on the Pure and Simple theme, but the image reduces in width but keeps the same height when viewed on different platforms, I’ve tried taking 100% off the height but the header doesn’t fit then, could you tell me how to fix this please.

    Thanks

    #22779
    Binaya D
    Participant

    Hi Dominic,

    Could you please mention the link of your site also, so that it will be easy to both of us to find the solution asap. But if you have kept the header image as background image then please remove it and please follow the following steps:

    Go to Dashboard => Appearance => Widgets => Banner => Keep the text widget inside the banner widget and keep the image like this

    => Then save it

    We hope this will be helpful to you, if not then please let us know.

    Thanks

    #22780
    Anonymous
    Inactive

    Hi

    Sorry here is the link http://www.shamblestochic.com.au/Test/

    #22781
    Binaya D
    Participant

    Hi Dominic,

    We visit your site and it seems that both image are responsive, so could you please check once.

    NOTE: It seems that you are using the outdated version of the theme, so we request you to update your theme and please make a backup before you processed.

    Thanks

    #22782
    Anonymous
    Inactive

    Hi

    Thanks for your answer, the ‘Banner’ is responsive but it’s the ‘Header’ that gets squashed, please see attached

    Thanks
    Squashed-Header.jpg

    Attachments:
    You must be logged in to view attached files.
    #22783
    Binaya D
    Participant

    Hi Dominic,

    As it is background image it is responsive, due to the responsiveness the image has been compressed and if you remove the responsiveness then your image can be cut off in mobile and tablets. And we have kept the code like this to make it responsive

    .header-bg {
        background-size: 100% 100%;
    }

    And if you reduce or remove the code then you image looks like the attached image. We hope you understand.

    Thanks

    Services.png

    Attachments:
    You must be logged in to view attached files.
    #22784
    Anonymous
    Inactive

    Thanks

    I’ll have a re-think, thanks for your help

    #22785
    Binaya D
    Participant

    Hi Dominic,

    You’re welcome! 🙂 Feel free to send us your queries whenever you need help. Have a nice day!

    Thanks

    #22841
    John Maberry
    Participant

    I have the same or a similar problem with the header being responsive in width but not in height. That’s not really responsive. I know this can be fixed because I have another blog site using the WordPress 2014 theme and the header is responsive both in height and width. The image should not wind up cut up like your illustration nor squished like Dominic’s. here is a link to my 2014 theme site illustrating how the header background should work. Resize the screen and you will see this. Please fix this in Pure & Simple.

    #22844
    Binaya D
    Participant

    Hi John,

    It seems that you haven’t check it well in WordPress 2014 theme that header image is not background image you can check in the attached image and you can check the image of your site also what’s the differences between there is and as per the 2014 theme you have banner image is same as header image of 2014. We hope you understand, if not then please let us know.

    Thanks

    http://prntscr.com/b021pn
    http://prntscr.com/b022yg
    http://prntscr.com/b023gq

    #22848
    John Maberry
    Participant

    I’m not an expert on html coding so I am having some difficulty making sense of the screenshots showing inspect element. What I did to customize the header is to upload an image on the “Customizing Header Image” menu. The image IS there but when I do a “visit site” and inspect elements I see no href to the image source. I don’t know if that’s part of the problem or not. So no, I don’t understand.

    I also left an online message about deleting the container for the site title and tagline. Making it invisible/transparent could work as well. Other than that, moving it to the upper left of the header rather than the center would be great. The response I received from Madan Karki identified the theme header and logo-group.php as places to edit but didn’t explain how to do this. Can you offer any help with that?

    By the way, the child theme in the download folder doesn’t have anything other than the theme functions php and the stylesheet. Child Theme Configurator produces anomalous results copying the rest to the child. Do I need to copy and load the rest into the child theme to make it possible to edit them (assuming I can learn what I am doing).

    #22849
    Binaya D
    Participant

    Hi John,

    Could you please provide us your WP-login details of your site via mail, so that we could fix this issue. We hope you understand.

    We look forward to your respond.

    Thanks

    Email Address: [email protected]

    #23004
    Anonymous
    Inactive

    Hi

    With regards to the Header retaining height but squashing in width, I finally solved the problem by going to ‘Site Identity’ section and in the ‘Header Height and Padding” section, put 25% 0 0 0 and the header reduces proportionally.

    Hope this helps someone

    #23005
    Binaya D
    Participant

    Hi Dominic,

    Thanks for the solution, we hope this will be helpful to other also and we really appreciated for your help.

    Thanks

    #17276
    John Maberry
    Participant

    Wish it did, but it doesn’t work on my site. It seems to work partially, but the problem is still the integration of the container with the site title/tagline with the background image. They just don’t play nice together.

Viewing 15 posts - 1 through 15 (of 16 total)
  • You must be logged in to reply to this topic.