Arguments

Name	Type	Default	Description
id	string		A unique ID. This ID will be used to get the value
type	string	spinner	Type of the field
title	string		Title of the field
default	string		Default value from database, if the option doesn’t exist
subtitle	string		Subtitle to display below the title
desc	string		Description to display after the field
help	string		Text to display on right-corner (as hover/popup) the field
class	string		Extra CSS classes (space separated) to append to the field
before	string		Content to display before the field
after	string		Content to display after the field
dependency	array		Define field visibility depending on other field value
attributes	array		Extra HTML attributes to append to the field
sanitize	string		Callback function for sanitizing value
validate	string		Callback function for validating value
EXTRAS
max	number	100	Value to set the maximum spinner value
min	number	0	Value to set the minimum spinner value
step	number	1	Amount of increment value for each step
unit	string	px	The unit to display of the field, also sets output CSS property unit value
output	array|string		CSS elements selector
output_mode	string	width	Output CSS property of an element (Example: width height max-width)
output_important	bool	false	Flag to add !important rule on output css

Simple Spinner Field Example

array(
  'id' => 'example-spinner',
  'type' => 'spinner',
  'title' => 'Example Spinner',
),

Spinner Field Example with Default

array(
  'id' => 'example-spinner',
  'type' => 'spinner',
  'title' => 'Example Spinner',
  'default' => 50,
),

Spinner Field Example with Specific Settings

array(
  'id' => 'example-spinner',
  'type' => 'spinner',
  'title' => 'Example Spinner',
  'min' => 0,
  'max' => 100,
  'step' => 10,
  'unit' => 'px',
  'default' => 25,
),

Spinner Field Example with Outputs

array(
  'id' => 'example-spinner',
  'type' => 'spinner',
  'title' => 'Example Spinner',
  'min' => 0,
  'max' => 1600,
  'step' => 1,
  'unit' => '%',
  'output' => '.header-area',
  'output_mode' => 'width',
  'default' => 1000,
),