Removing the first image in content

Question

I've been using this code:

function remove_first_image ($content) {
if (!is_page() && !is_feed() && !is_feed()) {
$content = preg_replace("/<img[^>]+\>/i", "", $content, 1);
} return $content;
}
add_filter('the_content', 'remove_first_image');

for a few years now on my site that has almost 20,000 posts with images inserted at the top. I have a plugin that uses the first image as a featured image as well. sometimes I need to still insert a first image into content so it doesn't remove another image I have posted in there.

I would like to have the first image in the content removed completely in posts. so that in the future I don't have to insert a featured image into the content every time, just so other images show up when I have more than one image. So far I haven't been able to find anything on this except having to go into 20,000 posts and remove the first image.

Any ideas?

Answer 1

I don't know of any plugin specifically for this, there's nothing in WP that will do this but it's not too difficult to implement with a little php, even 20k posts shouldn't be too extreme. Depending on your server settings you may need to do some workarounds to make sure the connection stays alive but the basic idea would be to loop through all posts, check that it's a proper post (not a page, revision, custom post_type, etc.) and then run a string replace on the content very much like the code you already have.

This is untested, just as an example:

$query = new WP_Query( array(
  'post_type' => 'post',
  'post_status' => 'publish'
) );

foreach ( $query->posts as $edit_post ) {
  $edit_post->post_content
  wp_update_post( array(
    'ID' => $edit_post->ID,
    'post_content' => preg_replace( "/<img[^>]+\>/i", "", $edit_post->post_content, 1 )
  );
}

You'd probably want to put that in a plugin of it's own with some admin page code to run it someplace safe, hopefully you get the idea.

WP-CLI has the ability to do bulk edits with search-replace of DB strings and could probably be used to do something similar.

$ wp search-replace '/<img[^>]+\>/i' '' wp_posts --regex 

Answer 2

You could probably do this on the front end using something like this

$('img ')[0].remove()

Answer 3

If you only want to hide it, you can do it in CSS.

.your-post-content-class img:first-of-type { display:none; }

If you want to really remove if from post_content, you can get the first image tag in your post_content then update it.

function removeFirstImgTag($post_id) {
  $post = get_post($post_id);
  $content = $post->post_content;
  preg_match('<img([\w\W]+?)/>', $content, $matches);
  $content = str_replace($matches[0][0], '', $content);

  wp_update_post(array(
    'ID'            => $post_id,
    'post_content'  => $content,
  ));
}

You get the post_content without apply_filters('the_content'), then you get the first img tag with regex, then you update it.

I haven't test this yet, but I think, that's works :)