Code Editor – ACF Extended

Field Render

Display a code editor area using the built-in WP Core Codemirror library. Multiple languages highlights are available: Text/HTML, Javascript, CSS, PHP mixed & PHP plain.

Field Group

Code Editor

Field Settings

Setting name	Description
Default Value	Appears when creating a new post
Placeholder	Appears within the input
Editor mode	Code highlight type
Show Lines	Whether to show line numbers to the left of the editor
Indent Unit	How many spaces a block (whatever that means in the edited language) should be indented
Character Limit	Leave blank for no limit
Rows	Sets the textarea height
Max rows	Sets the textarea max height

Field Value

Value can then be retrieved using the common get_field() function. The returned data are decoded HTML entities. Usage example:

$code_editor = get_field('code_editor');

/*
 * <div class="my-class">
 *     <p>Lorem ipsum dolor sit amet.</p>
 *     <p>Praesent sapien massa, convallis.</p>
 * </div>
 *
 * <div class="my-class-2">
 *     <p>Lorem ipsum dolor sit amet.</p>
 *     <p>Praesent sapien massa, convallis.</p>
 * </div>
 */

Field Groups Field Settings Fields

Advanced Link Button Clone Code Editor Columns Date Picker PRO Date Time Picker PRO Dynamic Message File PRO Flexible Content Forms Google Map PRO Group Hidden Input Image Post Field PRO Post Object PRO Post Statuses Post Types Relationship PRO reCaptcha Select Slug Taxonomies Taxonomy Terms Textarea Time Picker PRO User Roles WYSIWYG Editor PRO

Modules WordPress Multilingual