Support » Theme: NS Minimal » Unresponsive Header for Mobile Use

Viewing 11 replies - 1 through 11 (of 11 total)
  • Theme Author Nuno Sarmento

    (@nunosarmento)

    Hi @jodie777

    Thank you very much for using my theme.

    It is loading on mobile you just need to close the “newsletter” popup you have installed on your WordPress, please see screenshot url below. I can see you are not following the logo instructions (width + height) therefore you will find some styling issues.
    https://share.getcloudapp.com/ApuAoxgW

    The font is nunito-sans https://fonts.google.com/specimen/Nunito+Sans – you will need someone with css knowledge to change the font type or probably there is some plugin that may change the font type for you.

    Best,
    Nuno

    Theme Author Nuno Sarmento

    (@nunosarmento)

    You could probably tweak the style with this code below – add the code below to Themes -> Appearance -> Custom CSS :

    @media only screen and (max-width: 600px) {
    .hamburger-box {
    margin-top: 33px;
    }
    }

    Hi,
    thanks for your response.
    What is the custom CSS meant to change sorry?
    I don’t notice any difference.
    I have changed the blog title image to a header instead of a logo, with the recommended dimensions.
    And I think have removed the subscribe pop-up from the top of the screen.

    Now the only difference on mobile is that the blank space at the top isn’t quite as large as it was before.
    Any thoughts?
    https://share.getcloudapp.com/DOuAyqyq

    Theme Author Nuno Sarmento

    (@nunosarmento)

    Hi,

    You can’t see the image because you are not using a png file for your logo/header. The file is converted to webp and webp files wont work. Most probably you are using optimisation plugins such jetpack or any other for images. Turn off your plugins and try again.

    Hi, I can confirm my header is a png, that is how I exported it from Adobe Illustrator.
    I have also deactivated Jetpack and any plugins I could find that mentioned optimisation or images.
    Have you got any other suggestions?
    Sorry, I just can’t get this problem to go away.

    Theme Author Nuno Sarmento

    (@nunosarmento)

    it is png but because you are using optimisation plugins it is converted to the webp, did you turn off the plugins and try again ?

    Please see screenshot attached:
    https://share.getcloudapp.com/12uN8oeD

    Try to save your image from the link below and you will see what extension comes:
    http://www.everydayimbuffering.co.uk/wp-content/uploads/2020/07/cropped-header2-1.png

    Theme Author Nuno Sarmento

    (@nunosarmento)

    Site Kit by Google plugin is not disable, I can see it. Disable ALL plugins and try again.

    thank you for this. If I disable all plug-ins will I have this problem in the future if I re-activate them?
    I have now managed to get the header visible on mobile, so thanks for this.
    My only issue now is that the image is cropped.
    Is this easily fixed?
    https://share.getcloudapp.com/JruLBx4e

    Theme Author Nuno Sarmento

    (@nunosarmento)

    You need to activate one by one and see which one is causing the issue, I believe is the Site Kit by Google plugin but I could be wrong.

    To fix the crop image on mobile do the follow.
    Go to Themes -> Appearance -> Custom CSS and add the code below:

    @media only screen and (max-width: 600px) {
    .header-image {
    height: 45px !important;
    }
    }

    This should fix your crop image. if you are happy with theme please don’t forget to leave a theme review 🙂 x

    This is perfect…thank you so much!
    I will leave a theme review for you no worries x

    Theme Author Nuno Sarmento

    (@nunosarmento)

    Thank you.

Viewing 11 replies - 1 through 11 (of 11 total)
  • You must be logged in to reply to this topic.