Image sizes

[mattpilott]

Could we please get an image size selection and urls for all sizes

thanks

[bfiessinger]

#73 could cover this

[iannacone]

hi, i created an handlebar helper for it:

$handlebars->registerHelper('img', function($img) {
	
	$srcset = wp_get_attachment_image_srcset($img['id']);
	$info = wp_get_attachment_image_src($img['id'], 'large');
	// $width = $info['width'];
	$width = $info[1];
	
	return '<img src="' . $img['url'] . '" alt="' . $img['alt'] . '" class="wp-image-' . $img['id'] . '" srcset="' . $srcset . '" sizes="(max-width: ' . $width . 'px) 100vw, ' . $width . 'px" />';
	
});

[iannacone]

if you have to do something more complicated you can push a variable inside the handlebar context:

$handlebars->registerHelper('img-metadata', function($img, $id, $options = null) {
	
	$metadata = wp_get_attachment_metadata($img['id']);
	$options['context']->push([$id => $metadata]);
	
});

usage: {{img-metadata my_image_variable 'my_new_image_variable_name'}}

[pixeldesignstudio]

Pleeeease add this as an easy option!! I don't know how to use those handlebars.

[bfiessinger]

Pleeeease add this as an easy option!! I don't know how to use those handlebars.

You can use PHP code as well if you don't want to use handlebars. https://lazyblocks.com/documentation/blocks-code/php/

[pixeldesignstudio]

Pleeeease add this as an easy option!! I don't know how to use those handlebars.

You can use PHP code as well if you don't want to use handlebars. https://lazyblocks.com/documentation/blocks-code/php/

Thx, I tried but I think I am too stupid for this and I am not a beginner.

[rawsta]

When using PHP, have you tried this?:

<?php
$image = get_lzb_meta( 'control_meta_name' );
echo wp_get_attachment_image( $image['id'], 'large');

that should give you a bit more control over the sizes.

[pixeldesignstudio]

When using PHP, have you tried this?:

<?php
$image = get_lzb_meta( 'control_meta_name' );
echo wp_get_attachment_image( $image['id'], 'large');

that should give you a bit more control over the sizes.

Yes, I managed to do it by the PHP handle. But switching the complete code to PHP instead of handlebars is a bit of a turndown.

[netzgestaltung]

Hi there, just in case someone else is searching for that topic:

I made a helper that implements wp_get_attachment_image. https://github.com/netzgestaltung/wordpress-snippets/blob/master/lazyblocks.php

Usage: {{{ wp_get_attachment_image control_name 'thumbnail' }}}

/**
 * Additional lazy blocks Handlebars helper
 */
function myPlugin_lazyblocks_handlebars_helper($handlebars){

  /**
   * wp_get_attachment_image Handlebars helper
   * @link https://github.com/nk-o/lazy-blocks/issues/68
   * @see  https://developer.wordpress.org/reference/functions/wp_get_attachment_image/
   * 
   * @example
   * {{{ wp_get_attachment_image control_name 'thumbnail' }}}
   */
  $handlebars->registerHelper('wp_get_attachment_image', function($image, $size=null){
    if ( isset($image['id']) ) {
      return wp_get_attachment_image($image['id'], $size);
    }	  
  });
}

// lazy block Handlebars helper
add_action('lzb/handlebars/object', 'myPlugin_lazyblocks_handlebars_helper');  

  

[claytonschase]

@pixeldesignstudio not sure if you were needing to accomplish the same thing that I was working on but I found a pretty solid solution for selecting the sizes in the frontend block settings.

I created a dropdown control and assigned the default image options and values so the user can choose the appropriate size when adding the block. Then using the below code in the block I just output the user selected size. Seems to work great. Anyway, I hope this helps anyone else trying to achieve the same thing.

<?php
$size = $attributes['image-size'];

if ( isset( $attributes['image']['id'] ) ) {
    echo wp_get_attachment_image( $attributes['image']['id'], $size );
}
?>