WordPress Snippet

ワードプレスをカスタマイズしよう

codemirror code-editorをダッシュボードのクイックドラフトメタボックスに追加する。

WordPress4.9で追加CSSやウィジェットhtmlの編集にコードエディタが追加されました。テーマやプラグインのテキストエリアにコードエディタを手軽に追加できそうです。

まずは、ダッシュボードにあるクイックドラフトメタボックスに、追加してみようと思います。

add_action( 'admin_enqueue_scripts', 'add_codemirror_for_quick_draft' );

	function add_codemirror_for_quick_draft(){

		if ( 'dashboard' !== get_current_screen()->id ) {
			return;
		}

		$settings= wp_enqueue_code_editor( array( 'type'=> 'text/html' ) );

		if ( false=== $settings ) {
			return;
		}

		wp_add_inline_script(
			'code-editor',
			sprintf(
				'jQuery( function() { wp.codeEditor.initialize( "content", %s ); } );',
				wp_json_encode( $settings )
			)
		);	
	}

get_current_screen()->idで、適用するテキストエリアのページの時だけ、動作するようにして、wp.codeEditor.initialize( “textareaのID”,%s)を指定すると、完成。