edit doc


Defines custom buttons that can be used in the headerToolbar/footerToolbar.


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

var calendar = new Calendar(calendarEl, {
  customButtons: {
    myCustomButton: {
      text: 'custom!',
      click: function() {
        alert('clicked the custom button!');
  headerToolbar: {
    left: 'prev,next today myCustomButton',
    center: 'title',
    right: 'dayGridMonth,timeGridWeek,timeGridDay'

Each customButton entry accepts the following properties:

See a demo of customButtons.