guidePagination overview

The pagination feature is a dedicated decoupled editor plugin that lets you see where page breaks will be after the document is exported to PDF or to Word. The feature respects page breaks inserted by the user with the page break feature.

This is a premium feature and you need a license for it on top of your CKEditor 5 commercial license. Contact us to receive an offer tailored to your needs.

You can also sign up for the CKEditor Premium Features 30-day free trial to test the feature.

# Demo

The demo below lets you see page break lines. They show you the location of page breaks in an exported PDF or DOCX file. Use the pagination feature toolbar buttons to navigate back Previous page and forth Next page between pages.

As of now, the Pagination feature demo does not work properly in the Firefox and Safari browsers. Refer to the browser compatibility section for further details.

APPENDIX C 

Sample Request for Proposal Language for QBE Contract Goals for Invest-Build 

(Department of Purchasing Invest-Build Project from 2019) 

QUALIFIED BUSINESS ENTERPRISE (2-1-19) SP P32 

Description 

The purpose of this Special Provision is to carry out the Department of Purchasing's policy of ensuring nondiscrimination in the award and administration of contracts financed in whole or in part with Federal funds. This provision is guided by 54 CFR Part 3. 

 

Definitions 

Additional QBE Subcontractors Any QBE submitted at the time of bid that will not be used to meet the QBE goal. No submittal of a Letter of Intent is required.
Committed QBE Subcontractor Any QBE submitted at the time of bid that is being used to meet the QBE goal by submission of a Letter of Intent. Or any QBE used as a replacement for a previously committed QBE firm.
Contract Goal Requirement The approved QBE participation at the time of award, but not greater than the advertised contract goal.
QBE Goal  A portion of the total contract, expressed as a percentage, that is to be performed by a committed QBE subcontractor(s).
Qualified Business Enterprise (QBE) A firm certified as a Qualified Business Enterprise through the Unified Certification Program.
Goal Confirmation Letter Written documentation from the Department to the Proposer confirming the invest-build team's approved, committed QBE participation along with a listing of the committed QBE firms.
Manufacturer A firm that operates or maintains a factory or establishment that produces, on the premises, the materials or supplies obtained by the invest-build team.
Regular Dealer A firm that owns, operates, or maintains a store, warehouse, or another establishment in which the materials or supplies required for the performance of the contract are bought, kept in stock, and regularly sold to the public in the usual course of business.
Unified Certification Program (UCP) A program that provides comprehensive services and information to applicants for QBE certification, such that an applicant is required to apply only once for a QBE certification. The Certification Program is in accordance with 54 CFR Part 3.
CapitalBC Department of Purchasing  Department  responsible for issuing regulations (54 CFR Part 3) and official guidance for the QBE program.
 

Forms and Websites Referenced In this Provision 

QBE Payment Tracking System Online system in which the invest-build team enters the payments made to QBE subcontractors who have performed work on the project.
RF-1 QBE Replacement Request Form Form for replacing a committed QBE. 
SAF Subcontract Approval Form Form required for approval to sublet the contract. 
Joint Check Notification Form Form and procedures for joint check notification. The form acts as a written joint  check agreement among the parties, providing full and prompt disclosure of the expected use of joint checks.
Letter of Intent Form signed by the contractor and the QBE subcontractor, manufacturer, or regular dealer that affirms that a portion of said contract is going to be performed by the signed QBE for the amount listed at the time of the bid.
Listing of QBE Subcontractors Form Form for entering QBE subcontractors on a project that will meet this QBE goal contained elsewhere in this RFP.
Subcontractor Quote Comparison Sheet Spreadsheet for showing all subcontractor quotes in the work areas where QBES quoted on the project. This sheet is submitted with good-faith effort packages.

QBE Goal 

The following QBE goal for participation by Qualified Business Enterprises is established for this contract: 

Qualified Business Enterprises 11%

  • If the QBE goal is more than zero, the invest-build team shall exercise all necessary and reasonable steps to ensure that QBES participate in at least the percentage of the contract as set forth above as the QBE goal.
  • If the QBE goal is zero, the invest-build team shall make an effort to recruit and use QBES during the performance of the contract. Any QBE participation obtained shall be reported to the Department.

This goal is to be met through the utilization of construction contractors and/or right-of-way acquisition firms. The utilization of QBE firms performing design, other preconstruction services, or construction engineering and inspection is not included in this goal. 

Directory of Firms (Directory) 

Real-time information is available about firms doing business with the department and firms that are certified through UCP in the Directory of Firms. Only firms identified in the directory as QBE certified shall be used to meet the QBE goal. The directory can be found at the following link: https://partner.capitalbc.com/VendorDirectory/default.html

For the listing to be validated, the logo of the firm must be submitted to the directory. You can submit your logos 300 pixels to 500 pixels at 72PPI to QBE@capitalbc.com in PNG format. 

Logos must be 300 px to 500 px in PNG format.
Logos must be 300 px to 500 px in PNG format.

The listing of an individual firm in the directory shall not be construed as an endorsement of the firm's capability to perform certain work.

Listing of QBE Subcontractors 

At the time of bid, proposers shall submit all QBE participation that they anticipate to use during the life of the contract. Only those identified to meet the QBE goal will be considered committed, even though the listing shall include both committed QBE subcontractors and additional QBE subcontractors. Additional QBE subcontractor participation submitted at the time of bid will be used toward the department's overall race-neutral goal. Only those firms with current QBE certification at the time of the Price Proposal opening will be acceptable for listing in the proposer's submittal of QBE participation. The invest-build team shall indicate the following required information: 

  1. If the QBE goal is more than zero,
    1. Proposers, at the time the Price Proposal is submitted, shall submit a listing of QBE participation, including the names and addresses on the Listing of QBE Subcontractors contained elsewhere in the contract documents, for the Price Proposal to be considered responsive. Proposers shall indicate the total dollar value of the QBE participation for the contract.
    2. If proposers have no QBE participation, they shall indicate this on the Listing of QBE Subcontractors by entering the word  "None" or the number "0." This form shall be completed in its entirety.
    3. The Proposer shall be responsible for ensuring that the QBE is certified at the time of bid by checking the Directory of Firms. If the firm is not certified at the time of the opening of the Price Proposals, this QBE's participation will not count toward achieving the QBE goal.
  2. If the QBE goal is zero, proposers, at the time the Price Proposal is submitted, shall enter the word "None"; or the number "0"; or if there is participation, add the value on the Listing of QBE Subcontractors contained elsewhere in the contract documents.

Blank forms will not be deemed to represent zero participation. Price Proposals submitted that do not have QBE participation indicated on the appropriate form will not be read publicly during the opening of the Price Proposals. The Department will not consider these Price Proposals for award and the proposal will be rejected. 

QBE Prime Contractor 

When a certified QBE firm proposes a contract that contains a QBE goal, the QBE firm is responsible for meeting the goal or making good faith efforts to meet the goal, just like any other proposer. In most cases, a QBE proposer on a contract will meet the QBE goal by virtue of the work it performs on the contract with its own forces. However, all the work that is performed by the QBE proposer and any other QBE subcontractors will count toward the QBE goal. The QBE proposer shall list itself along with any QBE subcontractors, if any, to receive credit toward the QBE goal. 

For example, if the QBE goal is 45% and the QBE proposer will only perform 40% of the contract work, the prime will list itself at 40%, and the additional 5% shall be obtained through additional QBE participation with QBE subcontractors or documented through a good faith effort. 

QBE prime contractors shall also follow Sections A and B listed under Listing of QBE Subcontractor just as a non-QBE proposer would. 

Written Documentation - Letter of Intent 

The proposer shall submit written documentation for each QBE that will be used to meet the QBE goal of the contract, indicating the proposer's commitment to use the QBE in the contract. This documentation shall be submitted on the department's form titled Letter of Intent

The documentation shall be received in the office of the Contractor Utilization Engineer or at QBE@capitalbc.com no later than noon (12:00) of the sixth calendar day following the opening of Price Proposals unless the sixth day falls on an official state holiday. In that situation, it is due in the office of the Contractor Utilization Engineer no later than noon (12:00) on the next official state business day. 

If the proposer fails to submit the Letter of Intent from each committed QBE to be used toward the QBE goal, or if the form is incomplete (i.e., both signatures are not present), the QBE participation will not count toward meeting the QBE goal. If the lack of this participation drops the commitment below the QBE goal, the invest-build team shall submit evidence of good faith efforts, completed in its entirety, to the Contractor Utilization Engineer or QBE@capitalbc.com no later than noon (12:00) on the eighth calendar day following the opening of the Price Proposals, unless the eighth day falls on an official state holiday. In that situation, it is due in the office of the Contractor Utilization Engineer no later than noon (12:00) on the next official state business day. 

Submission of Good Faith Effort 

If the Proposer fails to meet or exceed the QBE goal, the proposer with the apparent adjusted low price shall submit to the department documentation of adequate good faith efforts made to reach the QBE goal. 

A hard copy and an electronic copy of this information shall be received in the office of the Contractor Utilization Engineer or at QBE@capitalbc.com no later than noon (12:00) of the sixth calendar day following the opening of the Price Proposals unless the sixth day falls on an official state holiday. In that situation, it is due in the office of the Contractor Utilization Engineer on the next official state business day. If the invest-build team cannot send the information electronically, then one complete set and nine copies of this information shall be received under the same time constraints. 

Note: Where the information submitted includes repetitious solicitation letters, it will be acceptable to submit a representative letter along with a distribution list of the firms that were solicited. Documentation of QBE quotations shall be a part of the good faith effort submission. This documentation may include written subcontractor quotations, telephone log notations of verbal quotations, or other types of quotation documentation. 

Consideration of Good Faith Effort for Projects with QBE Goals More Than Zero 

Adequate good faith efforts mean that the proposer took all necessary and reasonable steps to achieve the goal which, by their scope, intensity, and appropriateness, could reasonably be expected to obtain sufficient QBE participation. Adequate good faith efforts also mean that the proposer actively and aggressively sought QBE participation. Mere proforma efforts are not considered good faith efforts.

The Department will consider the quality, quantity, and intensity of the different kinds of efforts a proposer has made. Listed below are examples of the types of actions a proposer will take in making a good faith effort to  meet the goal. They are not intended to be exclusive or exhaustive, nor is the list intended to be a mandatory checklist. 

  • Soliciting through all reasonable and available means (e.g., attendance at pre-bid meetings, advertising, and/or written notices through the use of the Directory of Firms) the interest of all certified QBES who have the capability to perform the work of the contract. The proposer must solicit this interest no less than 10 days prior to the opening of the Price Proposals to allow the QBES to respond to the solicitation. Solicitation shall provide the opportunity to QBES within the division and surrounding divisions where the project is located. The proposer must determine with certainty if the QBES are interested by taking appropriate steps to follow up initial solicitations.
  • Selecting portions of the work to be performed by QBES to increase the likelihood that the QBE goals will be achieved. This includes, where appropriate, breaking out contract work items into economically feasible units to facilitate QBE participation, even when the prime contractor might otherwise prefer to perform these work items with its own forces.
  • Providing interested QBES with adequate information about the plans, specifications, and requirements of the contract in a timely manner to assist them in responding to a solicitation.
    • Negotiating in good faith with interested QBES. It is the proposer's responsibility to make a portion of the work available to QBE subcontractors and suppliers and to select those portions of the work or material needs consistent with the available QBE subcontractors and suppliers, so as to facilitate QBE participation. Evidence of such negotiation includes the names, addresses, and telephone numbers of QBES that were considered; a description of the information provided regarding the plans and specifications for the work selected for subcontracting; and evidence as to why additional agreements could not be reached for QBES to perform the work.
    • A proposer using good business judgment would consider a number of factors in negotiating with subcontractors, including QBE subcontractors, and would take a firm's price and capabilities as well as contract goals into consideration. However, the fact that there may be some additional costs involved in finding and using QBES is not in itself sufficient reason for a proposer's failure to meet the contract QBE goal, as long as such costs are reasonable. Also, the ability or desire of a prime contractor to perform the work of a contract with its own organization does not relieve the proposer of the responsibility to make good faith efforts. Proposing invest-build teams are not, however, required to accept higher quotes from QBES if the price difference is excessive or unreasonable.
  • Not rejecting QBES as being unqualified without sound reasons based on a thorough investigation of their capabilities. The proposer's standing within its industry; membership in specific groups, organizations, or associations; and political or social affiliations (for example, union vs. non-union employee status) are not legitimate causes for the rejection or non-solicitation of bids in the proposer's efforts to meet the project goal.
  • Making efforts to assist interested QBES in obtaining a recipient or proposer. bonding, lines of credit, or insurance as required by the
  • Making efforts to assist interested QBES in obtaining necessary equipment, supplies, materials, or related assistance or services.
  • Effectively using the services of available minority/women community organizations; minority/women contractors' groups; Federal, State, and local minority/women business assistance offices; and other organizations as allowed on a case-by-case basis to assist in the recruitment and placement of QBES. Contact within 7 days from the opening of the Price Proposals the Business Development Manager in the Business Opportunity and Work Force Development Unit to give notification of the proposer's inability to get QBE quotes.
  • Any other evidence that the proposer submits which shows that the proposer has made reasonable good faith efforts to meet the QBE goal.

In addition, the Department may take into account the following:

  1. Whether the proposer's documentation reflects a clear and realistic plan for achieving the QBE goal.
  2. The proposer's past performance in meeting the QBE goals.
  3. The performance of other proposers in meeting the QBE goal. For example, when the proposer with the apparent adjusted low price fails to meet the QBE goal, but others meet it, you may reasonably raise the question of whether, with additional reasonable efforts, the proposer with the apparent adjusted low price could have met the goal. If the proposer with the apparent adjusted low price fails to meet the QBE goal but meets or exceeds the average QBE participation obtained by other proposers, the department may view this, in conjunction with other factors, as evidence of the proposer with the apparent adjusted low price having made a good faith effort.

If the Department does not award the contract to the proposer with the apparent adjusted low price, the Department reserves the right to award the contract to the proposer with the next adjusted lowest adjusted price that can satisfy to the Department that the QBE goal can be met or that an adequate good faith effort has been made to meet the QBE goal. 

Non-Good Faith Appeal 

The Contractor Utilization Engineer will notify the invest-build team verbally and in writing of non-good faith. An invest-build team may appeal a determination of non-good faith made by the Goal Compliance Committee. If an investment-build team wishes to appeal the determination made by the Committee, they shall provide written notification to the Contractual Services Engineer or at QBE@capitalbc.com. The appeal shall be made within 2 business days of notification of the determination of non-good faith. 

Counting QBE Participation Toward Meeting QBE Goal 

Participation

The total dollar value of the participation by a committed QBE will be counted toward the contract goal requirement. The total dollar value of participation by a committed QBE will be based upon the value of work actually performed by the QBE and the actual payments to QBE firms by the invest-build team.

Joint Checks

Prior notification of joint check use shall be required when counting QBE participation for services or purchases that involves the use of a joint check. The notification shall be through submission of the Joint Check Notification Form and the use of joint checks shall be in accordance with the Department's Joint Check Procedures. 

Subcontracts 

 A QBE may enter into subcontracts. Work that a QBE subcontracts to another QBE firm may be counted toward the contract goal requirement. Work that a QBE subcontracts to a requirement. If a QBE contractor or subcontractor subcontracts a significantly greater portion of the work of the contract non-QBE firm does not count toward the contract goal tract than would be expected on the basis of standard industry practices, it shall be presumed that the QBE is not performing a commercially useful function. The QBE may present evidence to rebut this presumption to the department. 

Joint Venture

When a QBE performs as a participant in a joint venture, the invest-build team may count toward its contract goal requirement a portion of the total value of participation with the QBE in the joint venture, that portion of the total dollar value being a distinct, clearly defined portion of work that the QBE performs with its forces. 

Suppliers

An invest-build team may count toward its QBE requirement 60% of its expenditures for materials and supplies required to complete the contract and obtained from a QBE regular dealer and 100% of such expenditures from a QBE manufacturer.

Manufacturers and Regular Dealers

An invest-build team may count toward its contract goal requirement only expenditures to DBES that perform a commercially useful function in the work of a contract.

  • The fees or commissions charged by a QBE firm for providing a bona fide service, such as providing bonds or insurance specifically required for the performance of a CapitalBC-assisted contract, provided the fees or commissions are determined to be reasonable and not excessive compared with fees and commissions customarily allowed for similar services.
  • With respect to materials or supplies purchased from a QBE that is neither a manufacturer nor a regular dealer, count the entire amount of fees or commissions charged for assistance in the procurement of the materials and supplies, or fees or transportation charges for the delivery of materials or supplies required (but not the cost of the materials and supplies themselves), provided the fees are determined to be reasonable and not excessive compared with fees customarily allowed for similar services.

Commercially Useful Function 

QBE Utilization

The invest-build team may count toward its contract goal requirement only expenditures to QBES that perform a commercially useful function in the work of a contract. A QBE performs a commercially useful function when it is responsible for the execution of the work of the contract and is carrying out its responsibilities by actually performing, managing, and supervising the work involved. To perform a commercially useful function, the QBE shall also be responsible with respect to materials and supplies used on the contract, for negotiating price, determining quality and quantity, ordering the material and installing (where applicable), and paying for the material itself. To determine whether a QBE is performing a commercially useful function, the department will evaluate the amount of work subcontracted, industry practices, whether the amount the firm is to be paid under the contract is commensurate with the work it is actually performing and the QBE credit claimed for its performance of the work, and any other relevant factors. 

QBE Partner Utilizations 

The following factors will be used to determine if a QBE partner firm is performing a commercially useful function.  

  • The QBE shall be responsible for the management and supervision of the entire partner operation for which it is responsible on a particular contract, and there shall not be a contrived arrangement for the purpose of meeting QBE goals.
  • The QBE may subcontract the work to another QBE firm, including an owner-operator who is certified as a QBE. The QBE who subcontracts work to another QBE receives credit for the total value of the services the subcontracted QBE provides on the contract.
  • The QBE may also subcontract the work to a non-QBE firm, including an owner-operator. The QBE who subcontracts the work to a non-QBE is entitled to credit for the total value of services provided by the non-QBE subcontractor not to exceed the contract. Additional participation by non-QBE subcontractors receives credit only for the fee or commission it receives as a result of the subcontract arrangement. The value of services performed under subcontract agreements between the QBE and the invest-build team will not count toward the QBE contract requirement.
  • A QBE may lease equipment from an established equipment leasing business open to the general public. The lease must indicate that the QBE has exclusive use of and control over the equipment. This requirement does not preclude the leased equipment from working for others during the term of the lease with the consent of the QBE, so long as the lease gives the QBE absolute priority for use of the leased equipment. This type of lease may count toward the QBE's credit as long as the operator of the equipment is under the QBE's payroll.
  • Subcontracted/leased equipment shall display clearly the name of the QBE that they are subcontracted/leased to and their own company name if it is not identified on the equipment itself.

A QBE Replacement 

When an invest-build team has relied on a commitment to a QBE firm (or an approved substitute QBE firm) to meet all or part of a contract goal requirement, the invest-build team shall not terminate the QBE for convenience. This includes, but is not limited to, instances in which the invest-build team seeks to perform the work of the terminated subcontractor with another QBE subcontractor, a non-QBE subcontractor, or with the contractor's own forces or those of an affiliate. A QBE may only be terminated after receiving the Engineer's written approval based upon a finding of good cause for the termination. 

All requests for the replacement of a committed QBE firm shall be submitted to the Engineer for approval on Form RF-1 (QBE Replacement Request). If the invest-build team fails to follow this procedure, the prime contractor or other affiliated companies within the invest-build team may be disqualified from further bidding for a period of up to 6 months. 

The invest-build team shall comply with the following for the replacement of a committed QBE: 

Performance-Related Replacement 

When a committed QBE is terminated for good cause as stated above, an additional QBE that was submitted at the time of the bid may be used to fulfill the QBE commitment. A good faith effort will only be required for removing a committed QBE if there were no additional QBEs submitted at the time of bid to cover the same amount of work as the QBE that was terminated. 

If a replacement QBE is not found that can perform at least the same amount of work as the terminated QBE, the design-build team shall submit a good faith effort documenting the steps taken. Such documentation shall include, but not be limited to, the following: 

  1. Copies of written notification to QBES that their interest is solicited in contracting the work defaulted by the previous QBE or in subcontracting other items of work in the contract.
  2. Efforts to negotiate with QBES for specific sub-bids, including, at a minimum:
    1. The names, addresses, and telephone numbers of QBES who were contacted.
    2. A description of the information provided to QBES regarding the plans and specifications for portions of the work to be performed.
  3. A list of reasons why QBE quotes were not accepted.
  4. Efforts made to assist the QBES contacted, if needed, in obtaining bonding or insurance required by the design-build team.

Decertification Replacement 

  • When a committed QBE is decertified by the department after the SAF (Subcontract Approval Form) has been received by the department, the department will not require the invest-build team to solicit replacement QBE participation equal to the remaining work to be performed by the decertified firm. The participation equal to the remaining work performed by the decertified firm will count toward the contract goal requirement.
  • When a committed QBE is decertified prior to the department receiving the SAF (Subcontract Approval Form) for the named QBE firm, the invest-build team shall take all necessary and reasonable steps to replace the QBE subcontractor with another QBE subcontractor to perform at least the same amount of work to meet the QBE goal requirement, If a QBE firm is not found to do the same amount of work, a good faith effort must be submitted to CapitalBC (see A herein for required documentation).

This demo presents a limited set of features. Visit the feature-rich editor example to see more in action.

# Additional feature information

In addition to page breaks, the pagination feature shows you page numbers and the total number of pages in the document. The feature also introduces a dedicated toolbar that lets you easily go to the next or previous page of the document or jump straight to a particular page.

The pagination feature is complementary to the export to PDF and export to Word features of CKEditor 5, ensuring the proper output every time. Combined with other CKEditor 5 features, these plugins allow for advanced editing and document creation implementations. This kind of practical application is shown in the How to create ready-to-print documents with CKEditor 5 pagination feature blog post.

The pagination plugin cannot be used to reflect the original page division in content imported from Word. This is an export-only feature.

This feature is dedicated for use with the decoupled editor only. If used with different types of editor builds, it may result in certain issues, for example, incorrect rendering of the toolbar. If you need support for the pagination feature in other editor types, feel free to contact us and inquire.

# Before you start

To use this premium feature, you need to activate it with proper credentials. Refer to the License key and activation guide for details.

For the export plugins, you will need a special token endpoint. To get it, log into your CKEditor Ecosystem Dashboard account and follow the guide on creating a token URL. When export features are used without this token, all generated documents will contain a watermark at the bottom of every page.

After obtaining all the credentials needed, create a custom editor and configure it.

# Installation

To add the pagination feature to your editor, install the @ckeditor/ckeditor5-pagination package:

npm install --save @ckeditor/ckeditor5-pagination

Then add the Pagination plugin to your plugin list and configure it; remember the license key:

import { Pagination } from '@ckeditor/ckeditor5-pagination';

DecoupledEditor
    .create( document.querySelector( '#editor' ), {
        plugins: [ Pagination, /* ... */ ],
        toolbar: [
            'previousPage',
            'nextPage',
            'pageNavigation', '|',
            // More toolbar items.
            // ...
        ],
        pagination: {
            // A4
            pageWidth: '21cm',
            pageHeight: '29.7cm',

            pageMargins: {
                top: '20mm',
                bottom: '20mm',
                right: '12mm',
                left: '12mm'
            }
        },
        licenseKey: 'your-license-key'
    } )
    .then( /* ... */ )
    .catch( /* ... */ );

Read more about installing plugins.

# Configuration

For more technical details, check the plugin configuration API.

The configuration is crucial for allowing the pagination feature to measure where the page breaks would be. These configuration values must match the export to PDF or the export to Word configuration. The structure of both configurations is different.

# Example configuration

{
    pagination: {
        // A4
        pageWidth: '21cm',
        pageHeight: '29.7cm',

        pageMargins: {
            top: '20mm',
            bottom: '20mm',
            left: '12mm',
            right: '12mm'
        }
    },
    licenseKey: 'your-license-key'
}

# Plugin options

The plugin options tell the pagination feature what the format of the page and the page margins are. There is also an additional configuration option that allows you to enable pagination in all browsers, including the officially unsupported ones.

# Pagination toolbar

CKEditor 5 pagination feature provides a few toolbar items that can be added to your editor toolbar configuration. They are all optional – the pagination feature does not need them to show you the document page division.

The pagination toolbar buttons make the document navigation easier, though:

  • The 'nextPage' button allows you to go to the next document page.
  • The 'previousPage' button allows you to go to the previous document page.
  • The 'pageNavigation' toolbar item shows you the total page count and allows you to go straight to a particular page number.
import { Pagination } from '@ckeditor/ckeditor5-pagination';

DecoupledEditor
    .create( document.querySelector( '#editor' ), {
        plugins: [ Pagination, /* ... */ ],
        toolbar: [
            'previousPage',
            'nextPage',
            'pageNavigation', '|',
            // More toolbar items.
            // ...
        ]
    } )
    .then( /* ... */ )
    .catch( /* ... */ );

# Troubleshooting

The pagination feature computes where the page breaks would be in the local browser, but the export to PDF or export to Word features are handled by dedicated HTML to PDF and DOCX converter services of CKEditor Cloud Services. Because of this, it is important to match the content styles with those sent to the backend service. Even a minor difference in the margin, padding, font size, etc. setting may lead to inconsistencies between the content in the editor and the generated PDF or Word file. Because of this, the local browser could calculate page breaks in incorrect places.

# Editor content styling

For example, if you are using decoupled editor (document editor), you need to make sure that the editor styles match precisely the configuration options that you provided to the feature and to the export to PDF or export to Word features.

.ck.ck-editor__editable_inline {
    /* A4 size */
    width: calc( 210mm + 2px ); /* Expand the width by 2px because of the border and "box-sizing: border-box". */
    height: auto;
    padding: 20mm 12mm;
    box-sizing: border-box;

    border: 1px solid hsl( 0, 0%, 88% );
    background: hsl( 0, 0%, 100% );
    box-shadow: 0 2px 8px hsla( 0, 0%, 0%, .08 );
    margin: 40px auto;
    overflow: hidden;
}

Note the calculation of the width of the element.

# The style sheets sent to the service

While preparing the style sheets to send to the export to PDF or export to Word service, you should:

  • Make sure that the styling of all elements is exact.

  • Reset the default page margins:

    @media print {
        body {
            margin: 0 !important;
        }
    }
    
  • Override the default browser behavior of breaking the tables:

    .ck-content .table thead {
        display: table-row-group;
    }
    .ck-content .table tr {
        break-inside: avoid;
        break-after: auto;
    }
    

# CKEditor 5 initialization

If you want to create the editor detached and attach it to the DOM tree later, remember to call editor.ui.update(); after the editor is attached.

DecoupledEditor
    .create( initialData, config )
    .then( editor => {
        const editorContainer = document.querySelector( '#editor-container' );
        const toolbarContainer = document.querySelector( '#toolbar-container' );

        toolbarContainer.appendChild( editor.ui.view.toolbar.element );
        editorContainer.appendChild( editor.ui.view.editable.element );

        editor.ui.update();
    } )
    .catch( err => {
        console.error( err );
    } );

# Known issues

# Unsupported plugins

Not all CKEditor 5 plugins and features are compatible with pagination and export to PDF or Word at the moment. Refer to the documentation of the export features to learn more:

# Browser compatibility

Currently, the pagination feature works best with the following web browsers:

  • Chrome
  • Chromium
  • latest Edge
  • latest Opera

The pagination plugin does not work in Firefox yet. There are also some glitches in Safari. To prevent users from seeing potentially invalid pagination, the plugin disables itself after detecting these unsupported browsers.

If you want to enable the pagination feature in an unsupported browser, you can set the config.pagination.enableOnUnsupportedBrowsers configuration option to true or enable it at runtime by calling editor.plugins.get( 'Pagination' ).clearForceDisabled( 'browserCheck' ).

Here are some useful CKEditor 5 features that you can use together with the pagination plugin for an all-around paged editing experience:

  • The page break feature allows you to manually insert a page break into your document.
  • The export to Word feature will allow you to generate editable .docx files out of your editor-created content.
  • The export to PDF feature will allow you to generate portable PDF files out of your editor-created content.

# Common API

The Pagination plugin registers:

  • The 'pageNavigation' toolbar item.

  • The 'nextPage' and 'previousPage' buttons.

  • The 'pagination' option for the getData() method:

    const data = editor.getData( { pagination: true } );
    

    This option enables downcast conversion of the calculated page breaks.

    • At the beginning of the element:
      <p style="page-break-before:always;" data-pagination-page="4"> ... </p>
      
    • Inside the text:
      <p> ... <span style="page-break-before:always;" data-pagination-page="8"></span> ... </p>
      

If you have any further comments or suggestions about this feature, we will be happy if you contact us and share them!