Home › Forums › WoodMart support forum › Header & Mobile Menu problem

Header & Mobile Menu problem

Viewing 22 posts - 1 through 22 (of 22 total)
  • Author
    Posts
  • March 15, 2023 at 4:48 pm #451446

    sharonrees
    Participant

    Hi,

    Since I updated my theme to the latest version (7.1.4). I am having some issues with the header and mobile menu.

    1. When on my homepage, if you click the mobile menu, the page content jumps up the page, causing some of the content to be hidden behind the header.

    2. When on a product page, the top product image and part of the thumbnails are hidden behind the header.

    I also had to add some custom css to the telephone number and email address icons in the header as the update caused them to become misaligned and I couldn’t rectify this in the header settings.

    I have tried disabling all the plugins on my site and it doesn’t seem to be any of those that are causing an issue.

    Please could you help with this?

    March 15, 2023 at 5:34 pm #451457

    sharonrees
    Participant

    Also, i’ve noticed if you view my site on Firefox there is a big gap in the header.

    And i think these issues are on most pages, not just the homepage.

    The mobile menu seems to randomly stop working as well.

    March 16, 2023 at 10:46 am #451621

    Aizaz Imtiaz Awan
    Keymaster

    Hello,

    Sorry to say but your provided WP-ADMIN Login details aren’t working for the Staging Site. Can you please share valid WP-ADMIN Login details of your Site so that we can proceed further and check the issue on your Site and assist you accordingly.

    Also, please share some Screenshots of the mentioned issue too for better understanding.

    Best Regards.

    March 16, 2023 at 12:15 pm #451665

    sharonrees
    Participant

    Hi Aizaz,

    Thank you for your reply.

    Sorry, please see updated login details below.

    I’ve now realised that the mobile menu issue was caused by WP Rocket.

    But the issue with the page contents moving up is still there. Its seems that any interaction with the page causes it to move up under the header. Not just clicking on the menu.

    March 16, 2023 at 4:10 pm #451761

    Aizaz Imtiaz Awan
    Keymaster

    Hello,

    We have applied the following Custom CSS on your Site to adjust the content hiding concern on the mentioned pages:

    .home .main-page-wrapper {
    padding-top: 8.8em;
}

.main-page-wrapper {
    padding-top: 8em;
}

    Location to find Custom CSS, go to Dashboard >> Theme Settings >> Custom CSS >> Custom CSS for mobile section >> there you can find the CSS pasted.

    Please check back your Site after completely clearing the browser and server cache.

    Best Regards.

    March 16, 2023 at 4:22 pm #451766

    sharonrees
    Participant

    Thank you, that’s great.

    However, there is still a layout shift. When the page loads there is a white space at the top (under the header) Which then disappears when you interact with the page.

    Could we figure out what is causing this layout shift?

    March 17, 2023 at 10:45 am #451992

    Aizaz Imtiaz Awan
    Keymaster

    Hello,

    It seems to be quite odd because we have checked and compared this from our Test Site too but there isn’t such an issue happening. It could be the Cache issue we suppose regarding space appearing after loading and gets hidden when scrolled down.

    So, could you please check back your Site after completely clearing the browser and server cache.

    Best Regards.

    March 17, 2023 at 2:45 pm #452077

    sharonrees
    Participant

    Hi,

    I have cleared the cache using Cloudflare and WP Rocket and I am stilling seeing the layout shift on a mobile. I have tested this on a couple of different phones.

    Also if you inspect the site in Google Chrome and switch to mobile you can see it happening there.

    Let me know if you are able to replicate this your end?

    March 20, 2023 at 11:12 am #452542

    Aizaz Imtiaz Awan
    Keymaster

    Hello,

    Sorry for the late reply but now your given logins are not working any more. Please share the correct login details of your site so I will check and solve the issue.

    Best Regards.

    March 20, 2023 at 12:03 pm #452574

    sharonrees
    Participant

    Hi,

    I haven’t made any changes to the login, please could you try again? It was the second one I provided that will work for you. I’ve attached it below again.

    Thank you

    March 20, 2023 at 4:48 pm #452703

    Artem Temos
    Keymaster

    Hello,

    As we can see, the issue is caused by some custom CSS in Theme Settings and child theme. Please, remove all the custom CSS temporarily so we can see how it works.

    Kind Regards

    March 20, 2023 at 5:06 pm #452709

    sharonrees
    Participant

    Hi,

    I’ve removed all the custom css from the staging site for you now.

    March 20, 2023 at 5:19 pm #452713

    Artem Temos
    Keymaster

    We still see custom CSS in the child theme’s style.css file. Please, remove it also.

    March 20, 2023 at 5:34 pm #452718

    sharonrees
    Participant

    I’m not sure what you are referring to. If you can see it, I’m happy for you to remove it. Assuming that you are on the staging site?

    March 20, 2023 at 6:48 pm #452750

    Artem Temos
    Keymaster

    We are talking about this file https://staging8.avrmobiles.co.uk/wp-content/themes/woodmart-child/style.css
    Please, update the theme to the latest version also.

    Thank you.

    March 20, 2023 at 10:11 pm #452801

    sharonrees
    Participant

    Ok I’ve removed all the child css now and the theme is up to date.

    March 21, 2023 at 10:27 am #452902

    Artem Temos
    Keymaster

    As we can see, this file is still full of CSS code that affects the header view. Here is a screenshot https://gyazo.com/d5bdb0a85eeed94d4b2eb12d8892d569

    March 21, 2023 at 1:59 pm #453024

    sharonrees
    Participant

    Hi, I’ve cleared the cache, it should be gone now.

    March 21, 2023 at 3:00 pm #453049

    Artem Temos
    Keymaster

    No, unfortunately, it is still there. Please, check this link https://staging8.avrmobiles.co.uk/wp-content/themes/woodmart-child/style.css?v6&ver=6.1.1

    March 21, 2023 at 3:21 pm #453055

    sharonrees
    Participant

    If I remove the header part of that css file it brings up this error:
    This theme is broken. Template is missing. Standalone themes need to have a templates/index.html or index.php template file. Child themes need to have a Template header in the style.css stylesheet.

    March 21, 2023 at 8:14 pm #453161

    sharonrees
    Participant

    Hi, I think I’ve sorted it now. I’ve removed any css from the child theme relating to the header and it seems to be ok now.

    March 22, 2023 at 10:22 am #453267

    Artem Temos
    Keymaster

    Hello,

    OK, we are glad that you sorted it out. Feel free to contact us if you have any further questions.

    Kind Regards

  • Author
    Posts
Viewing 22 posts - 1 through 22 (of 22 total)