acf_inline_text_editing_attrs()

Description

Helper function that returns the HTML attributes required for inline text editing as a string, escaped and ready for output.

It is used within ACF Block render templates to make an HTML element directly editable, primarily for Text and Text Area fields, allowing authors to type content directly into the block preview area.

Changelog

• Added in version 6.7

Parameters

acf_inline_text_editing_attrs( $field_name, $args = array() );

$field_name

(string) The name of the ACF field that will be updated when the user types into the HTML element..

$args

(array) (Optional) An array of arguments for customizing the inline text editing behavior. The available keys are:

• toolbar_icon
  (string) (Optional) An HTML tag (e.g., SVG) to be used as the toolbar icon.
• toolbar_title
  (string) (Optional) A string to be used as the toolbar title.
• placeholder
  (string) (Optional) A string to be used as the placeholder text when the field is empty.

Return

(string) A string containing the required HTML attributes ready to be placed inside an HTML tag. The returned output is already escaped.

Examples

Making a text field used in an h3 element text editable:

 <h3 <?php echo acf_inline_text_editing_attrs( 'my_text_field' ); ?>>
   <?php echo esc_html( get_field( 'my_text_field' ) ); ?>
</h3>

To customize the experience even further, you can control the icons used in the toolbar, or the placeholder text shown when a field is empty. For example:

<?php echo acf_inline_text_editing_attrs(
    'my_text_field',
    array(
         'toolbar_icon'  => 'your svg html here',
         'toolbar_title'   => 'My custom toolbar title',
         'placeholder'   => 'Type to edit...'
    )
); ?>