Gets an HTML img element representing an image attachment.
Description
While $size will accept an array, it is better to register a size with add_image_size() so that a cropped version is generated. It’s much more efficient than having to find the closest-sized image and then having the browser scale down the image.
Parameters
$attachment_idintrequired- Image attachment ID.
$sizestring|int[]optional- Image size. Accepts any registered image size name, or an array of width and height values in pixels (in that order). Default
'thumbnail'.Default:
'thumbnail' $iconbooloptional- Whether the image should be treated as an icon.
Default:
false $attrstring|arrayoptional- Attributes for the image markup.
srcstringImage attachment URL.classstringCSS class name or space-separated list of classes.
Defaultattachment-$size_class size-$size_class, where$size_classis the image size being requested.altstringImage description for the alt attribute.srcsetstringThe'srcset'attribute value.sizesstringThe'sizes'attribute value.loadingstring|falseThe'loading'attribute value. Passing a value of false will result in the attribute being omitted for the image.
Defaults to'lazy', depending on wp_lazy_loading_enabled() .decodingstringThe'decoding'attribute value. Possible values are'async'(default),'sync', or'auto'. Passing false or an empty string will result in the attribute being omitted.
Default:
''
Source
* 'async' (default), 'sync', or 'auto'. Passing false or an empty
* string will result in the attribute being omitted.
* @type string $fetchpriority The 'fetchpriority' attribute value, whether `high`, `low`, or `auto`.
* Default determined by wp_get_loading_optimization_attributes().
* }
* @return string HTML img element or empty string on failure.
*/
function wp_get_attachment_image( $attachment_id, $size = 'thumbnail', $icon = false, $attr = '' ) {
$html = '';
$image = wp_get_attachment_image_src( $attachment_id, $size, $icon );
if ( $image ) {
list( $src, $width, $height ) = $image;
$attachment = get_post( $attachment_id );
$hwstring = image_hwstring( $width, $height );
$size_class = $size;
if ( is_array( $size_class ) ) {
$size_class = implode( 'x', $size_class );
}
$default_attr = array(
'src' => $src,
'class' => "attachment-$size_class size-$size_class",
'alt' => trim( strip_tags( get_post_meta( $attachment_id, '_wp_attachment_image_alt', true ) ) ),
);
/**
* Filters the context in which wp_get_attachment_image() is used.
*
* @since 6.3.0
*
* @param string $context The context. Default 'wp_get_attachment_image'.
*/
$context = apply_filters( 'wp_get_attachment_image_context', 'wp_get_attachment_image' );
$attr = wp_parse_args( $attr, $default_attr );
$loading_attr = $attr;
$loading_attr['width'] = $width;
$loading_attr['height'] = $height;
$loading_optimization_attr = wp_get_loading_optimization_attributes(
'img',
$loading_attr,
$context
);
// Add loading optimization attributes if not available.
$attr = array_merge( $attr, $loading_optimization_attr );
// Omit the `decoding` attribute if the value is invalid according to the spec.
if ( empty( $attr['decoding'] ) || ! in_array( $attr['decoding'], array( 'async', 'sync', 'auto' ), true ) ) {
unset( $attr['decoding'] );
}
/*
* If the default value of `lazy` for the `loading` attribute is overridden
* to omit the attribute for this image, ensure it is not included.
*/
if ( isset( $attr['loading'] ) && ! $attr['loading'] ) {
unset( $attr['loading'] );
}
// If the `fetchpriority` attribute is overridden and set to false or an empty string.
if ( isset( $attr['fetchpriority'] ) && ! $attr['fetchpriority'] ) {
unset( $attr['fetchpriority'] );
}
// Generate 'srcset' and 'sizes' if not already present.
if ( empty( $attr['srcset'] ) ) {
$image_meta = wp_get_attachment_metadata( $attachment_id );
if ( is_array( $image_meta ) ) {
$size_array = array( absint( $width ), absint( $height ) );
$srcset = wp_calculate_image_srcset( $size_array, $src, $image_meta, $attachment_id );
$sizes = wp_calculate_image_sizes( $size_array, $src, $image_meta, $attachment_id );
if ( $srcset && ( $sizes || ! empty( $attr['sizes'] ) ) ) {
$attr['srcset'] = $srcset;
if ( empty( $attr['sizes'] ) ) {
$attr['sizes'] = $sizes;
}
}
}
}
/** This filter is documented in wp-includes/media.php */
$add_auto_sizes = apply_filters( 'wp_img_tag_add_auto_sizes', true );
// Adds 'auto' to the sizes attribute if applicable.
if (
$add_auto_sizes &&
isset( $attr['loading'] ) &&
'lazy' === $attr['loading'] &&
isset( $attr['sizes'] ) &&
! wp_sizes_attribute_includes_valid_auto( $attr['sizes'] )
) {
$attr['sizes'] = 'auto, ' . $attr['sizes'];
}
/**
* Filters the list of attachment image attributes.
*
* @since 2.8.0
*
* @param string[] $attr Array of attribute values for the image markup, keyed by attribute name.
* See wp_get_attachment_image().
* @param WP_Post $attachment Image attachment post.
* @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).
*/
$attr = apply_filters( 'wp_get_attachment_image_attributes', $attr, $attachment, $size );
$attr = array_map( 'esc_attr', $attr );
$html = rtrim( "<img $hwstring" );
foreach ( $attr as $name => $value ) {
wp_get_attachment_image function can accept four values as you can see:
So i always use:
Note: we can simply use get_the_ID() to pass id of active post. and here 700 is width and 600 is height of attachment image. we can also pass our class as array( “class” => “img-responsive” ).
default call returns like this:
To display all of the images and titles attached to a certain page and display them as a list of bullets you can use the following:
wp_get_attachment_imageis the good way to receive image from theme/plugin options. In order to fetch the image that was upload from custom option, do this: