Controls
Gallery
Gallery control is used to upload image files and store an array of them for the block. This control uses the native WordPress Media Popup to handle the upload and selection process. See examples below to use this control.
Gallery control saves data as an array of arrays and contains the following keys:
Name | Description |
---|---|
id | Unique ID of uploaded image |
url | URL to access the image |
alt | Optional alt attribute used in <img> tags |
caption | Optional caption |
link | Link to image |
sizes | List of available sizes for the image |
Control Settings
- Preview Size – select the size if the image preview displayed in the editor
Usage
PHP
<?php foreach( $attributes['control_name'] as $image ): ?>
<img src="<?php echo esc_url( $image['url'] ); ?>" alt="<?php echo esc_attr( $image['alt'] ); ?>">
<?php endforeach; ?>
PHP with Image ID
foreach( $attributes['control_name'] as $image ) {
if ( isset( $image['id'] ) ) {
echo wp_get_attachment_image( $image['id'], 'large');
}
}
Handlebars
{{#each control_name}}
<img src="{{url}}" alt="{{alt}}" />
{{/each}}
Post Meta
$gallery = get_lzb_meta( 'control_meta_name' );
foreach ( $gallery as $image ) {
?>
<img src="<?php echo $image['url']; ?>" alt="<?php echo $image['alt']; ?>">
<?php
}
Post Meta with Image ID
$gallery = get_lzb_meta( 'control_meta_name' );
foreach ( $gallery as $image ) {
if ( isset( $image['id'] ) ) {
echo wp_get_attachment_image( $image['id'], 'large');
}
}