URL

A string which represents a URL.

Properties

REQUIREDtypestring
Value must be set to url.
REQUIREDnamestring
Required. The field name. This will be the key in the data record.
titlestring
Human readable label for the field.
hiddenboolean
If set to true, this field will be hidden in the studio.
readOnlyboolean
If set to true, this field will not be editable in the content studio.
descriptionstring
Short description to editors how the field is to be used.

uri(options)function
scheme - String, RegExp or Array of schemes to allow (default: ['http', 'https']).
allowRelative - Whether or not to allow relative URLs (default: false).
relativeOnly - Whether to only allow relative URLs (default: false).
custom(fn)function
Creates a custom validation rule.

The URL type is basically just a string input, but the rendered HTML input field will have the type attribute set to url, like so:

<input type="url">

{
  title: 'Image URL',
  name: 'imageUrl',
  type: 'url'
}

{"imageUrl": "https://example.com/img.jpg"}

To allow more protocols than http/https, you can specify validation options:

{
  title: 'Link',
  name: 'href',
  type: 'url',
  validation: Rule => Rule.uri({
    scheme: ['http', 'https', 'mailto', 'tel']
  })
}

Updated on February 25, 2021