Problem with new font in paragraph Rich Text Editor
Hi all,
I imported a new font in Pega. I visualize it correctly in my skin, but when I try to import it in RTE with the rule UserWorkForm, I see it in the menu but it seems a default font.
There is something wrong? Can someone help me?
Thanks in advance.
Accepted Solution
Pegasystems Inc.
US
Pegasystems Inc.
IN
Hi,
Have you followed the steps mentioned here:
Thank You
Accepted Solution
Pegasystems Inc.
US
Below is an example to add Marry Ann font in Rich Text Editor. User has .otf files of the custom font.
Add the following code in userWorkForm:
<script>
window.customCKEditorFonts = 'Marry Ann/marryAnnCustomefont;Arial/Arial, Helvetica, sans-serif;Comic Sans MS/Comic Sans MS, cursive;Courier New/Courier New, Courier, monospace;Georgia/Georgia, serif;Lucida Sans Unicode/Lucida Sans Unicode, Lucida Grande, sans-serif;Tahoma/Tahoma, Geneva, sans-serif;Times New Roman/Times New Roman, Times, serif;Trebuchet MS/Trebuchet MS, Helvetica, sans-serif;Verdana/Verdana, Geneva, sans-serif';
pega.u.d.attachOnload( function() {
debugger;
if(typeof CKEDITOR != 'undefined'){
CKEDITOR.on('instanceReady', function(evt) {
var editor = evt.editor;
$(editor.document.$.body).append("<style>@font-face {font-family: \"marryAnnCustomefont\";src: url(webwb/pzfontMaryAnnRegular.otf);src: local(\"marryAnnCustomefont\"), url(\"webwb/pzfontMaryAnnRegular.otf\") format(\"opentype\");}</style>");
});
}
});
</script>
Note : font file has to be in this case webwb/pzfontMaryAnnRegular.otf
Reply S.P.A.
IT
Thanks a lot! It worked for me!
If someone has my same problem, in my case this is my script:
<script>
window.customCKEditorFonts = 'RifficBold/RifficBoldImported;Arial/Arial, Helvetica, sans-serif;Comic Sans MS/Comic Sans MS, cursive;Courier New/Courier New, Courier, monospace;Georgia/Georgia, serif;Lucida Sans Unicode/Lucida Sans Unicode, Lucida Grande, sans-serif;Tahoma/Tahoma, Geneva, sans-serif;Times New Roman/Times New Roman, Times, serif;Trebuchet MS/Trebuchet MS, Helvetica, sans-serif;Verdana/Verdana, Geneva, sans-serif';
pega.u.d.attachOnload( function() {
debugger;
if(typeof CKEDITOR != 'undefined'){
CKEDITOR.on('instanceReady', function(evt) {
var editor = evt.editor;
$(editor.document.$.body).append("<style>@font-face {font-family: \"RifficBoldImported\";src: url(\"webwb/font-RifficBold.ttf?\") format(\"truetype\");font-weight: normal; font-style: normal;}</style>");
});
}});
</script>
Below is an example to add Marry Ann font in Rich Text Editor. User has .otf files of the custom font.
Add the following code in userWorkForm:
<script>
window.customCKEditorFonts = 'Marry Ann/marryAnnCustomefont;Arial/Arial, Helvetica, sans-serif;Comic Sans MS/Comic Sans MS, cursive;Courier New/Courier New, Courier, monospace;Georgia/Georgia, serif;Lucida Sans Unicode/Lucida Sans Unicode, Lucida Grande, sans-serif;Tahoma/Tahoma, Geneva, sans-serif;Times New Roman/Times New Roman, Times, serif;Trebuchet MS/Trebuchet MS, Helvetica, sans-serif;Verdana/Verdana, Geneva, sans-serif';
pega.u.d.attachOnload( function() {
debugger;
if(typeof CKEDITOR != 'undefined'){
CKEDITOR.on('instanceReady', function(evt) {
var editor = evt.editor;
$(editor.document.$.body).append("<style>@font-face {font-family: \"marryAnnCustomefont\";src: url(webwb/pzfontMaryAnnRegular.otf);src: local(\"marryAnnCustomefont\"), url(\"webwb/pzfontMaryAnnRegular.otf\") format(\"opentype\");}</style>");
});
}
});
</script>
Note : font file has to be in this case webwb/pzfontMaryAnnRegular.otf