1. PROMO Subscribe our All Access Pass @ 75% OFF & access all our 16+ premium Divi extensions: Divi Block Pro, Carousel Toolkit, etc.LEARN MORE
Dismiss Notice
NEW Divi.Help Pro Carousel AI Toolkit - Magically turn your Divi design into carousel, simply by using our online toolkit. No plugins needed. Now it works with Divi 5 as well!Try our carousel AI toolkit
BEST Divi Block - A revolutionary drag & drop tool to easily mix & match 960+ premade blocks (Light & Dark) to kick start your Divi site design. Special module designs are included as well. Also newly added AI generator & color. Now it works with Divi 5 as well!
Learn More About Divi BlockFree Version ~ 340+ Free Blocks

Solved Mobile Blog Menu Different From Rest of Website

Discussion in 'Basic Support Forum' started by Stuart Palmer, Apr 27, 2018.

  1. Stuart Palmer

    Stuart Palmer New Member
    Divi Ultimate Child Theme

    Hi,

    I have modified Header version 5 so that it looks different on mobile (< 981px) than on desktop.

    It works good all over the site, including the blog index, but when viewing individual blog posts the visible elements from DU header 5 push up underneath the mobile menu, so the page starts from the wrong place.

    Eg, on mobile it (should) looks like:

    Divi Mobile Menu default
    DU Header module
    Begin page

    But when I view a blog post it goes:

    Divi Mobile Menu default --< ABOVE DU Header module which is still there
    Begin page

    Erm, please advise what could be different on a blog post compared to every other page on the website?

    Something is causing the menu to break on blog posts only.

    Thanks :)
     
    1. PRO MEMBER PERKS Divi Block Pro - Premade rolling text design for your Divi site without using any plugins:View Demo
  2. Divi.Help Pro Support

    Divi.Help Pro Support Administrator
    Staff Member

    Kindly share your link.
     
  3. Stuart Palmer

    Stuart Palmer New Member
    Divi Ultimate Child Theme

    All is good on Desktop, just the mobile menu is broken.

    Thanks :
     
    1. PRO MEMBER PERKS Divi Mini Cart Pro Plugin - Instantly add 3 different types of mini cart to your Divi site:Learn More
  4. Divi.Help Pro Support

    Divi.Help Pro Support Administrator
    Staff Member

    Go to Theme Customizer -> Header & Navigation -> Primary Menu Bar -> Background Color -> Set it to be solid color (opacity = 1)

    See the screenshot below:

    5D5E69F9-E827-47F9-AAC7-EDA844BA5D14.jpeg
     
  5. Stuart Palmer

    Stuart Palmer New Member
    Divi Ultimate Child Theme

    Hi this didn't work, I think maybe I'm not explaining myself.

    The mobile menu has a purple social section that sits just below the main menu (before scrolling).

    When I view an actual blog post, the purple social section is pushed up UNDERNEATH the mobile menu, whereas it should be below it.

    (also, for some reason making just that one change suggested has broken my fixed menu - both the position and the visibility. I changed it back, but it's still broken - I think using the theme customizer has overwritten some settings maybe.)
     
    1. PRO MEMBER PERKS Divi Ultimate Child Theme - Tons of premade layouts & section designs + functionalities for your Divi site:Learn More
  6. Divi.Help Pro Support

    Divi.Help Pro Support Administrator
    Staff Member

    Change the primary menu background color to solid color will solve this issue.

    Can you make the changes & I'll have a look at your said issues?
     
  7. Stuart Palmer

    Stuart Palmer New Member
    Divi Ultimate Child Theme

    Hi, WOW, ok, I apologise, here is what happened:

    I changed the background color and in the theme customizer, the website on the right broke. The social section got huge and distorted and the fixed menu didn't appear. Yesterday I assumed it was broken.

    BUT today I did the same thing, and look in another browser window, and on mobile, and it FIXED it :)

    THANK YOU :)

    Do you know WHY this works?

    (ps, it's weird, the website/menu looks different in theme customizer than live version. But that's ok, I can live with that) thumbs up!
     
    1. PRO MEMBER PERKS Divi Block Pro - Premade slide in bar design for your Divi site without using any plugins:View Demo
  8. Divi.Help Pro Support

    Divi.Help Pro Support Administrator
    Staff Member

    Already removed your link.

    That’s a known issue. Cause Divi menu transparency will cause JS padding issue that conflict with our plugin.
     
  9. Stuart Palmer

    Stuart Palmer New Member
    Divi Ultimate Child Theme

    Hi,

    Is this known issue going to be fixed? If so, who is going to fix it... you or Divi?

    Ps, can the background color of the fixed navigation bar for mobile be set in the theme customizer, or does it need custom CSS? Thanks...
     
    1. PRO MEMBER PERKS Divi Ultimate Blog Plugin - Easily set awesome default design for your Divi single blog page:Learn More
  10. Divi.Help Pro Support

    Divi.Help Pro Support Administrator
    Staff Member

    Not sure whether this is considered as a bug in Divi. It's just how transparency menu works in Divi. And it doesn't work well with injected elements.

    All you need to do is just set the menu background color to be solid & everything will work just fine. There shouldn't be any other issue.

    The navigation bar in mobile uses the default Divi menu. So, you can change the menu background color through Theme Customizer -> Mobile Styles -> Mobile Menu

    upload_2018-5-16_0-47-16.png
     
  11. Stuart Palmer

    Stuart Palmer New Member
    Divi Ultimate Child Theme

    Thank you so much, I can't believe I tried every option apart from the mobile styles. Doh!

    It is a shame we can't have a transparent menu on mobile, but I can live with that.
     
    Divi.Help Pro Support likes this.
    1. PRO MEMBER PERKS Divi Block Pro - Premade floating button design for your Divi site without using any plugins:View Demo