# SplitButton Content Setup

The SplitButton allows you to set the label of its main button either through the [`text`](https://www.telerik.com/kendo-angular-ui-develop/components/buttons/api/splitbuttoncomponent#text) property or by adding content between the opening and the closing tags of the component. If you use both, the content renders after the `text` value.

The following demo shows both options.

[Demo Source](https://demos.telerik.com/kendo-angular-ui/demos/buttons/splitbutton/content/source.txt)

## Main Button Label

Set the [`text`](https://www.telerik.com/kendo-angular-ui-develop/components/buttons/api/splitbuttoncomponent#text) property to provide the main SplitButton plain-text label:

```html
<kendo-splitbutton [data]="data" text="Save as"></kendo-splitbutton>
```

To combine text with custom markup, such as an underlined access key, add the markup between the component tags. For information on adding an icon or an image next to the label, see [Icon Options](https://www.telerik.com/kendo-angular-ui-develop/components/buttons/splitbutton/icons).

## Popup Items

The content between the component tags renders in the main button, not in the popup. Use the [`data`](https://www.telerik.com/kendo-angular-ui-develop/components/buttons/api/splitbuttoncomponent#data) property to define the popup items. For more details, see [Data Binding](https://www.telerik.com/kendo-angular-ui-develop/components/buttons/splitbutton/data-binding).

## Suggested Links

* [API Reference of the SplitButton](https://www.telerik.com/kendo-angular-ui-develop/components/buttons/api/splitbuttoncomponent)
* [Data Binding](https://www.telerik.com/kendo-angular-ui-develop/components/buttons/splitbutton/data-binding)
* [Icon Options](https://www.telerik.com/kendo-angular-ui-develop/components/buttons/splitbutton/icons)
