• Resolved leonardwoolf

    (@leonardwoolf)


    Hello,

    Just having a few menu issues: http://www.mrwoolf.com.au

    Desktop and mobile: trying to move menu text to the right (less padding), it reflects in the backend, however, doesn’t save when updated

    Desktop: when each menu item is clicked a black line appears across the menu

    Mobile: The white background cuts off halfway across the screen (it used to be full screen on mobile) and as a result cuts off some of the menu text

    Thanks in advance.

    Leonard

    The page I need help with: [log in to see the link]

Viewing 12 replies - 1 through 12 (of 12 total)
  • Hi Leonard,

    Please check the below-given points regarding your issues.

    1. Desktop and mobile: trying to move menu text to the right (less padding)

    Ans: Menu text is now appearing on the right, looks like the cache issue I request you to please clear the cache and then check.

    Screenshot: https://nimb.ws/Y43P8v

    2. Desktop: when each menu item is clicked a black line appears across the menu.

    Ans: Please add the below-given CSS code in the additional CSS section of the WordPress customizer and then check. Let me know if you need more help.

    #rmp-menu-wrap-8002 .rmp-menu-item-link {
    border-bottom: none !important;
    }

    3. Mobile: The white background cuts off halfway across the screen (it used to be full screen on mobile) and as a result cuts off some of the menu text

    Ans: If you are talking about menu container width, then you can increase or decrease the menu container width under Mobile menu-> Container-> Appearance-> width.

    Please let me know if you need more help.

    Regards,
    Sumit

    Thread Starter leonardwoolf

    (@leonardwoolf)

    Hi Sumit.

    Appreciate you helping out with this.

    The screenshot is the current position, however, I would like to reduce the padding even more, so the text sits directly under the X.

    Thank you. The code corrected the issue with the black line.

    Increasing the menu container also worked, however, it also affects the desktop view. Is there an option to go full width for mobile and 50% for desktop?

    Thanks in advance.

    Leonard

    Hi Leonard,

    Please check the below-given points regarding your issues.

    1. The screenshot is in the current position, however, I would like to reduce the padding even more, so the text sits directly under the X.

    Ans: Please add the below-given CSS code in the additional CSS section of the WordPress customizer and then check. Let me know if you need more help.

    #rmp-menu-wrap-8002 .rmp-menu-item-link {
    padding-right: 20px !important;
    }

    2. Increasing the menu container also worked, however, it also affects the desktop view. Is there an option to go full width for mobile and 50% for desktop?

    Ans: You can fix the desktop view using the below-given custom CSS code. Please add the below-given CSS code in the additional CSS section of the WordPress customizer and then check.

    @media only screen and (min-width: 768px) {
    #rmp-container-8002{
    width: 50% !important;
    }
    }

    Let me know if you need more help.

    Regards,
    Sumit

    Thread Starter leonardwoolf

    (@leonardwoolf)

    Hi Sumit,

    The code was successful. Thank you for being so helpful.

    I have another issue I’m trying to fix with Divi/Wordpress that you may be able to help with, however, I understand if this is not your area of expertise.

    See below:

    An issue with the accordion section on my site.

    The + and – icons appear bolder on iPhone. Desktop and android are fine. Please see attached screenshots.

    Desktop: https://mrwoolf.com.au/level-2-delta-meditation-mindfulness/ (is good)

    Android: https://snipboard.io/ygGvoR.jpg (is good)

    iPhone: https://snipboard.io/9hDT4F.jpg (+ – icons are bolder)

    It may be an issue with the font not being compatible with iPhone mobile browser, but I’m not sure.

    Let me know your thoughts or if you can help.

    Thanks in advance,

    Leonard`

    Hi Leonard,

    We are here to provide support only for RM only.

    Let me know if you need more help related to RM.

    Regards,
    Sumit

    Thread Starter leonardwoolf

    (@leonardwoolf)

    Thank you. I understand. I thought I’d ask since you are a good coder and the developers I have spoken to are not able to fix the issue.

    For further help with RM.

    How to create different font sizes for desktop and mobile. Currently desktop is 28px and I would like to set mobile to 25px.

    Thanks,

    Leonard

    Hi Leonard,

    You can change the font size from this location as per the selected devices.

    Please edit the menu and go to this location Menu Styling > Item Styling > Typography > Font Size.

    https://nimb.ws/1hBbpF

    Let me know if you need more help.

    Regards,
    Sumit

    Thread Starter leonardwoolf

    (@leonardwoolf)

    Hi Sumit,

    I have tried this option, however, when saved/updated the font size reverts back to the same on all devices. It doesn’t allow me to select and save a different font size for each device.

    Thank you.

    Leonard

    Hi Leonard,

    Can you please share the screencast with us so we can check for the issue?

    Regards,
    Sumit

    Thread Starter leonardwoolf

    (@leonardwoolf)

    Hi Sumit,

    Please see attached screenshots ( I think that is what you mean by screencast).

    Desktop set at 28px
    https://snipboard.io/XDVOia.jpg

    Mobile set at 25px
    https://snipboard.io/rBpTES.jpg

    When saved it only updates one size across all devices and doesn’t save the different sizes.

    Thank you,

    Leonard

    Hi Leonard,

    We have tried to replicate your issue on our staging website with a WordPress default theme, but we are unable to replicate it, as it is working properly.

    In this case, we suspect it could be an issue with your theme or plugin. Please check whether it is a conflict with your theme or plugin by using the below-given link.

    https://en-gb.wordpress.org/plugins/health-check/

    For a temporary fix, you can use the below-given custom CSS code. Please add the below-given CSS code in the additional CSS section of the WordPress customizer and then check.

    @media only screen and (max-width: 600px) {
    #rmp-menu-wrap-8002 .rmp-menu-item-link {
    font-size: 25px !important;
    }
    }

    Regards,
    Sumit

    Thread Starter leonardwoolf

    (@leonardwoolf)

    Hi Sumit,

    I have uploaded the Health Check plugin and the site health is good with no critical issues.

    The code provided was successful. Thank you.

    Thank you so much for your help this week.

    Leonard

Viewing 12 replies - 1 through 12 (of 12 total)
  • The topic ‘Responsive Menu Support / Menu Issues’ is closed to new replies.