Allow fields to be placed above the Gutenberg content area (below title)

[NewJenk]

On the classic editor you can choose if fields are displayed above or below the TinyMCE editor, would be great if this behaviour was retained in Gutenberg, so fields could be displayed below the main content or below the title.

[elliotcondon]

Hi @NewJenk

Thanks for the request. This is definitely something on our list and I hope we can find a way to add this in. Unfortunately, the new Gutenberg Editor does not provide a "after_title" action for use to inject the metaboxes above the "blocks" area.

[chakmear]

Hi, for all that are desperatly looking for a way to get some fix acf-fields above the content area...like me :D I managed it by some custom CSS and JS in WP Admin... not sure if that is a lasting solution but it works for WP 5.x...

Custom Admin CSS:

.edit-post-meta-boxes-area {
  position: initial !important;
}
#acf-group_IDOFYOURACFGROUP {
  position: absolute;
  top: 0;
  width: 100%;
}

Custom Admin JS:

function rafAsync() {
  return new Promise(resolve => {
      requestAnimationFrame(resolve);
  });
}

function checkElement(selector) {
  if (document.querySelector(selector) === null) {
      return rafAsync().then(() => checkElement(selector));
  } else {
    return Promise.resolve(true);
  }
}

function checkElementHeight(selector) {
  if (document.querySelector(selector).offsetHeight > 0) {
    return Promise.resolve(true);
  } else {
    return rafAsync().then(() => checkElementHeight(selector));
  }
}
//Have to wait until elements are in place and built
checkElement('#acf-group_IDOFYOURACFGROUP') //use whichever selector you want
.then((element) => {
  checkElementHeight('#acf-group_IDOFYOURACFGROUP')
  .then((element) => {
    checkElement('.edit-post-visual-editor') //use whichever selector you want
    .then((element) => {
      let height = document.querySelector('#acf-group_IDOFYOURACFGROUP').offsetHeight;
      let editor = document.querySelector('.edit-post-visual-editor');
      editor.style.paddingTop = (height + 100) + "px";
    });
  });
});

Unfortunatly ACF Groups are not organized in meta-locations anymore, then you would not be forced to take the fixed ID but could work with the above-content-group instead...

[rubenmeines]

Any new updates on this? I would like to add some custom fields that make more sense to have underneath the title. Such as a small introduction that is placed underneath the title on top of a header image. See attached image:

[guidofd]

There seems to be a simpler solution if you don't mind moving all bottom metaboxes to between the title and the content; just add something like this JS to the editor:

setTimeout(function(){
      jQuery('.edit-post-layout__metaboxes').insertAfter('h1.wp-block-post-title');
},500);