image_send_to_editor │ filter-hook │ WP 2.5.0

Allows you to change the HTML of an image inserted into the editor using the “Add Media” button. Works in the Classic Editor.

Usage

add_filter( 'image_send_to_editor', 'wp_kama_image_send_to_editor_filter', 10, 9 );

/**
 * Function for `image_send_to_editor` filter-hook.
 * 
 * @param string       $html    The image HTML markup to send.
 * @param int          $id      The attachment ID.
 * @param string       $caption The image caption.
 * @param string       $title   The image title.
 * @param string       $align   The image alignment.
 * @param string       $url     The image source URL.
 * @param string|int[] $size    Requested image size. Can be any registered image size name, or an
 *                              array of width and height values in pixels (in that order).
 * @param string       $alt     The image alternative, or alt, text.
 * @param string       $rel     The image rel attribute.
 *
 * @return string
 */
function wp_kama_image_send_to_editor_filter( $html, $id, $caption, $title, $align, $url, $size, $alt, $rel ){
	// filter...
	return $html;
}

$html(string)

The image HTML to insert into the content.

$id(integer)

The attachment ID.

$caption(string)

The image caption.

$title(string)

The image title.

$align(string)

The image alignment.

$url(string)

The image URL.

$size(string/array)

The image size. A size name or an array containing width and height values, in that order.
Default: 'medium'

$alt(string)

The image alt text.

$rel(string) (WP 5.6)

The image rel attribute.

Examples

#1 Change the image insertion code used by the “Add Media” button

Suppose inserting an image into a post produces this code:

<img src="http://example.com/wp-content/uploads/2014/04/1.jpg" alt="drawing" width="500" height="155" class="alignnone size-full wp-image-79" />

Remove the http protocol from src and add a class so the code does not need to be edited after each insertion. The image should be inserted like this:

<img src="//example.com/wp-content/uploads/2014/04/1.jpg" alt="drawing" class="myclass aligncenter" style="width: 100%; max-width: 500px;" />

Solution:

add_filter( 'image_send_to_editor', 'filter_function_name_11', 10, 8 );
function filter_function_name_11( $html, $id, $caption, $title, $align, $url, $size, $alt ){

	$html = str_replace( 'http:', '', $html ); // Remove the protocol

	$html = str_replace( 'class="', 'class="myclass ', $html ); // Add the class

	return $html;
}