CKeditor- ExportPDF

Learn how to export PDF from CKeditor

Using CK editor and want to export the pdf of your content, this blog will guide you completely to make sure you get it done. Here I am assuming that you already have a basic ckeditor set up on your framework. If not then you can use the CKEditor Ecosystem Documentation to set up your first ck editor following the simple step guide :

Now focusing on our goal of appending exportPDF feature to the ckeditor. We can simply do that by making few changes in the ckeditor.js, ckeditor.js.map and the plugin files.

First Step: Build a new ckeditor on the CKeditor online builder

  • Select Classic as the editor type
  • Choose all the plugins you want and note that as exportPDF is a paid feature when you select it, it will automatically add cloud services to the plugin list if not already added as it essential for its use.
  • On the next step click on the items you want to pick for your editor, then select the language.
  • Your editor will be ready to build and download now. Download and extract it.
  • You can even check if you have build the desired editor by opening the index.html file in sample folder.

Second Step: Now as we are trying to access a premium feature and will be using cloud services we have to either buy or take a 30 day trial if it is for temporary purpose.

For taking a free trial visit — https://orders.ckeditor.com/trial/premium-features

Now once you are registered just login to CKEditor Ecosystem Dashboard

  • Choose CKEditor in Your Products
  • Click on Manage
  • Create a new environment by a name of your choice
  • Open the environment and click on generate development token URL which will be used in accessing the export pdf feature through cloud service.
  • You can even create your own token endpoint by choosing access credentials tab and then pressing Create a new access key

Third Step: Now we have done all the major work , all we have to do now is

  • Replace the content of ckeditor.js and ckeditor.map.js in your modules or app from the ckeditor.js and ckeditor.map.js files extracted from the built ckeditor.
  • In your plug in file update the plugin list by adding ExportPDF and configure it. Detailed instruction can be found on- https://ckeditor.com/docs/ckeditor5/latest/features/export-pdf.html
  • Here just replace the tokenUrl with your generated token
  • We are all done now, just complile your modules and restart your app,the new editor will be visible to you with exportPDF feature.

I hope the steps mentioned are helpful and solves your purpose.

--

--

Full Stack Developer

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store