Reply To: Changing the metabox style on the classic editor and other default metaboxes

• MisterR

• September 12, 2024 at 5:55 am

Here’s my solution B.

// Style the content editor as metabox
function my_content_editor_metabox(){

	if (function_exists('get_current_screen')) {
		$current_screen = get_current_screen();

		if ($current_screen->post_type == 'event')
			my_content_editor_metabox_init(__('Description', 'my'));
	}
}

add_action('acf/input/admin_footer', 'my_content_editor_metabox');

function my_content_editor_metabox_init($title){

	echo
	"<script type='text/javascript'>\n".

		"jQuery(function($){\n".
			"$(function(){\n".
				"var editor = $('#postdivrich');\n".

				"if (editor.length) {\n".
					"editor.addClass('postbox my-content-editor');\n".
					"editor.prepend('<div class=\"postbox-header\"><h2>$title</h2></div>');\n".
				"}\n".
			"});\n".
		"});\n".

	"</script>\n";
}

Styles:

#acf_after_title-sortables:has(~ #postdivrich.gpi-content-editor){
	margin-bottom: 0;
}

#postdivrich.gpi-content-editor{
	margin: 20px 0 0;
}

#postdivrich.gpi-content-editor .wp-editor-tools{
	background: transparent;
	padding-top: 0;
	width: 100%;
}

#postdivrich.gpi-content-editor .wp-editor-wrap{
	margin: 16px 16px 0;
}

#postdivrich.gpi-content-editor #post-status-info{
	width: calc(100% - 32px);
	margin: 0 16px 16px;
}