Home › Forums › Feature Requests › "Move content editor to here" Field Type
Rather than creating a message field and then creating jQuery code to move #postdivrich to that message field. Just create a new Field Type that does this automatically.
Why?
1. Its a common need that was worthy of a tutorial: https://www.advancedcustomfields.com/resources/moving-wp-elements-content-editor-within-acf-fields/
2. When you’re creating a new page and you select the appropriate page template, the content editor doesn’t display where it should. Instead of moving that #postdivrich on page load, it needs to move on template change. If displaying that content editor in a specific position is based on some condition (like template change) — that’s when it should be appended.
Hi @charles9
If you want, you can always create your own field type to do what you want. This page should give you more idea about it: https://www.advancedcustomfields.com/resources/creating-a-new-field-type/.
Thanks 🙂
I already gave it a whirl. The problem is getting the content editor to jump around each time you change the layout/template. Things have to happen when the ACF fields are lazy loaded.
Hi @charles9
If you want to move it on template change, I believe you can try this code:
add_action('acf/input/admin_head', 'my_acf_admin_head');
function my_acf_admin_head() {
?>
<script type="text/javascript">
(function($) {
$(document).ready(function(){
// Do it when the page load
if( $("select#page_template").val() == "page-template-test.php" ){
// move to the message field
$('.acf-field-56d98ab4fdfde .acf-input').append( $('#postdivrich') );
} else {
// move back to the default place
$('#post-body-content').append( $('#postdivrich') );
}
// Do it when the template is changed
$(document).on("change", "select#page_template", function(){
if( $("select#page_template").val() == "page-template-test.php" ){
$('.acf-field-56d98ab4fdfde .acf-input').append( $('#postdivrich') );
} else {
$('#post-body-content').append( $('#postdivrich') );
}
});
});
})(jQuery);
</script>
<style type="text/css">
.acf-field #wp-content-editor-tools {
background: transparent;
padding-top: 0;
}
</style>
<?php
}
If that is not what you want, could you please share some screenshots of the issue and explain it again?
Thanks 🙂
The idea/spirit of this code works but, in actuality, it does not work when you first click page > add new and switch to a new template. This is because, the fields are not there as soon as you fire the .on change (it takes a second).
When that .on change event tries to append the #postdivrich, the message placholder has not yet been lazy loaded onto the page. See what I mean?
The trigger needs to happen _after_ the acf field group is loaded onto the page — NOT after the #page_template select changes.
BTW, my first crack at this was almost exactly the same code you just posted. This is why I suggested making it a feature. What we really need access to is code that fires after the fields are loaded.
Hi @charles9
I’m afraid I couldn’t reproduce the issue on my end. Would it be possible for you to create a screen recording of it?
If you want the script to be executed after the fields are loaded, I believe you can change this line:
$(document).ready(function(){
To this one:
acf.add_action('load', function( $el ){
This page should give you more idea about it: https://www.advancedcustomfields.com/resources/adding-custom-javascript-fields/. You can also try to use acf/input/admin_footer
instead of acf/input/admin_head
.
Thanks 🙂
I replied with a screen recording to the support email thread. Thanks again.
The topic ‘"Move content editor to here" Field Type’ is closed to new replies.
Welcome to the Advanced Custom Fields community forum.
Browse through ideas, snippets of code, questions and answers between fellow ACF users
Helping others is a great way to earn karma, gain badges and help ACF development!
We use cookies to offer you a better browsing experience, analyze site traffic and personalize content. Read about how we use cookies and how you can control them in our Privacy Policy. If you continue to use this site, you consent to our use of cookies.