无法更改WordPress tinymce编辑器字体

Question

我目前正在尝试更改WordPress tinymce编辑器字体，但无法正常工作。

首先，我创建了一个包含以下内容的tinymce-custom-editor.css：

@import url(https://fonts.googleapis.com/css?family=Open+Sans:400,700);

* {
    font-family: "Open Sans", Arial, sans-serif !important;
}

保存并上传后，我通过以下方式将其包含在主题functions.php文件中：

/**
 * Add editor styles
 */
add_action( 'after_setup_theme', 'add_custom_editor_style' );
function add_custom_editor_style() {
    add_editor_style( get_stylesheet_directory_uri() . '/css/tinymce-custom-editor.css' );
}

我没有找不到该文件的错误，因此我希望它已成功包含。当我删除缓存并重新加载页面时，字体仍然是错误的一种：

font-family: Georgia, "Times New Roman", "Bitstream Charter", Times, serif;

它看起来必须像这样：

我在这里做错了什么？

Answer 1

首先，您应该确保已加载css资源（在页面源代码中查找）。如果已加载，那么您在正确的道路上。如果不是，请找出WP从何处尝试加载它并更正路径。

您的第二个问题是您的*选择器过于笼统（它将影响尚未设置font-family的所有内容）并且过于脆弱（几乎被任何选择器覆盖）将font-family应用于任何元素的其他选择器）。

因此，如果样式表正确加载，则您要做的就是将font-family应用于尚未设置的任何元素。

您需要检查要设置样式的元素，并找到当前正在应用font-family属性的选择器的特殊性。一旦选择器比应用的选择器更强大，您的font-family就将应用（如果样式表稍后加载，则特异性可以等同，并且您的值仍然适用）。

Answer 2

现在我找到了问题。该文件是必需的，但是我在SO上找到的过滤器似乎是错误的。因此，我深入研究了tinymce，并找到了正确的过滤器。因此，如果您想：

  

编辑tinymce CSS样式（在我的情况下为字体系列）

您必须使用此过滤器：

/**
 * Add custom editor styles to tinymce editor
 */
add_filter( 'mce_css', 'add_custom_editor_style' );
function add_custom_editor_style() {
    return get_stylesheet_directory_uri() . '/css/tinymce-custom-editor.css';
}

您现在可以将所需的所有内容放入自定义编辑器样式的CSS文件中。