# customButtons

> FullCalendar v3 documentation, for an old release. Web version: https://legacy.fullcalendar.io/v3/customButtons
>
> Latest version (v7): https://fullcalendar.io/docs/buttons.md

Defines custom buttons that can be used in the header/footer.

<div class='spec' markdown='1'>
Object
</div>

Specify a hash of custom buttons. Then reference them from the `header` setting. Like this:

```js
$('#calendar').fullCalendar({
  customButtons: {
    myCustomButton: {
      text: 'custom!',
      click: function() {
        alert('clicked the custom button!');
      }
    }
  },
  header: {
    left: 'prev,next today myCustomButton',
    center: 'title',
    right: 'month,agendaWeek,agendaDay'
  }
});
```

Each `customButton` entry accepts the following properties:

- `text` - the text to be display on the button itself
- `click` - a callback function that is called when the button is clicked. Accepts a single argument, a [jqueryEvent](https://api.jquery.com/category/events/event-object/).
- `icon` - see [buttonIcons](https://legacy.fullcalendar.io/v3/buttonIcons.md). optional
- `themeIcon` - see [themeButtonIcons](https://legacy.fullcalendar.io/v3/themeButtonIcons.md). optional
- `bootstrapGlyphicon` - see [bootstrapGlyphicons](https://legacy.fullcalendar.io/v3/bootstrapGlyphicons.md). optional

[See a demo of customButtons](https://legacy.fullcalendar.io/v3/toolbar-demo).