Change generated HTML code from "Add Media" button

What if I want to add attributes to the <a> tag?

What attributes?

Use the ‘get_image_tag’ filter. Your callback is passed a bunch of data that might be useful. See the source code from where the filter originates for a better idea of the possibilities.

@esmi – Imagine I need to add an id= attribute to every picture uploaded.

@bcworkz – That’s nice. However I see the <a> is missing from the code. Why is that? All I can manipulate is the <img> tag.

Oh, sorry about that. I focused on the <img> tag for some reason. You want the ‘image_send_to_editor’ filter, which also includes the <img> tag. Origin

It doesn’t contain the <img> tag, however I can change it in the originally said ‘get_image_tag’ filter and it works! Thank you ??

I’d like to bump in this thread because I wonder if there’s another solution that doesn’t include hacking the original WordPress files. Can it be done through the theme’s functions.php?

Thanks.

You absolutely should not change WordPress core files as you’ll lose your changes on upgrade. When bcworkz was referencing filters, he meant you should write something your functions.php like the following:

function filter_image_send_to_editor($content) {
  $content .= '<p>Unicorns are awesome.</p>';

  return $content;
}
add_filter('image_send_to_editor', 'filter_image_send_to_editor');

Inside that filter call you just need to do whatever transformation you want.

Hello there nickohm.

That’s good to hear and that’s exactly the problem – whenever WordPress updates, it resets to default.

I tried inserting that code in the functions file and it indeed adds the <p>Unicorns are awesome</p> to the end of the tags. However, it adds to the end, instead of replacing everything.

Is there a way to rewrite/replace the text coming out?

Do you know PHP at all? That callback function is accepting a string (the default output that you want to modify) and returning a string (the content that will actually be inserted). All you have to do is return the correct string – whatever that is.

I don’t really know much of PHP, I just work along with what I have.

I’m sure that what you said makes sense, however I have no clue how to make it work.

Let’s say the current tag being sent to the editor is <a href="link"><img src="link"></a> and I want to change it to <p>miaumiau you can't insert images</p>

How exactly would the function be? Like I said, from your code I understood I could change the $content however I wanted, but that just adds content to the end. How can I change the whole?

Basically from the core files we have this:

107	function get_image_send_to_editor($id, $caption, $title, $align, $url='', $rel = false, $size='medium', $alt = '') {
108
109	        $html = get_image_tag($id, $alt, '', $align, $size);
110
111	        $rel = $rel ? ' rel="attachment wp-att-' . esc_attr($id).'"' : '';
112
113	        if ( $url )
114	                $html = '<a href="' . esc_attr($url) . "\"$rel>$html</a>";
115
116	        $html = apply_filters( 'image_send_to_editor', $html, $id, $caption, $title, $align, $url, $size, $alt );
117
118	        return $html;

228	function get_image_tag($id, $alt, $title, $align, $size='medium') {
229
230	        list( $img_src, $width, $height ) = image_downsize($id, $size);
231	        $hwstring = image_hwstring($width, $height);
232
233	        $title = $title ? 'title="' . esc_attr( $title ) . '" ' : '';
234
235	        $class = 'align' . esc_attr($align) .' size-' . esc_attr($size) . ' wp-image-' . $id;
236	        $class = apply_filters('get_image_tag_class', $class, $id, $align, $size);
237
238	        $html = '<img src="' . esc_attr($img_src) . '" alt="' . esc_attr($alt) . '" ' . $title . $hwstring . 'class="' . $class . '" />';
239
240	        $html = apply_filters( 'get_image_tag', $html, $id, $alt, $title, $align, $size );
241
242	        return $html;
243	}

And I know how to change it accordingly to how I want, because the content is there.

In my example I appended the paragraph to the content sent into the function. However, you could just as easily do something like the following:

function filter_image_send_to_editor($html, $id, $caption, $title, $align, $url, $size, $alt) {
  $html = str_replace('<img ', '<img id="my-super-special-id" ', $html);

  return $html;
}
add_filter('image_send_to_editor', 'filter_image_send_to_editor', 10, 8);

What that does is manipulate the image tag and add an id attribute. You can manipulate the content however you want given the arguments that are passed.

That’s nice! What about the <a> tag? How can I change it? ?? Sorry.

Perhaps the easiest way is to tell me what the output is and what you want the output to be and I can just write the code to make that happen for you. I’m afraid you won’t learn as much, but you’ll get a solution much quicker ??

Alright ?? What I want is:

<a href="link" class="fancybox-img"><img src="link"></a>

Simple as that ??

Just to be clear, the href attribute and the src attribute should point to the same place? I’m assuming you need an alt attribute as well for validation purposes?