Double Search Bar in Mobile Menu

  • Unknown's avatar
    sarahwebgcas · Member ·

    Can someone help me figure out how to get rid of the double search bar symbols in the mobile menu? I cannot see it in the backend, so not exactly sure where to find it. Thanks in advance!

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

  • Unknown's avatar
    sarahwebgcas · Member ·

    I made this image smaller, because it was to compressed on the mobile version, but now it is too small on desktop. Can someone please help me with how too make the image more responsive and have the correct sizing on both? Thanks in advance!

  • Unknown's avatar
    yvonnepanganiban · Member ·

    Hi Sarah, you can add the following CSS code to your website’s stylesheet:

    .your-image {
    width: 100%;
    height: auto!important;
    }

    This CSS code instructs the image to take up the full width of its container and maintain its aspect ratio (height) as the width changes. The !important declaration ensures that this rule takes precedence over other conflicting styles.

    By setting the width to 100%, the image will automatically adjust its size according to the width of the device it’s being displayed on. This way, the image will be appropriately sized on both mobile and desktop screens without the need for manual compression or resizing.

    With this CSS in place, the image should now be responsive and correctly sized on all devices. It will maintain its aspect ratio, avoiding any distortion, and will adjust to fit the screen size of different devices accordingly.

    If you have any more questions or need further assistance, feel free to ask. Good luck with your website!

    Best,
    Yvonne

  • Unknown's avatar
    yvonnepanganiban · Member ·

    Check this out!

  • Unknown's avatar
    sarahwebgcas · Member ·

    I am using the responsive menu plugin for wordpress since the mobile menu for my theme has a chaotic menu. But the menu does not give the correct page name for ‘GCAS Links’ – it is supposed to be “GCAS Branches” – and I do not know how to change this in the plugin. There are also no options to add drop down menus for each parent page on the menu. If anyone has any advice on how to change this, it would be greatly appreciated. Thank you!

  • Unknown's avatar
    sarahwebgcas · Member ·

    I am using the responsive menu plugin for wordpress since the mobile menu for my theme has a chaotic menu. But now both the plugin hamburger menu and the original “Menu” button both show up. I want to hide the desktop menu on the mobile, and just have the hamburger menu, but I cannot figure out how to do this. If you can provide any assistance that would be very appreciated! Thanks in advance!

  • staff-totoro · Staff ·

    Hi there, I have merged your duplicate requests into a single thread so that you do not get multiple answers from staff. In the future please avoid duplicate posts, as it makes it more difficult for us to help in a timely fashion (and also confuses the heck out of us!)

    Thanks!

    I want to hide the desktop menu on the mobile, and just have the hamburger menu, but I cannot figure out how to do this. If you can provide any assistance that would be very appreciated!

    Sure, here’s a modified CSS using a media query that will only apply to devices with a screen size of 600px or less:

    @media screen and (max-width: 600px) {
    nav.wp-block-navigation {
        display: none;
    }
}

    This instructs the browser to only display the “menu” option if the device’s screen width is 600px or less.

    Hope that helps. Please let us know if you have any more questions.



  • The topic ‘Double Search Bar in Mobile Menu’ is closed to new replies.