ckeditor中的自定义字体

Question

我试图添加自定义字体但不能.我收到以下代码的错误,字体名称是在下拉列表中添加,但它没有改变...

我的代码是

config.js:

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

fonts.css:

@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

或在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。上面将其放置在样式下拉列表中，而不是字体中。