Provides an HTML editor powered by WordPress CodeMirror.

The field stores sanitized HTML as a string.

Use Cases #

• Add custom HTML blocks to a post
• Store formatted snippets for templates
• Capture reusable markup fragments
• Maintain short HTML instructions
• Embed sanitized HTML in layouts

Field Preview #

A textarea enhanced with CodeMirror in HTML mode.

How to Use #

1. Add the HTML Field to a Field Group.
2. Set a Placeholder if needed.
3. Set Rows to control the visible editor height.
4. Save the Field Group and edit a post.

Field Settings #

Setting	Description	Default
Placeholder	Text shown when field is empty	Enter your HTML…
Rows	Visible height of the editor	8

Value & Storage #

Saved as: Post meta

Storage type: String

Return format: string

REST format: not specified

Important details:

• Value is sanitized with wp_kses_post() on save.

Output Examples #

PHP #

$html = get_field('my_html');

if (is_string($html) && $html !== '') {
    echo wp_kses_post($html);
}

Twig #

{% set html = fn('get_field', 'my_html') %}
{% if html %}
  {{ html|e('html') }}
{% endif %}

Compatibility #

• Repeaters
• Flexible Content
• Options Pages
• Frontend forms (acf_form)
• REST API
• Multisite

Hooks (Developer) #

Hooks Summary #

Hook	Type	Purpose
custom_fields_booster_html_defaults	Filter	Modify default settings.
custom_fields_booster_html_supports	Filter	Modify ACF support flags.
custom_fields_booster_html_before_render	Action	Run logic before rendering UI.
custom_fields_booster_html_after_render	Action	Run logic after rendering UI.
custom_fields_booster_html_editor_id	Filter	Modify editor DOM ID.
custom_fields_booster_html_textarea_atts	Filter	Modify textarea attributes.
custom_fields_booster_html_before_settings	Action	Run logic before rendering settings UI.
custom_fields_booster_html_setting_placeholder	Filter	Modify placeholder setting config.
custom_fields_booster_html_setting_rows	Filter	Modify rows setting config.
custom_fields_booster_html_after_settings	Action	Run logic after rendering settings UI.
custom_fields_booster_html_before_enqueue	Action	Run logic before enqueuing assets.
custom_fields_booster_html_codemirror_settings	Filter	Modify CodeMirror settings.
custom_fields_booster_html_after_enqueue	Action	Run logic after enqueuing assets.
custom_fields_booster_html_load_value	Filter	Modify value after loading.
custom_fields_booster_html_validate_value	Filter	Modify validation result.
custom_fields_booster_html_update_value	Filter	Modify value before saving.
custom_fields_booster_html_format_value	Filter	Modify value returned by get_field().

Filters #

Filter: custom_fields_booster_html_codemirror_settings

Purpose: Modify CodeMirror settings.

When: You want to adjust editor behavior.

add_filter('custom_fields_booster_html_codemirror_settings', function ($settings, $field_instance) {
    $settings['codemirror']['lineNumbers'] = false;
    return $settings;
}, 10, 2);

Actions #

Action: custom_fields_booster_html_before_render

Runs before rendering the field UI.

add_action('custom_fields_booster_html_before_render', function ($field, $field_instance) {
    // Pre-render logic.
}, 10, 2);

Assets #

This field enqueues assets whenever the input is rendered (admin and frontend via acf_form()):

• admin/js/cfb-field-html.js
• admin/css/cfb-html-field.css
• WordPress Code Editor assets (wp-theme-plugin-editor, wp-codemirror)

REST API #

Schema: not specified

REST Validation #

Validation uses validate_value() on REST writes.

Security & Escaping #

• Value is sanitized with wp_kses_post() on save.
• Output should be escaped in templates.

Notes / Limitations #

• The editor runs CodeMirror in text/html mode.

Changelog #

• 1.0.0 — Initial release