# Optimizing for Print

Premium feature.

<script>
  import { pricingUrl } from '$docs-config';
</script>

FullCalendar looks great on a computer screen, but by default it does not look very good for printing on a piece of paper. A web browser isn't able to convert certain things consistently, such as absolute positioning and scrollbars. Fortunately FullCalendar can render differently for print if you configure it to do so.

It is a [premium plugin]({pricingUrl}). It is initialized in an [ES6 setup](initialize-es6.md) like so:

```
npm install --save fullcalendar-scheduler@{npmTag}
```

(Or a packages like `@fullcalendar/react-scheduler` for [React](react.md#fullcalendar-premium), [Vue](vue.md#fullcalendar-premium), and [Angular](angular.md#fullcalendar-premium))

Then, add it to your calendar's plugin list:

```js
import adaptivePlugin from 'fullcalendar-scheduler/adaptive'

let calendar = new Calendar({
  // ...other settings...
  plugins: [
    // ...other plugins...
    adaptivePlugin
  ]
})
```

**OR,** you can use the `fullcalendar-scheduler` [pre-built bundle](initialize-globals.md), which automatically includes the adaptive plugin.

After installing the plugin, print optimization will work automatically!


## Hiding Toolbar Buttons

By default, toolbar buttons are displayed in print view. You can hide them using this technique:

```js
new Calendar(calendarEl, {
  headerToolbar: {
    start: 'prev,next'
    center: 'title',
    end: 'dayGridMonth,timeGridWeek,timeGridDay',
  },
  buttonClass: 'print-hidden',
  buttonGroupClass: 'print-hidden',
})
```

CSS:

```css
@media print {
  .print-hidden {
    display: none;
  }
}
```

Or in Tailwind, use the `print:hidden` className.


## TimeGrid Print View

Browsers, especially Firefox, have a tough time displaying absolutely-positioned elements across pages, which makes [TimeGrid view](timegrid-view.md) especially problematic for print. Use the [eventPrintLayout](eventPrintLayout.md) setting to control this behavior.

## Images

- Print optimization in Timeline view
- Print optimization in DayGrid view
- Print optimization in TimeGrid view
