1. PROMO Upgrade to Pro Membership @ $99 / Lifetime & access all our 16+ premium Divi extensions: Divi Block, 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

Mobile Header - Make a button sticky

Discussion in 'Basic Support Forum' started by Charles O'Dell, Jan 10, 2019.

  1. Charles O'Dell

    Charles O'Dell New Member
    Divi Ultimate Blog Plugin Divi Ultimate Header Plugin

    I'm using the Divi Help Ultimate Header Plugin and editing the mobile menu #7. I'm trying to figure out how to make a section with only a button in it sticky so that it stays in place even while scrolling.

    Can this be done?

    The website is https://koalakleaning.com. It might be helpful to look at the attached image to see what I mean. I'm referring to the orange "Book Online" within the teal section.

    IMG_D3E678D904E3-2.jpeg
     
    1. PRO MEMBER PERKS Divi Cart Count Plugin - Easily add cart count to your Divi cart icon. 6 different styles to choose from:Learn More
  2. Divi.Help Pro Support

    Divi.Help Pro Support Administrator
    Staff Member

    By default we made the sticky elements to be hidden in mobile. To enable it back, just add the below CSS in Divi > Theme Options > Custom CSS:
    Code:
    Log In or Sign Up to view this code.
    Next, just go to your mobile button section settings > Advanced > CSS Class & add free-sticky
     
  3. Charles O'Dell

    Charles O'Dell New Member
    Divi Ultimate Blog Plugin Divi Ultimate Header Plugin

    Where are the mobile button section settings at?
     
    1. PRO MEMBER PERKS Divi.Help Layout AI Generator - Try the power of AI to generate a custom Divi layout for you:Try Now
  4. Divi.Help Pro Support

    Divi.Help Pro Support Administrator
    Staff Member

    Just saw your site has a different mobile header design than the one you show in the screenshot above. Are you trying to make the 2 mobile buttons stick to the screen while scrolling?

    upload_2019-2-8_22-58-6.png

    For this mobile section, you will need to add a new row & move both the button modules into the new row. Then go to the Row settings > Advanced > CSS Class & add free-sticky free-sticky-no-shadow

    As mentioned previously, you also need to put the below CSS in Divi > Theme Options > Custom CSS:
    Code:
    Log In or Sign Up to view this code.