{"id":3265,"date":"2017-12-21T11:18:43","date_gmt":"2017-12-21T16:18:43","guid":{"rendered":"https:\/\/www.pair.com\/support\/kb\/?p=3265"},"modified":"2020-02-26T09:20:08","modified_gmt":"2020-02-26T14:20:08","slug":"how-to-customize-your-bootstrap-form","status":"publish","type":"ht_kb","link":"https:\/\/www.pair.com\/support\/kb\/how-to-customize-your-bootstrap-form\/","title":{"rendered":"How to Add Items to a Bootstrap Form"},"content":{"rendered":"

Bootstrap gives you all the tools to easily customize your forms. With Bootstrap, you can add new form \u201ccontrols,\u201d like checkboxes or text areas, with an already established styling. This article will show you the basic ways to customize your form and the code needed to include each control.<\/span><\/p>\n \t\t

\r\n \t\t\t \t\t\t \t\t\t\t

\r\n \t\t\t\t\tThese instructions are for Bootstrap version\u00a04.2.1 \t\t\t\t<\/p>\r\n \t\t\t \t\t\t\r\n \t\t<\/div>\r\n \t\t\n

If you are looking for instructions on how to create a Bootstrap form layout, see our How to Customize Bootstrap Form Layouts article<\/a>.<\/p>\n

Form Controls<\/h3>\n

Controls are another name for Bootstrap items, like text areas<\/a> and checkboxes<\/a>, that can be added to your form.
\n<\/a><\/p>\n

Inputs<\/h4>\n

One control is called \"inputs.\" Inputs are fields where the user can enter text. Below is an example code that can be used to add an input control into your form:<\/span><\/p>\n

 <input<\/span> type=\"email\" class=\"form-control\" placeholder=\"Enter email\"><\/pre>\n
The code above will turn out like this:<\/p>\n
\"input<\/a><\/p>\n
In the code, the <\/span>type<\/span> declares the kind of input. In the case of the example, this would be the \"email\" type. The <\/span>placeholder<\/span> defines text that is displayed within the input box. The example above uses \"Enter email\" as placeholder text. This text will disappear when a user starts to type in the text box.\u00a0<\/span><\/p>\n
Bootstrap inputs support HTML5 input types, meaning that you can use any of the following types:<\/span><\/p>\n\n\n\n\n\n\n\n
color<\/td>\ndate<\/td>\ndatetime<\/td>\n<\/tr>\n
datetime-local<\/td>\nemail<\/td>\nmonth<\/td>\n<\/tr>\n
number<\/td>\npassword<\/td>\nsearch<\/td>\n<\/tr>\n
tel<\/td>\ntext<\/td>\ntime<\/td>\n<\/tr>\n
url<\/td>\nweek<\/td>\n<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n
These types can be declared by adding a <\/span>type=\"---\"<\/span>\u00a0to your input, like in the example. If you wanted to add an email input, you would change it to <\/span>type=\u201cemail\u201d<\/span><\/p>\n
<input<\/span> type=\"email\"<\/span> class=\"form-control\" placeholder=\"Enter email\"><\/span><\/pre>\n
Keep in mind that you need to include an input type if you want your control to be correctly styled.<\/span>
\n<\/a><\/p>\n
Text Area<\/h4>\n
The text area control is an area that allows for large quantities of text, like a comment section.<\/span><\/p>\n
Below is a snippet of example code that shows how a text area control would be used:<\/p>\n
 <\/p>\n
<textarea<\/span> class=\"form-control\" <\/span>rows=\"3<\/span>\" placeholder=\"This is the text area!\"><\/textarea><\/span><\/span><\/pre>\n
This code would render a text area like this:<\/p>\n
\"text<\/a>When adding a text area, you can customize the size by declaring how many rows you want it to span. Since Bootstrap is built on rows and columns, you can make the text area smaller or larger by increasing or decreasing the number of rows.<\/span><\/p>\n
<textarea class=\"form-control\" <\/span>rows=\"3<\/span>\"<\/span> placeholder=\"This is the text area!\"><\/textarea><\/span><\/pre>\n
In the example above, the text area spans the length of three rows.
\n<\/a><\/p>\n
Checkboxes<\/h4>\n
The checkboxes allow users to select multiple options. By default, checkboxes are displayed vertically. However, you can change the checkboxes to display horizontally by changing the type to <\/span>type=\"checkbox-inline\"<\/span>. For vertical checkboxes, see our Basic Checkboxes section<\/a>. If you want to display checkboxes horizontally, see our Inline Checkboxes section<\/a>.\u00a0<\/span>
\n<\/a><\/p>\n
Basic Checkboxes<\/h5>\n
Basic checkboxes are displayed vertically.<\/p>\n
\"basic<\/a><\/p>\n
Code for the basic, vertical checkboxes look like this:<\/p>\n
<div class=\"checkbox\"<\/span>><\/span>\r\n \u00a0<label><\/span>\r\n \u00a0\u00a0\u00a0<input type=\"checkbox\"<\/span> value=\"opt1\"<\/span>><\/span>\r\n \u00a0\u00a0\u00a0Option 1<\/span>\r\n \u00a0<\/label><\/span>\r\n<\/div><\/span>\r\n<div class=\"checkbox\"><\/span>\r\n \u00a0<label><\/span>\r\n \u00a0\u00a0\u00a0<input type=\"checkbox\"<\/span> value=\"opt2\"<\/span>><\/span>\r\n \u00a0\u00a0\u00a0Option 2<\/span>\r\n \u00a0<\/label><\/span>\r\n<\/div><\/span><\/pre>\n
Checkboxes contain a value<\/span>, which will be used to differentiate between other checkboxes. Be sure each checkbox has a unique value.<\/p>\n
To display checkboxes horizontally, see the next section<\/a>.
\n<\/a><\/p>\n
Inline Checkbox<\/h5>\n
Inline checkboxes are displayed horizontally, like the example below.<\/p>\n
\"Inline<\/a><\/p>\n
While the code for inline checkboxes is very similar to that of vertical checkboxes, there is one important difference. Horizontal checkboxes have the class=\"checkbox-inline\"<\/span> added to the label element.<\/p>\n
<label <\/span>class=\"checkbox-inline\"<\/span>><\/span>\r\n \u00a0\u00a0\u00a0<input type=\"checkbox\" value=\"opt1\"<\/span>><\/span>\r\n \u00a0\u00a0\u00a0Option 1<\/span>\r\n \u00a0<\/label><\/span>\r\n \u00a0<label <\/span>class=\"checkbox-inline\"<\/span>><\/span>\r\n \u00a0\u00a0\u00a0<input type=\"checkbox\" value=\"opt2\"<\/span>><\/span>\r\n \u00a0\u00a0\u00a0Option 2<\/span>\r\n \u00a0<\/label><\/span><\/pre>\n
Checkboxes contain a value<\/span>, which will be used to differentiate between other checkboxes. Be sure each checkbox has a unique value.<\/p>\n
The inline checkboxes are set up differently than the basic checkboxes. In the inline checkbox code, the <\/span><label><\/span> element is the one that is given the <\/span>class=\u201dcheckbox-inline\u201d<\/span>. However, if you look at the basic checkbox code, you will see that the <\/span>class=\u201dcheckbox\u201d<\/span> is declared in a <\/span><div><\/span> element, not the <\/span><label><\/span> element.<\/span>
\n<\/a><\/p>\n
Radio Button<\/h4>\n
A radio button is similar to a checkbox. However, only one radio button may be selected at a time, while checkboxes may have multiple\u00a0boxes selected. <\/span><\/p>\n
As with checkboxes, the default is to display the radio buttons vertically<\/a>, though you can also change the code to display them horizontally<\/a>. <\/span>
\n<\/a><\/p>\n
Basic Radio Button<\/h5>\n
By default, radio buttons will display vertically, as seen in the example below:
\n\"radio<\/a><\/p>\n
The code for this example looks like this:<\/p>\n
<div class=\"radio\"<\/span>>\r\n \u00a0<label><\/span><\/span>\r\n \u00a0\u00a0\u00a0<input type=\"radio\"<\/span> name=\"radioButtons\" id=\"Radio1\" value=\"opt1\"<\/span> checked<\/span>><\/span>\r\n \u00a0\u00a0\u00a0Option 1<\/span>\r\n \u00a0<\/label><\/span>\r\n<\/div><\/span>\r\n<div class=\"radio\"><\/span>\r\n \u00a0<label><\/span>\r\n \u00a0\u00a0\u00a0<input type=\"radio\"<\/span> name=\"radioButtons\" id=\"Radio2\" value=\"opt2\"<\/span>><\/span>\r\n \u00a0\u00a0\u00a0Option 2<\/span>\r\n \u00a0<\/label>\r\n<\/span><\/div>\r\n<div class=\"radio\"><\/span>\r\n \u00a0<label><\/span>\r\n \u00a0\u00a0\u00a0<input type=\"radio\"<\/span> name=\"radioButtons\" id=\"Radio3\" value=\"opt3\"<\/span>><\/span>\r\n \u00a0\u00a0\u00a0Option 3<\/span>\r\n \u00a0<\/label>\r\n<\/div><\/span><\/span><\/pre>\n
With radio buttons, you can select a radio button to be selected by default. Add \"checked\" to the end of one of your radio buttons to select it.<\/p>\n
Much like checkboxes, radio buttons need to have a defining value<\/span>. These values will be used to differentiate between other checkboxes. Be sure each checkbox has a unique value.<\/p>\n
Radio buttons also need a\u00a0name<\/span> and\u00a0id<\/span> attribute in order to function properly. <\/span>If you forget to include them, the user will be able to select multiple radio buttons at the same time.<\/span>
\n<\/a><\/p>\n
Inline Radio Button<\/h5>\n
In order to make the radio buttons display horizontally, add class=\"radio-inline\"<\/span> to the radio button's label element.\"radio<\/a><\/p>\n
The above example's code will look like this:<\/p>\n
<label class=\"radio-inline\"<\/span>><\/span>\r\n \u00a0<input type=\"radio\" name=\"radioInline\" id=\"inlineRadio1\" value=\"inlineOpt1\"> Option 1<\/span>\r\n<\/label><\/span>\r\n<label class=\"radio-inline\"<\/span>><\/span>\r\n  <input type=\"radio\" name=\"radioInline\" id=\"inlineRadio2\" value=\"inlineOpt2\"> Option 2<\/span>\r\n<\/label><\/span>\r\n<label class=\"radio-inline\"<\/span>><\/span>\r\n \u00a0<input type=\"radio\" name=\"radioInline\" id=\"inlineRadio3\" value=\"inlineOpt3\"> Option 3<\/span>\r\n<\/label><\/span><\/pre>\n
As with the checkboxes, the inline radio button code differs from the basic radio button code. The <\/span>class=\u201cradio-inline\u201d<\/span> is situated in the <\/span><label><\/span> element in the inline radio code instead of in a <\/span><div><\/span> element, like it is in the basic radio code<\/a>.<\/span><\/p>\n
Inline radio buttons also require the same elements as basic radio buttons: each radio button must include a\u00a0name<\/span><\/span>,\u00a0id<\/span><\/span>, and value<\/span> in order for the radio buttons to work properly.
\n<\/a><\/p>\n
Selection Menus<\/h4>\n
Drop-down selection allows the user to select an option (or several options) from a list of options. You can create a drop-down selection that only allows one option to be selected or allows for multiples.<\/span><\/p>\n
For single option only selections, see our Single Option Selection section<\/a>.<\/p>\n
To allow users to select more than one option, see our\u00a0Multiple Option Selection section<\/a>. <\/span>
\n<\/a><\/p>\n
Single Option Selection<\/h5>\n
A single selection drop-down displays when clicked. A user is able to select one option from the drop-down, like in the example below:<\/p>\n
\"single<\/a><\/p>\n
However, their code differs. A single select drop-down will resemble the code below:<\/p>\n
<select class=\"form-control\"><\/span>\r\n \u00a0<option>Option 1<\/option><\/span>\r\n \u00a0<option>Option 2<\/option><\/span>\r\n \u00a0<option>Option 3<\/option><\/span>\r\n \u00a0<option>Option 4<\/option><\/span>\r\n \u00a0<option>Option 5<\/option><\/span>\r\n<\/select><\/span><\/pre>\n
The code is a select<\/span> element with nested option<\/span> elements.
\n<\/a><\/p>\n
Multiple Option Selection<\/h5>\n
Multi-select drop-downs display in a way that allows multiple options to be selected, as seen below:<\/p>\n
\"multiple<\/a><\/p>\n
The only difference between the two is within the <select><\/span> element. In the drop-down selection, it reads <\/span><select class=\"form-control\"><\/span>. However, in the multiple selection menu, it is shown as <\/span><select <\/span>multiple<\/span><\/i> class=\"form-control\"><\/span><\/span>.<\/span><\/p>\n
<select multiple<\/span> class=\"form-control\"><\/span>\r\n \u00a0<option>Option 1<\/option><\/span>\r\n \u00a0<option>Option 2<\/option><\/span>\r\n \u00a0<option>Option 3<\/option><\/span>\r\n \u00a0<option>Option 4<\/option><\/span>\r\n \u00a0<option>Option 5<\/option><\/span>\r\n<\/select><\/span><\/pre>\n
Add Help Text to a Component<\/h4>\n
You can add help text to your controls. Bootstrap will automatically format the text as help text, which is usually displayed in smaller text under the form element. Here is an example of help text:<\/span><\/p>\n
\"help<\/a><\/p>\n
 To add help text, add a <<\/span>small class=\"form-text text-muted\">Help Text Here<\/small><\/span>\u00a0below your form element<\/span>.<\/span><\/p>\n
<label>Help Text Example<\/label><\/span>\r\n<input type=\"text\" class=\"form-control\"><\/span>\r\n<<\/span>small class=\"form-text text-muted\"<\/span>>Help Text Here<\/small><\/span><\/span><\/pre>\n
The\u00a0<<\/span>small><\/span>\u00a0element adds smaller text directly underneath your form element. The class=\"form-text text-muted\"\u00a0<\/span>changes the color of the text to gray.<\/p>\n
 <\/p>\n
If you are looking for more information about Bootstrap forms, check out our How to Customize Bootstrap Form Layouts article<\/a>.<\/p>\n    \t\t
\r\n    \t\t\t    \t\t\t    \t\t\t\t
\r\n    \t\t\t\t\tBootstrap is an open-source CSS framework permissive under an MIT license. Bootstrap is not a product of Pair Networks, Inc., and Pair Networks provides no warranty for Bootstrap. Please note that there are many levels of CSS frameworks available. Please consult with your IT professional for advice and guidance on an appropriate CSS framework. This specific product may or may not meet your needs. Pair Networks, Inc. is providing support for this tutorial for your convenience and is not responsible for Bootstrap's performance. Please read carefully the terms and scope of services for any online service or product you are considering purchasing or using.    \t\t\t\t<\/p>\r\n    \t\t\t    \t\t\t\r\n    \t\t<\/div>\r\n    \t\t\n","protected":false},"excerpt":{"rendered":"
Bootstrap gives you all the tools to easily customize your forms. With Bootstrap, you can add new form \u201ccontrols,\u201d like checkboxes or text areas, with an already established styling. This article will show you the basic ways to customize your form and the code needed to include each control. If…<\/p>\n","protected":false},"author":11,"comment_status":"closed","ping_status":"closed","template":"","format":"standard","meta":[],"ht-kb-category":[33],"ht-kb-tag":[187],"yoast_head":"\nHow to Add Items to a Bootstrap Form - Knowledge Base - Pair Networks<\/title>\n<meta name=\"description\" content=\"Bootstrap gives you all the tools to easily customize your forms. With Bootstrap, you can add new form \u201ccontrols,\u201d like checkboxes or text areas, with an already established styling. This article will show you the basic ways to customize your form and the code needed to include each control.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.pair.com\/support\/kb\/how-to-customize-your-bootstrap-form\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"How to Add Items to a Bootstrap Form - Knowledge Base - Pair Networks\" \/>\n<meta property=\"og:description\" content=\"Bootstrap gives you all the tools to easily customize your forms. With Bootstrap, you can add new form \u201ccontrols,\u201d like checkboxes or text areas, with an already established styling. This article will show you the basic ways to customize your form and the code needed to include each control.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.pair.com\/support\/kb\/how-to-customize-your-bootstrap-form\/\" \/>\n<meta property=\"og:site_name\" content=\"Knowledge Base - Pair Networks\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/pairnetworks\/\" \/>\n<meta property=\"article:modified_time\" content=\"2020-02-26T14:20:08+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.pair.com\/support\/kb\/wp-content\/uploads\/2019\/02\/input-image.png\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:site\" content=\"@pairNetworks\" \/>\n<meta name=\"twitter:label1\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data1\" content=\"8 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\/\/www.pair.com\/support\/kb\/how-to-customize-your-bootstrap-form\/\",\"url\":\"https:\/\/www.pair.com\/support\/kb\/how-to-customize-your-bootstrap-form\/\",\"name\":\"How to Add Items to a Bootstrap Form - Knowledge Base - Pair Networks\",\"isPartOf\":{\"@id\":\"https:\/\/www.pair.com\/support\/kb\/#website\"},\"datePublished\":\"2017-12-21T16:18:43+00:00\",\"dateModified\":\"2020-02-26T14:20:08+00:00\",\"description\":\"Bootstrap gives you all the tools to easily customize your forms. With Bootstrap, you can add new form \u201ccontrols,\u201d like checkboxes or text areas, with an already established styling. This article will show you the basic ways to customize your form and the code needed to include each control.\",\"breadcrumb\":{\"@id\":\"https:\/\/www.pair.com\/support\/kb\/how-to-customize-your-bootstrap-form\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/www.pair.com\/support\/kb\/how-to-customize-your-bootstrap-form\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/www.pair.com\/support\/kb\/how-to-customize-your-bootstrap-form\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/www.pair.com\/support\/kb\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"How to Add Items to a Bootstrap Form\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/www.pair.com\/support\/kb\/#website\",\"url\":\"https:\/\/www.pair.com\/support\/kb\/\",\"name\":\"Knowledge Base - Pair Networks\",\"description\":\"\",\"publisher\":{\"@id\":\"https:\/\/www.pair.com\/support\/kb\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/www.pair.com\/support\/kb\/?s={search_term_string}\"},\"query-input\":\"required name=search_term_string\"}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/www.pair.com\/support\/kb\/#organization\",\"name\":\"Pair Networks\",\"url\":\"https:\/\/www.pair.com\/support\/kb\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/www.pair.com\/support\/kb\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/www.pair.com\/support\/kb\/wp-content\/uploads\/2022\/02\/Gb_TUkUE_400x400.jpeg\",\"contentUrl\":\"https:\/\/www.pair.com\/support\/kb\/wp-content\/uploads\/2022\/02\/Gb_TUkUE_400x400.jpeg\",\"width\":360,\"height\":360,\"caption\":\"Pair Networks\"},\"image\":{\"@id\":\"https:\/\/www.pair.com\/support\/kb\/#\/schema\/logo\/image\/\"},\"sameAs\":[\"https:\/\/www.facebook.com\/pairnetworks\/\",\"https:\/\/twitter.com\/pairNetworks\",\"https:\/\/www.instagram.com\/pairnetworks\/\",\"https:\/\/www.linkedin.com\/company\/2269676\/\",\"https:\/\/www.pinterest.com\/pairnetworksinc\/pins\/\",\"https:\/\/www.youtube.com\/user\/pairnetworks\"]}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"How to Add Items to a Bootstrap Form - Knowledge Base - Pair Networks","description":"Bootstrap gives you all the tools to easily customize your forms. With Bootstrap, you can add new form \u201ccontrols,\u201d like checkboxes or text areas, with an already established styling. This article will show you the basic ways to customize your form and the code needed to include each control.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.pair.com\/support\/kb\/how-to-customize-your-bootstrap-form\/","og_locale":"en_US","og_type":"article","og_title":"How to Add Items to a Bootstrap Form - Knowledge Base - Pair Networks","og_description":"Bootstrap gives you all the tools to easily customize your forms. With Bootstrap, you can add new form \u201ccontrols,\u201d like checkboxes or text areas, with an already established styling. This article will show you the basic ways to customize your form and the code needed to include each control.","og_url":"https:\/\/www.pair.com\/support\/kb\/how-to-customize-your-bootstrap-form\/","og_site_name":"Knowledge Base - Pair Networks","article_publisher":"https:\/\/www.facebook.com\/pairnetworks\/","article_modified_time":"2020-02-26T14:20:08+00:00","og_image":[{"url":"https:\/\/www.pair.com\/support\/kb\/wp-content\/uploads\/2019\/02\/input-image.png"}],"twitter_card":"summary_large_image","twitter_site":"@pairNetworks","twitter_misc":{"Est. reading time":"8 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/www.pair.com\/support\/kb\/how-to-customize-your-bootstrap-form\/","url":"https:\/\/www.pair.com\/support\/kb\/how-to-customize-your-bootstrap-form\/","name":"How to Add Items to a Bootstrap Form - Knowledge Base - Pair Networks","isPartOf":{"@id":"https:\/\/www.pair.com\/support\/kb\/#website"},"datePublished":"2017-12-21T16:18:43+00:00","dateModified":"2020-02-26T14:20:08+00:00","description":"Bootstrap gives you all the tools to easily customize your forms. With Bootstrap, you can add new form \u201ccontrols,\u201d like checkboxes or text areas, with an already established styling. This article will show you the basic ways to customize your form and the code needed to include each control.","breadcrumb":{"@id":"https:\/\/www.pair.com\/support\/kb\/how-to-customize-your-bootstrap-form\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.pair.com\/support\/kb\/how-to-customize-your-bootstrap-form\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/www.pair.com\/support\/kb\/how-to-customize-your-bootstrap-form\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.pair.com\/support\/kb\/"},{"@type":"ListItem","position":2,"name":"How to Add Items to a Bootstrap Form"}]},{"@type":"WebSite","@id":"https:\/\/www.pair.com\/support\/kb\/#website","url":"https:\/\/www.pair.com\/support\/kb\/","name":"Knowledge Base - Pair Networks","description":"","publisher":{"@id":"https:\/\/www.pair.com\/support\/kb\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.pair.com\/support\/kb\/?s={search_term_string}"},"query-input":"required name=search_term_string"}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/www.pair.com\/support\/kb\/#organization","name":"Pair Networks","url":"https:\/\/www.pair.com\/support\/kb\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.pair.com\/support\/kb\/#\/schema\/logo\/image\/","url":"https:\/\/www.pair.com\/support\/kb\/wp-content\/uploads\/2022\/02\/Gb_TUkUE_400x400.jpeg","contentUrl":"https:\/\/www.pair.com\/support\/kb\/wp-content\/uploads\/2022\/02\/Gb_TUkUE_400x400.jpeg","width":360,"height":360,"caption":"Pair Networks"},"image":{"@id":"https:\/\/www.pair.com\/support\/kb\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/pairnetworks\/","https:\/\/twitter.com\/pairNetworks","https:\/\/www.instagram.com\/pairnetworks\/","https:\/\/www.linkedin.com\/company\/2269676\/","https:\/\/www.pinterest.com\/pairnetworksinc\/pins\/","https:\/\/www.youtube.com\/user\/pairnetworks"]}]}},"_links":{"self":[{"href":"https:\/\/www.pair.com\/support\/kb\/wp-json\/wp\/v2\/ht-kb\/3265"}],"collection":[{"href":"https:\/\/www.pair.com\/support\/kb\/wp-json\/wp\/v2\/ht-kb"}],"about":[{"href":"https:\/\/www.pair.com\/support\/kb\/wp-json\/wp\/v2\/types\/ht_kb"}],"author":[{"embeddable":true,"href":"https:\/\/www.pair.com\/support\/kb\/wp-json\/wp\/v2\/users\/11"}],"replies":[{"embeddable":true,"href":"https:\/\/www.pair.com\/support\/kb\/wp-json\/wp\/v2\/comments?post=3265"}],"version-history":[{"count":28,"href":"https:\/\/www.pair.com\/support\/kb\/wp-json\/wp\/v2\/ht-kb\/3265\/revisions"}],"predecessor-version":[{"id":7426,"href":"https:\/\/www.pair.com\/support\/kb\/wp-json\/wp\/v2\/ht-kb\/3265\/revisions\/7426"}],"wp:attachment":[{"href":"https:\/\/www.pair.com\/support\/kb\/wp-json\/wp\/v2\/media?parent=3265"}],"wp:term":[{"taxonomy":"ht_kb_category","embeddable":true,"href":"https:\/\/www.pair.com\/support\/kb\/wp-json\/wp\/v2\/ht-kb-category?post=3265"},{"taxonomy":"ht_kb_tag","embeddable":true,"href":"https:\/\/www.pair.com\/support\/kb\/wp-json\/wp\/v2\/ht-kb-tag?post=3265"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}
This difference allows users to select multiple options at once.
\n<\/a><\/p>\n