ckeditorのカスタムフォント

Question

カスタムフォントを追加しようとしていますが、できません。

CKEDITOR.editorConfig = function(config) 
{ 
config.contentsCss = 'fonts.css'; 
config.font_names = 'Dekers/dekers_true' + config.font_names; 
} 

fonts.css：私は

は

私のコードは

config.jsのです...以下のコード、フォント名がドロップダウンに追加されますが、それは変えていないと、エラーを取得しています：

@font-face { 
font-family: "dekers_true", serif; 
src: url(fonts/Dekers_light.eot); /* IE */ 
src: local("Dekers"), url("fonts/Dekers_light.ttf") format("truetype"); /*non-IE*/ 
} 

Answer 1

カスタムCSSファイルには、CKEditor本体の基本的なスタイリングが含まれている必要があります。 CKEditorは、このCSSファイルのみを使用してiframeに読み込みます。

@font-face { 
    font-family: "dekers_true"; /* font name for the feature use*/ 
    src: url(fonts/Dekers_light.eot); /* IE */ 
    src: local("Dekers"), url("fonts/Dekers_light.ttf") format("truetype"); /*non-IE*/ 
} 
body { 
    font: normal 13px/1.2em dekers_true, serif; 
    color: #333; 
} 
p { 
    font: normal 13px/1.2em dekers_true, serif; 
    margin-top: 0; 
    margin-bottom: 0.5em 
} 
... 

さらに、メインサイトのCSSファイルにもフォント宣言を追加します。

更新：代替変形です。 カスタムスタイルを宣言することができます。

config.stylesSet = [ 
    { name : 'Pretty font face', element : 'span', attributes : { 'class' : 'pretty_face' } }, 
    ... 
]; 

だからクラス.pretty_faceを適用され、あなたが望むようにあなたはそれをスタイルすることができますより。 rteで直ちにプレビューするには、このクラスをcontentsCSSファイルでスタイルする必要があります。

Answer 2

OR config.jsの

config.font_names = '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;' + 
    **'Dekers/dekers_true';** 

そして、あなたのCSSインチ 上記はフォントではなく、スタイルドロップダウンに配置されます。