How to change Thumbnail size in the loop in AMP Theme Framework by using amp_loop_image

Description :

amp_loop_image is a function name in our AMP plugin by using this function we can display featured image in the loop on your homepage, archive pages, and related posts, etc.

In the amp_loop_image function, we have only one parameter $args like amp_loop_image($args);. in which you need pass an array in the variable like below.

Source :

$args = array(
                        'tag'='div',
                        'tag_class'='image-container',
                        'image_size'='full',
                        'image_crop'='false',
                        'image_crop_width'=$width,
                        'image_crop_height'=$height,
                        'responsive'= true
                    );

Parameters :

tag

tag is the parameter in the array by using this tag we can set the tag name for example div, section, and any other tag. in which <a> tag and <amp-img> tag will be wrapped inside that tag.

tag_class

tag_class is the parameter in the array by using this tag_class name we can give the class name for that tag.

image_size

image_size is the parameter in the array by using this image_size we can give the full, thumbnail and large, small image size.

image_crop

image_crop is the parameter in the array we can give the value like true or false

image_crop_width

image_crop_width is the parameter in the array we can give the width of the image.

image_crop_height

image_crop_height is the parameter in the array we can get the height of the image.

responsive

responsive is the parameter in the array we can give the value like true or false.

Example :

In the following example, If you want to edit the code of this function and load different size of images then you need to edit the width and height or if you want the default sizes of WP, then you can use the “image_size”.

For Example:

<pre>$width 	= 346;
$height = 188;
$args = array(
	        'tag'=&gt;'div',
		'tag_class'=&gt;'image-container',
		'image_size'=&gt;'full',
		'image_crop'=&gt;'false',
		'image_crop_width'=&gt;$width,
		'image_crop_height'=&gt;$height, 
		'responsive'=&gt; 'true'
	     ); 
		<div class="fsp-img">
	          amp_loop_image($args);
	        </div></pre>

Note: If you want to override loop images then use this function and override height, width, div, etc.

That’s it for this tutorial!

We hope it helped you. If you have any feedback or questions, then please share them in the comments section below.