> ## Documentation Index
> Fetch the complete documentation index at: https://docs.symmetry.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Configuration methods

> The three ways to configure a CBS widget: inline JSON, an external URL, and the admin console, and how they combine.

A widget can be configured three ways. Use one, or combine all three; the same `data-defaults` object (a `model` of field values, plus `style` and `helptext`) applies to each method.

## Inline JSON

Pass a JSON object in the `data-defaults` attribute of the script tag. Self-contained, with nothing to host.

```html theme={null}
<script async src="https://calculators.symmetry.com/widget/js/salary.js?key=yourKey"
    data-defaults='{"model":{"grossPay":2500,"payFrequency":"biweekly"}}'></script>
```

## External URL (JSONP)

Point `data-defaults` at a hosted file that returns the object wrapped in `jsonCallback(...)`. Best for reusing configuration across pages. See [Load widget defaults from a URL](/cbs/widgets/defaults-from-url).

```html theme={null}
<script async src="https://calculators.symmetry.com/widget/js/salary.js?key=yourKey"
    data-defaults='{"url":"https://example.com/cbs/config.json"}'></script>
```

## Admin console

Set property/value pairs centrally, tied to your key, with no attribute needed. See [Manage widgets from the admin console](/cbs/widgets/admin-console).

## What you can configure

The `data-defaults` object accepts three kinds of content:

| Key        | Sets                                                                                             | Reference                                                    |
| ---------- | ------------------------------------------------------------------------------------------------ | ------------------------------------------------------------ |
| `model`    | Prefilled calculator inputs, field values like `grossPay`, `payFrequency`, `voluntaryDeductions` | [Object model and default properties](/cbs/api/object-model) |
| `style`    | Colors, fonts, layout per region                                                                 | [Styling reference](/cbs/widgets/styling)                    |
| `helptext` | Custom field help text                                                                           | [Help text customization](/cbs/widgets/customize-helptext)   |

For the complete list of configurable field names and accepted values, see [Object model and default properties](/cbs/api/object-model).

## How the methods combine

When more than one method sets the same property, they resolve together. Use **inline** values for page-specific overrides on top of **URL** or **admin console** defaults.