# Scheduler Plugin

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

The Scheduler plugin provides you with two extra calendar views to use, both of which are good at displaying *resources* (things that events can be assigned to, like rooms):

- [Timeline View](https://legacy.fullcalendar.io/v3/timeline-view.md) - good at displaying a large number of resources
- [Vertical Resource View](https://legacy.fullcalendar.io/v3/vertical-resource-view.md) - good at displaying a fewer number of resources

Scheduler is a [premium plugin](https://fullcalendar.io/pricing) that has different licensing than the core FullCalendar library. [More information &raquo;](https://fullcalendar.io/license)


## Installation with Script Tags

In the `<head>` of your page, include the necessary FullCalendar *and* Scheduler files:

```html
<link href='fullcalendar.css' rel='stylesheet' />
<link href='scheduler.css' rel='stylesheet' />
<script src='moment.js'></script>
<script src='jquery.js'></script>
<script src='fullcalendar.js'></script>
<script src='scheduler.js'></script>
```

The ordering of the `<script>` tags is important.


## Installation as an NPM Module (Webpack / Browserify)

Use NPM to install FullCalendar:

```sh
npm install jquery moment fullcalendar fullcalendar-scheduler
```

Then, you must install a build system like [Webpack](https://webpack.js.org/) or [Browserify](https://browserify.org/) that will automatically bundle all of your code. [See an example repo that uses Webpack &raquo;](https://github.com/fullcalendar/scheduler-webpack-example/tree/v3)

Then, write a module that imports both jQuery, FullCalendar, and Scheduler:

```js
import $ from 'jquery';
import 'fullcalendar';
import 'fullcalendar-scheduler';
```

You must also somehow include FullCalendar's `fullcalendar.css` and Scheduler's `scheduler.css`, either manually with a `<link>` tag or via Webpack's [css-loader](https://github.com/webpack-contrib/css-loader).


## Initializing a View

To learn how to initialize a calendar with a resource view, see the documentation for [Timeline View](https://legacy.fullcalendar.io/v3/timeline-view.md) and [Vertical Resource View](https://legacy.fullcalendar.io/v3/vertical-resource-view.md).

## Demos

- [timelineDay, timelineWeek, timelineMonth views](https://legacy.fullcalendar.io/v3/timeline-standard-view-demo)
- [1-day vertical resource view](https://legacy.fullcalendar.io/v3/vertical-resource-standard-demo)
