The Range field creates a number slider input option for the block, suitable for integers.


  • Help Text: Instructions to describe the data needed in the field.
  • Minimum Value: The minimum value that can be selected within the range.
  • Maximum Value: The maximum value that can be selected within the range.
  • Step Size: The smallest change possible while moving the slider.
  • Default Value: The default value for this field when adding the block.

PHP API Controls

  • name
  • label
  • control
  • type
  • order
  • location
  • width
  • help
  • min
  • max
  • step
  • default

Template Usage

To display the Range field in your template, use the field name you provided.

<?php block_field( 'age' ); ?>

The API will return an integer and echo a string.

Example template file /blocks/block-block-lab-example.php

// Block Lab Example Block

<h3>How old is this pet?</h3>
<p><?php block_field( 'age' ); ?></p> 

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

Screenshot showing the Block Lab custom block in the menu

It will then display within your post/page.

And on the front-end of your site.