Toolbar

<div id="taskBoard"></div>

<script>
  $("#taskBoard").kendoTaskBoard({
    toolbar: [
      { type: "button", text: "Add Card", name: "addCard", text: "Add New Card", command: "CustomAddCardCommand", icon: "plus", showText: true },
      "spacer",
      "search"
    ],
    dataOrderField: "order",
    dataSource: [
      { id: 1, order: 1, title: "Task 1", description: "Description 1", status: "backlog", category: "red" },
      { id: 2, order: 2, title: "Task 11", description: "Description 11", status: "backlog", category: "red" },
      { id: 3, order: 3, title: "Task 2", description: "Description 2", status: "doing", category: "green" },
      { id: 4, order: 4, title: "Task 22", description: "Description 22", status: "doing", category: "green" },
      { id: 5, order: 5, title: "Task 3", description: "Description 3", status: "done", category: "blue" }
    ],
    columns: [
      { text: "Doing", status: "doing" },
      { text: "Backlog", status: "backlog" },
      { text: "Done", status: "done" }
    ]
  });

  kendo.ui.taskboard.commands["CustomAddCardCommand"] = kendo.ui.taskboard.Command.extend({
    exec: function () {
      var taskboard = this.taskboard;
      var options = this.options;

      taskboard.addCard({ status: "doing", title: "Add Title", description: "Add Description", category: "green" });
      taskboard.dataSource.sync();
    }
  });
</script>

<div id="taskBoard"></div>

<script>
  $("#taskBoard").kendoTaskBoard({
    toolbar: {
      items: [
        { type: "button", text: "Add Card", name: "addCard", text: "Add New Card", command: "CustomAddCardCommand", icon: "plus", showText: true },
        "spacer",
        "search"
      ]
    },
    dataOrderField: "order",
    dataSource: [
      { id: 1, order: 1, title: "Task 1", description: "Description 1", status: "backlog", category: "red" },
      { id: 2, order: 2, title: "Task 11", description: "Description 11", status: "backlog", category: "red" },
      { id: 3, order: 3, title: "Task 2", description: "Description 2", status: "doing", category: "green" },
      { id: 4, order: 4, title: "Task 22", description: "Description 22", status: "doing", category: "green" },
      { id: 5, order: 5, title: "Task 3", description: "Description 3", status: "done", category: "blue" }
    ],
    columns: [
      { text: "Doing", status: "doing" },
      { text: "Backlog", status: "backlog" },
      { text: "Done", status: "done" }
    ]
  });

  kendo.ui.taskboard.commands["CustomAddCardCommand"] = kendo.ui.taskboard.Command.extend({
    exec: function () {
      var taskboard = this.taskboard;
      var options = this.options;

      taskboard.addCard({ status: "doing", title: "Add Title", description: "Add Description", category: "green" });
      taskboard.dataSource.sync();
    }
  });
</script>

<div id="taskBoard"></div>
<script>
$("#taskBoard").kendoTaskBoard({
    toolbar: {
        overflow: {
            mode: "menu",
            scrollButtons: "auto",
            scrollButtonsPosition: "split"
        },
        items: [
            { text: "Button 1", icon: "plus" },
            { text: "Button 2", icon: "gear" },
            { text: "Button 3", icon: "star" }
        ]
    },
    dataSource: [
        { id: 1, title: "Task 1", status: "todo" }
    ],
    columns: [
        { text: "To Do", status: "todo" }
    ]
});
</script>