Page break
The page break feature lets you insert page breaks into your content. This gives you more control over the final structure of a document that is printed or exported to PDF or Word.
# Demo
Use the insert page break toolbar button
to see the feature in action. Use the “Open print preview” button below the editor to preview the content.This demo presents a limited set of features. Visit the feature-rich editor example to see more in action.
# Installation
⚠️ New import paths
Starting with version 42.0.0, we changed the format of import paths. This guide uses the new, shorter format. Refer to the Packages in the legacy setup guide if you use an older version of CKEditor 5.
After installing the editor, add the feature to your plugin list and toolbar configuration:
import { ClassicEditor, PageBreak } from 'ckeditor5';
ClassicEditor
.create( document.querySelector( '#editor' ), {
licenseKey: '<YOUR_LICENSE_KEY>', // Or 'GPL'.
plugins: [ PageBreak, /* ... */ ],
toolbar: [ 'pageBreak', /* ... */ ],
} )
.then( /* ... */ )
.catch( /* ... */ );
# Related features
Here are some useful CKEditor 5 features that you can use together with the page break plugin for an all-around paged editing experience:
- The pagination feature allows you to see where page breaks would be after the document is exported to PDF or to Word.
- The export to Word feature will allow you to generate editable, paged
.docx
files out of your editor-created content. - The export to PDF feature will allow you to generate portable, paged PDF files out of your editor-created content.
# Common API
The PageBreak
plugin registers:
- the UI button component (
'pageBreak'
), - the
'pageBreak'
command implemented byPageBreakCommand
.
You can execute the command using the editor.execute()
method:
// Inserts a page break into the selected content.
editor.execute( 'pageBreak' );
We recommend using the official CKEditor 5 inspector for development and debugging. It will give you tons of useful information about the state of the editor such as internal data structures, selection, commands, and many more.
# Contribute
The source code of the feature is available on GitHub at https://github.com/ckeditor/ckeditor5/tree/master/packages/ckeditor5-page-break.
Every day, we work hard to keep our documentation complete. Have you spotted outdated information? Is something missing? Please report it via our issue tracker.
With the release of version 42.0.0, we have rewritten much of our documentation to reflect the new import paths and features. We appreciate your feedback to help us ensure its accuracy and completeness.