How to Add Automatic Class in Image for Wordpress Post

add css class to image attached in all the posts?

Instead of modifying all of your posts or applying the 'img-fluid' class dynamically, perhaps consider using CSS3 selectors to apply the same styles to all of your image attachments using an existing class. For example you could use:

img[class*='wp-image-']

This targets all image elements on the page which include 'wp-image-' in the class attribute. Here is an example:

img[class*='wp-image-'] {   width: 25%;   height: 25%;   opacity: 0.5;   border: 2px solid #000;}

<img class="size-full wp-image-8996" src="https://nepaltimes.net/wp-content/uploads/2018/04/31043884_1792179470828697_8330507756888915968_n.jpg" />

How to add auto class to wordpress upload media

Just paste following code in your current theme function.php file.

if ( ! function_exists( 'auto_custom_class_add_for_media_attchment' ) ) :

    function auto_custom_class_add_for_media_attchment( $html, $id ) {

        $attachment = get_post( $id );
        $mime_type = $attachment->post_mime_type;

        // Here i added if condition only for pdf mine type, you can use whatever mime_type you require or remove condition for all.
        if ( $mime_type == 'application/pdf' ) {
            $src = wp_get_attachment_url( $id );
            $html = '<a class="fileuploadclass" href="'. $src .'">'. $attachment->post_title .'</a>';
        }

        return $html;
}
endif;
add_filter('media_send_to_editor', 'auto_custom_class_add_for_media_attchment', 20, 3);

Using jQuery to automatically add class to image links in WordPress database

I don't think you need to do all that pattern matching. If you want to add a class to any images that are links, try:

jQuery( document ).ready( function(){
  // Add the class to the image
  jQuery( 'a > img' ).addClass( 'newClass' );
  // or add the class to the link
  jQuery( 'a > img' ).parent().addClass( 'newClass' ); 
} );

This would only affect images wrapped in a link tag, but wouldn't affect any other links, PDFs, etc.

Update

To target links where the href is an image, you can use something like this (add or change the extensions as needed):

jQuery( document ).ready( function(){
  jQuery( 'a[href$=".gif"], a[href$=".jpg"], a[href$=".png"]' ).addClass( 'newClass' );
} );

How to add the same class to all existing post in wordpress?

Depending on your theme, you’ll find the post_class function in your single.php file or in the content template files. as an example, in the WordPress Twenty Twenty theme, you can find the post_class() function in the template_part/content.php file.

here is the code <article <?php post_class(); ?> id="post-<?php the_ID(); ?>">

as you want to add a custom class just pass your class name in post_class() as a parameter

<article <?php post_class('obejrzane'); ?> id="post-<?php the_ID(); ?>">

Add class to Wordpress image a anchor elements

Brief Explanation and Example

After retrieving the post from the data base, this will put all of the specified classes into the anchor tag whenever there is an anchor tag with only an image tag inside of it.

It works with many image tags in one post, as well as a variety of other weird possibilities. For instance, something like this

<article>
    <a href="an_image.jpg">
        <img src="an_image.jpg">
    </a>
    <a class="media-img" href="another_image.jpg">
        <img src="another_image.jpg">
    </a>
    <p>Text with a <a href="google.com">link</a></p>
    <a class="big gray ugly" href="third_image.jpg">
        <img src="third_image.jpg">
    </a>
    <a foo="bar" class="big" href="fourth_image.jpg">
        <img src="fourth_image.jpg">
    </a>
</article>

will become

<article>
    <a class="media-img" href="an_image.jpg">
        <img src="an_image.jpg">
    </a>
    <a class="media-img media-img" href="another_image.jpg">
        <img src="another_image.jpg">
    </a>
    <p>Text with a <a href="google.com">link</a></p>
    <a class="media-img big gray ugly" href="third_image.jpg">
        <img src="third_image.jpg">
    </a>
    <a foo="bar" class="media-img big" href="fourth_image.jpg">
        <img src="fourth_image.jpg">
    </a>
</article>

Code (for functions.php)

function add_classes_to_linked_images($html) {
    $classes = 'media-img'; // can do multiple classes, separate with space

    $patterns = array();
    $replacements = array();

    $patterns[0] = '/<a(?![^>]*class)([^>]*)>\s*<img([^>]*)>\s*<\/a>/'; // matches img tag wrapped in anchor tag where anchor tag has no existing classes
    $replacements[0] = '<a\1 class="' . $classes . '"><img\2></a>';

    $patterns[1] = '/<a([^>]*)class="([^"]*)"([^>]*)>\s*<img([^>]*)>\s*<\/a>/'; // matches img tag wrapped in anchor tag where anchor has existing classes contained in double quotes
    $replacements[1] = '<a\1class="' . $classes . ' \2"\3><img\4></a>';

    $patterns[2] = '/<a([^>]*)class=\'([^\']*)\'([^>]*)>\s*<img([^>]*)>\s*<\/a>/'; // matches img tag wrapped in anchor tag where anchor has existing classes contained in single quotes
    $replacements[2] = '<a\1class="' . $classes . ' \2"\3><img\4></a>';

    $html = preg_replace($patterns, $replacements, $html);

    return $html;
}

add_filter('the_content', 'add_classes_to_linked_images', 100, 1);

Other Notes

In the first regular expression pattern, (?![^>]*class) is a negative lookahead so that the first regex replace rule only affects <a href...><img></a>, not <a class... href...><img></a>. (Read more on lookarounds.)
In regular expressions for this, I think [^>]* is better than .*. [^>]* means zero or more characters that are not a >. Without [^>]*, I think there could be problems if there are multiple > characters on one line or in other weird situations.
In the regular expressions, the backslash followed by a number in the replacements such as in '<a\1 class="' . $classes . '"><img\3></a>' refers to the stuff inside corresponding parenthetical block in the corresponding pattern. In other words, \1 means "put the stuff that matches what's inside the first set of parentheses".
In the line add_filter('the_content', 'add_classes_to_linked_images', 10, 1);, the first parameter is the filter for getting the content of a post from the database, the second parameter is the name of the function we want to use, the third parameter is the priority of the filter (higher numbers are executed later), and the fourth parameter is the number of arguments for the filter.
Assuming your anchor and image combination already has the class you want to add, this function will cause it to show up twice in the source code of your page. (Don't worry, it will only show up twice at most and it won't cause any issues. See example above.)

Adding Class to img Container based on Post Thumbnail Orientation

You could try something like this. Modify your function to return only 'horizontal' class if image is landscape:

function mytheme_vertical_check() {

    $thumb_id   = get_post_thumbnail_id();
    $image_data = wp_get_attachment_image_src( $thumb_id , 'tp-thumbnail' );

    $width  = $image_data[1];
    $height = $image_data[2];

    if ( $width > $height ) {
        return 'horizontal';
    }
}

And inside the loop call it to add 'horizontal' class to a div of your choice:

<?php if ( has_post_thumbnail() ) : ?>
    <?php printf( '<div class="masonry-thumbnail %s">', mytheme_vertical_check() );?>
        <?php the_post_thumbnail( 'large' ); ?>
    </div>
<?php endif; ?>