1. HOT Add more varieties for your Divi header (12 premade styles): https://header.diviultimate.com/
NEW Divi Block - Online drag & drop tool to easily mix & match 320+ premade Divi blocks (light / dark version), including custom header, fullscreen / slide in mobile menu, footer, etc. We also added NEW special module designs, such as Before & After Image Slider, Masonry Gallery, Promo Bar, Logo Carousel, etc.Try Free Version

How to make Divi text module editor toolbar sticky?

Discussion in 'Divi Tutorials' started by Divi.Help, Jul 11, 2021.

  1. Divi.Help

    Divi.Help Administrator
    Staff Member

    If you have a long content in the text module settings, it would be troublesome for you to scroll up & down to access the text editor toolbar.

    But here's a simple CSS solution to solve the issue.

    Just paste the below CSS in Divi > Theme Options > Custom CSS:
    Code:
    .mce-top-part {
        position: sticky!important;
        top: -60px;
    }
    upload_2021-7-11_16-25-44.png

    The above solution works for Visual Builder, but not backend builder.

    For backend builder, you will need to paste the below code in your child theme functions.php:
    Code:
    add_action('admin_head', 'divi_help_wp_admin_css');
    function divi_help_wp_admin_css(){
        echo '<style>
            .mce-top-part {
                position: sticky!important;
                top: -60px;
            }
        </style>';
    }
    That's all. Hope you enjoy it.
     
    1. AD Robust and extremely customizable carousel module for Divi:Learn More
  2. wpatters1229

    wpatters1229 New Member

    OK will give this a try...BUT why doesn't Divi put this into the product instead of having to do CSS on everysite we work on? Hope they decide to update the module.
     
  3. wpatters1229

    wpatters1229 New Member

    OK the front end css works but not the backend. Would not make the change. Gave me an error. Now I was making the change in the Divi code direct rather than a child theme. Would that make a difference? It shouldn't. It was in the function.php page at the end.
     
    1. AD Set awesome default design for your Divi single blog page:Learn More
  4. Divi.Help

    Divi.Help Administrator
    Staff Member

    You may suggest it to official Divi support at: https://elegantthemes.com/members-area/help
    You can do that as well. I just tested the code in the parent theme functions.php & it works. What error you're seeing?
     
  5. wpatters1229

    wpatters1229 New Member

    This is the error message "Scrape nonce check failed. Please try again." Never seen this before ???
     
    1. AD Bring color & gradient overlays to your parallax & video backgrounds in Divi:Learn More
  6. wpatters1229

    wpatters1229 New Member

    I tried deactivating all the plugins as I read that the SG Optimizer can cause this...no fix. Maybe the code is wrong? Here is the code I used:

    add_action('admin_head', 'divi_help_wp_admin_css');
    function divi_help_wp_admin_css(){
    echo '<style>
    .mce-top-part {
    position: sticky!important;
    top: -60px;
    }
    </style>';
    }
     
  7. Divi.Help

    Divi.Help Administrator
    Staff Member

    Try to use FTP instead to edit it.
     
    1. AD The ultimate Divi responsive toolkit to make your website look and function great on all devices:Learn More
  8. wpatters1229

    wpatters1229 New Member

    YES that did it. I just went to file manager and added the code at the top of the file under the php notation and it works fine. Must have been something in the theme or the hosting. Works now in both the front end and back.
    Cheers!! Now if Divi will add this to the main theme and text module. It should be standard as many pages have long text content.