Add hindi font in CK editor

Question

I want to add hindi fonts in ck editor. I added following css in content.css of ckeditor.

font-family: 'kruti_dev_010regular';
src: url('fonts/kruti_dev_010-webfont.eot');
src: url('fonts/kruti_dev_010-webfont.eot?#iefix') format('embedded-opentype'),
     url('fonts/kruti_dev_010-webfont.woff2') format('woff2'),
     url('fonts/kruti_dev_010-webfont.woff') format('woff'),
     url('fonts/kruti_dev_010-webfont.ttf') format('truetype'),
     url('fonts/kruti_dev_010-webfont.svg#kruti_dev_010regular') format('svg');
font-weight: normal;
font-style: normal;
}

And i added the following line into config.js of ck editor:

config.font_names = 'Kruti Dev 010/"krutidev_010";' + config.font_names;

I generate the fonts and css by using this link:

Webfont Generator

And i added all generated fonts into fonts/ folder in my ckeditor app.

Now kurti dev fonts is appearing in font style drop down but hindi font is not applying by this. Where is the problem in my code ?

Answer 1

1. Download hindi font Kruti010 fonts.here

   Add this in Config.js of CkEditor ......

   config.font_names = 'Hindi/Kruti;' + config.font_names;
   

   add hindi fonts in ck editor's langs folder.

   ckeditor/lang/Kruti/k010.ttf
   

   add css in content.css of ckeditor.

   @font-face {
       font-family: 'Kruti';
       src: url('lang/Kruti/k010.eot');
       src: local("Hindi"), url("lang/Kruti/k010.ttf") format("truetype");
       font-weight: normal;
       font-style: normal;
       }
   

   check your path properly.