1. Home
  2. WP Simple Pay Pro 2.5 & Lite 1.6
  3. Custom Fields Shortcodes (Pro 2.5)

Custom Fields Shortcodes (Pro 2.5)

Below are the various shortcodes that can be used to add custom fields to your Stripe Checkout form. Examples of using custom fields with our Subscriptions add-on found here.

All custom fields will be saved to meta data fields of the Stripe payment records viewable within your Stripe dashboard.

Note: You will need to include the shortcode(s) inside of the [stripe][/stripe] shortcode block. This will attach the custom field(s) to that specific form.

Note: Data from custom fields is passed to Stripe payments using metadata. For each Stripe transaction you can have up to 20 metadata entries, with labels up to 40 characters long and values up to 500 characters long (source). Longer values will be truncated.

Note: Forms that use multiple amounts attributes or multiple is_quantity attributes will only use the first field on the page that uses the attribute. It is highly recommended you only include a max of one of these attributes on a form to avoid possible errors. However, it is completely safe to use one of each attribute on a form together.

Text Field

To add a custom text field use the shortcode [stripe_text]

Below are the available options (attributes) for this shortcode.

AttributeDescriptionChoicesDefault
idThe ID of the text field. This is passed to your Stripe Dashboard along with the value of the field. This is not required, but is highly recommended.Any text. Note: Should not contain spaces, use underscores instead.
labelThe label before the text field.Any text.
placeholderText appearing inside the field before a user enters anything.Any text.
requiredDetermines if the field is required or not.true, falsefalse
defaultThe default value that will be in the field when displayed. This is not like placeholder text and will actually be submitted unless the user changes it.Any text.
multilineWill turn the text input into multiple lines rather than a single line element.true, falsefalse
rowsHow many rows the multiline text input should have.Any number.5

Shortcode Examples

Add a text field with a label and is required before continuing to checkout:

[stripe name="The Awesome Store" description="The Book of Awesomeness" amount="1999"]
[stripe_text label="First Name:" id="first_name" required="true"]
[/stripe]

Add a multiline text input (textarea) with a placeholder text and double the default height:

[stripe name="The Awesome Store" description="The Book of Awesomeness" amount="1999"]
[stripe_text placeholder="Enter additional comments" multiline="true" rows="10"]
[/stripe]

Date Field

Using the [stripe_date] shortcode you can display a custom date field.

Below are the available options (attributes) for this shortcode.

AttributeDescriptionChoicesDefault
idThe ID of the date field. This is passed to your Stripe Dashboard along with the value of the field. This is not required, but is highly recommended.Any text. Note: Should not contain spaces, use underscores instead.
labelThe label before the date field.Any text.
placeholderText appearing inside the field before a user enters anything.Any text.
requiredDetermines if the field is required or not.true, falsefalse
defaultThe default value that will be in the field when displayed. This is not like placeholder text and will actually be submitted unless the user changes it.Any text.

Shortcode Examples

Add a custom date field with a label and is required:

[stripe name="The Awesome Store" description="The Book of Awesomeness" amount="1999"]
[stripe_date label="Schedule Appointment For:" id="appointment" required="true"]
[/stripe]

Checkbox Field

Using the [stripe_checkbox] shortcode you can display a custom checkbox field.

Below are the available options (attributes) for this shortcode.

AttributeDescriptionChoicesDefault
idThe ID of the checkbox field. This is passed to your Stripe Dashboard along with the value of the field. This is not required, but is highly recommended.Any text. Note: Should not contain spaces, use underscores instead.
labelThe label before the checkbox field.Any text.
requiredIf true then the checkbox will be required to be checked before the checkout will display.true, falsefalse
defaultIf set to true then the form will show with this already checked.true, falsefalse

Shortcode Examples

Add a checkbox that is required and has a label:

[stripe name="The Awesome Store" description="The Book of Awesomeness" amount="1999"]
[stripe_checkbox label="Will you attend?" id="is_attending" required="true"]
[/stripe]

Add a checkbox that will be checked by default when the page loads:

[stripe name="The Awesome Store" description="The Book of Awesomeness" amount="1999"]
[stripe_checkbox default="true" label="I agree to these terms"]
[/stripe]

Number Field

You can add a custom HTML5 number field to your checkout process by using the [stripe_number] shortcode.

Below are the available options (attributes) for this shortcode.

AttributeDescriptionChoicesDefault
idThe ID of the number field. This is passed to your Stripe Dashboard along with the value of the field. This is not required, but is highly recommended.Any text. Note: Should not contain spaces, use underscores instead.
labelThe label before the number field.Any text.
placeholderText appearing inside the field before a user enters anything.Any text.
requiredDetermines if the field is required or not.true, falsefalse
defaultThe default value that will be in the field when displayed. This is not like placeholder text and will actually be submitted unless the user changes it.Any text.
minThe minimum number allowed by the field.A number.
maxThe maximum number allowed by the field.A number.
stepSpecifies the legal number intervals. E.g. step="2" will allow numbers like: -4, -2, 0, 2, 4, 6, etc.A number.
is_quantityAllows users to add multiple of the product.A number.false

Shortcode Examples

Add a number field with a label and make it required:

[stripe name="The Awesome Store" description="The Book of Awesomeness" amount="1999"]
[stripe_number label="How many people will be coming?" id="party_number" required="true"]
[/stripe]

Add a number field with a minimum accepted value and maximum accepted value:

[stripe name="The Awesome Store" description="The Book of Awesomeness" amount="1999"]
[stripe_number placeholder="What's your favorite number?" min="0" max="100"]
[/stripe]

Add a quantity choice field.

[stripe name="The Awesome Store" description="The Book of Awesomeness" amount="1999"]
[stripe_number label="Quantity" is_quantity="true" default="1"]
[/stripe]

You can easily add a custom dropdown box to your forms by using the shortcode [stripe_dropdown]

Below are the available options (attributes) for this shortcode.

AttributeDescriptionChoices
idA unique ID for the select field.Any text. Do not use spaces, use underscores or hyphens instead.
labelThe label to show above the dropdown box.Any text.
defaultThe default selected option.Text matching any of the options attributes.
optionsA comma separated list of options to display in the dropdown.Any text.
is_quantityAllows users to add multiple of the product.true, false
amountsA comma separated predefined amounts for a user to select from.Valid numbers for Stripe amounts.

Shortcode Examples

Add a dropdown field with three options – Red, Green, and Blue:

[stripe name="The Awesome Store" description="The Book of Awesomeness" amount="1999"]
[stripe_dropdown options="Red,Green,Blue"]
[/stripe]

Add a dropdown field with a label, three options, and set “Blue” as the default selected item:

[stripe name="The Awesome Store" description="The Book of Awesomeness" amount="1999"]
[stripe_dropdown label="Pick your favorite color" options="Red,Green,Blue" default="blue"]
[/stripe]

To set a dropdown that will allow your users to select an amount to pay you can use the amounts attribute. The option labels will line up from first to last with the values in amounts.

[stripe name="The Awesome Store" description="The Book of Awesomeness"]
[stripe_dropdown options="Pay $10, Pay $20, Pay $30" amounts="1000,2000,3000"]
[/stripe]

Use a dropdown to let the user select a quantity:

[stripe name="The Awesome Store" description="The Book of Awesomeness" amount="1999"]
[stripe_dropdown options="1,5,10,25,50" is_quantity="true"]
[/stripe]

Radio Button Fields

To add some radio button options to your form all you need is the [stripe_radio] shortcode.

Below are the options (attributes) that are available for this shortcode.

AttributeDescriptionChoices
idA unique ID for the select field.Any text. Do not use spaces, use underscores or hyphens instead.
labelThe label to show above the dropdown box.Any text.
defaultThe default selected option.Text matching any of the options attributes.
optionsA comma separated list of options to display in the dropdown.Any text.
is_quantityAllows users to add multiple of the product.true, false
amountsA comma separated predefined amounts for a user to select from.Valid numbers for Stripe amounts.

Shortcode Examples

Add a radio button group with three options – Red, Green, and Blue:

[stripe name="The Awesome Store" description="The Book of Awesomeness" amount="1999"]
[stripe_radio options="Red,Green,Blue"]
[/stripe]

Add a radio button group with a label, three options, and set “Blue” as the default selected item:

[stripe name="The Awesome Store" description="The Book of Awesomeness" amount="1999"]
[stripe_radio label="Pick your favorite color" options="Red,Green,Blue" default="blue"]
[/stripe]

You can use the amounts attribute to add predefined values. Below is an example in USD to create a radio button group with choices for $5, $10, and $20 it would look something like this:

[stripe name="The Awesome Store" description="The Book of Awesomeness"]
[stripe_radio options="Pay $5, Pay $10, Pay $20" amounts="500,1000,2000"]
[/stripe]

Use a radio button group to let the user select a quantity:

[stripe name="The Awesome Store" description="The Book of Awesomeness" amount="1999"]
[stripe_radio options="1,5,10,25,50" is_quantity="true"]
[/stripe]
Updated on November 19, 2018

Was this article helpful?

Related Articles