Multi-Select

The Multi-Select field creates a list input option for the block, in which multiple choices can be selected.

Click image to enlarge

1. Field Label: The field label will be displayed next to the field when adding it the block to the post or page.
2. Field Name: The field name should auto-fill based on the field label, but can be customized. This will be used in the PHP as part of the block template.
3. Field Type: Choose the Multi-select field type.
4. Field Location: Choose a location to display the field.
   • Editor will show the field in the main editing area of a post or page.
   • Inspector will display the field in the right-hand sidebar under the block inspector.
5. Field Width: Select how widely the field should be displayed.
6. Help Text: Enter instructions to describe the data needed in the field. (optional).
7. Choices: The items you want to make available in the dropdown menu.
   • Enter each choice on a new line.
   • To specify the value and label separately, use this format: value : Your label. The label will display in the block
8. Default Value: The default value for this field when adding the block.
   • Enter each default value on a new line.
   • Use only the value (not the label) of the choice you would like selected.

PHP API Controls

• name
• label
• control
• type
• order
• location
• width
• help
• options
• default

Template Usage

To display the Multi-Select field in your template, use the field name you provided.

There are two ways you can do this.

1. Template Editor: Using the built-in template editor is the easiest way to create the required block template. The template editor accepts HTML markup, field names (enclosed in 2 brackets), and CSS only.

Here’s an example of HTML you can use in the template editor:

<div>
     <p>Which vaccinations are still needed?</p>
     <p>{{pets-vaccinations}}</p>
</div>

2. PHP Template: If you need to use logic, loop syntax, define variables, or use PHP, you can create the template manually using the PHP templating method instead.

For example:

<?php block_field( 'pets-vaccinations' ); ?>

Example template file /blocks/block-example.php

<?php
// Example Multi-Select Field
?>

<p>Which vaccinations are still needed?</p>
<p><?php block_field( 'pets-vaccinations' ); ?></p> 

Block Usage

To use the block with the Multi-Select field on your site, locate it in the blocks menu.

Click image to enlarge

It will then display within your post or page editor.

Click image to enlarge

Click image to enlarge

And on the front end of your site.

Click image to enlarge

Click image to enlarge

The API will return an array of the values, and echo a comma separated string.

<h2>Featuring:</h2>
<ul>
	<?php foreach ( block_value( 'features' ) as $value ) : ?>
	<li><?php echo $value; ?></li>
	<?php endforeach; ?>
</ul>