ACF PRO Stock Content Editor (WYSIWYG) Move

• rpetersnmt

• April 11, 2016 at 7:34 am

Hey all…

I previously implemented a move of the stock WP Content Editor so that it worked inside a tabbed layout for a custom post type. This worked flawlessly until ACF PRO 5.3.6.1 – now it is busted up.

Largely this followed the concepts documented here:

https://www.advancedcustomfields.com/resources/moving-wp-elements-content-editor-within-acf-fields/

Has anyone else found that a move like this is broken in the latest versions of ACF? Or, can anyone from ACF confirm if this documentation is no longer valid? I’m struggling to put this back together and hoping for a hint/etc. I’m also happy to revert back (already have) and wait for a bugfix, just trying to decide where to spend my time troubleshooting here.

Any advice would be greatly appreciated.

Thx, Ross

• James

• April 11, 2016 at 10:15 am

Hi @rpetersnmt

I’ve just tested it on version 5.3.7, and it was working as it should be. Please make sure that there’s no conflict in your site by deactivating your plugins except ACF and changing your theme to one of the WordPress stock themes like Twenty Sixteen.

Also, please make sure that you used the right jQuery selector. Please change the selector from “.acf-field-54cf2c4fcfbfe” to the one you have on your editor page.

Thanks!

• rpetersnmt

• April 12, 2016 at 12:24 am

Thanks for hopping in here James. I was able to solve my issue after taking a new route re moving the content around. I very much appreciate the follow-up here.

Thx!

• James

• April 12, 2016 at 4:59 am

Hi @rpetersnmt

I am glad you were able to solve the problem.

Feel free to let me know in case something else comes up 🙂

• Traipler

• October 27, 2016 at 8:05 pm

Great tip!
Why don’t set an ID or a CLASS for the MESSAGE element so you can use a generic function like ?

//wp_content_editor is the id of the message acf field
(function($) {

    $(document).ready(function() {
        if ($("#wp_content_editor").length > 0) {
            $('#wp_content_editor .acf-input').append($('#postdivrich'));
            $(".acf-field #wp-content-editor-tools").css({
                background: "transparent",
                "padding-top": 0
            })
        }
    });

})(jQuery);

I’m using this and works good,
I only sometimes got a js error with the
yoast-premium-social-preview-370.min.js?ver=3.7.2:1

but everything seems working good