The Image field creates a text field expecting an image URL. You have three ways to add an image: 1) click the button to upload a file, 2) click the button to choose one from your WordPress Media Library, or 3) drag-and-drop an image file onto the block.
- Help Text: Instructions to describe data needed in the field.
PHP API Controls
To display the Image field in your template, use the field name you provided.
<img src="<?php block_field( 'pets-photo' ); ?>" />
The API will return the Attachment Post ID of the chosen image as an integer, and echo the full-size URL of the chosen image a string.
<?php $attachment_id = block_value( 'pets-photo' ); echo wp_get_attachment_image( $attachment_id, 'thumbnail' ); ?>
Example template file
<?php // Block Lab Example Image Field ?> <p>How can you say no to a face like this?</p> <img src="<?php block_field( 'pets-photo' ); ?>" />
To use the block with the Image field on your site, locate it in the blocks menu.
It will then display within your post/page.
And on the front-end of your site.