Plugin Planet

In this tutorial, you get two recipes for adding Range and Number fields to your USP Pro forms.

Add a Range Field

To add a range field to any USP Form, first define a custom field and be sure to include the following attribute:

type#range

Then include the custom field’s shortcode in the form, for example:

[usp_custom_field form="123" id="1"]

Save your changes and you’ll have something like this displayed in your form:

Range field displayed on Chrome. Note that the appearance of the date field will vary from browser to browser.

Range Limits

Hey, what about min/max limits? I hear you say. Well, that can be done by including the following attributes in your custom field definition:

type#range|custom_1#min:1|custom_2#max:100

Here we are limiting the possible values for the range field as follows:

• Minimum Value: 1
• Maximum Value: 100

Note that other attributes can be added to the range field using this same basic technique.

Add a Number Field

To add a range field to any USP Form, first define a custom field and be sure to include the following attribute:

type#number

Then include the custom field’s shortcode in the form, for example:

[usp_custom_field form="123" id="1"]

Save your changes and you’ll have something like this displayed in your form:

Number field displayed on Chrome. Note that the appearance of the date field will vary from browser to browser.

Number Limits

As with the range field, min/max limits for number fields can be done by including the following attributes in your custom field definition:

type#number|custom_1#min:1|custom_2#max:100|custom_3#step:0.5

Here we are limiting the possible values for the range field as follows:

• Minimum value: 1
• Maximum value: 100
• Step value: 0.5

Note that other attributes can be added to the number field using this same basic technique.

Related

• USP Pro – Custom Input Fields