无法自定义wangEditor 的颜色 #3882
Comments
|
V4 你要把颜色菜单加入到 V5 你的代码看起来没问题。你可以参考 http://106.12.198.214:8882/main/examples/menu.html 我的 demo ，里面也有 color 配置。 |
尊敬的作者，您好！感谢您的回复。 还是将颜色作为参数添加到其中呢？ 但无论是哪种我都失败了。 而V5版本您的demo我都没有看懂，背景颜色与字体颜色好像都是默认的，并没有发生改变。 |
|
看 v5 demo http://106.12.198.214:8882/main/examples/menu.html 的源码，就这一行起作用。 // 各个菜单的配置
editorConfig.MENU_CONF['color'] = {
colors: ['#000', '#333', '#999', '#ccc']
} |
|
若用 v4 ，你要把颜色的菜单给配置上 // 配置菜单栏，删减菜单，调整顺序
editor.config.menus = [
'bold',
'head',
'link',
'italic',
'underline',
'foreColor', // 这个
'backColor', // 这个
] |
依旧没有效果，这是我的全部代码，为了看出效果，颜色全部都是深色，但最终依旧没有生效 <!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>wangEditor-V4</title>
<style>
.body {
display: flex;
flex-direction: column;
justify-content: center;
min-height: 100vh;
}
</style>
</head>
<body>
<div class="body">
<div id="div1">
<p>欢迎使用 <b>wangEditor</b> 富文本编辑器</p>
</div>
</div>
</body>
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/wangeditor@latest/dist/wangEditor.min.js"></script>
<script type="text/javascript">
const E = window.wangEditor
const editor = new E("#div1")
// 或者 const editor = new E(document.getElementById('div1'))
// 配置菜单栏，删减菜单，调整顺序
editor.config.menus = [
'bold',
'head',
'link',
'italic',
'underline',
'foreColor', // 这个
'backColor', // 这个
]
// 配置颜色（文字颜色、背景色）
editor.config.colors = [
'#DC143C',
'#8B008B',
'#4B0082',
'#0000FF'
]
editor.create()
</script>
</html>
我不清楚自己到底哪里错了 |
|
你点开下图的这俩菜单看看
配置的是菜单的可选颜色，并不是配置整个文本的颜色。 |
|
如果你想配置文本的默认颜色，可以使用 v5 ，参考 wangeditor-team/wangEditor-v5#242 将其中的 |
我想，我明白了，是我对文档的的理解有误，造成了这样事情，我很抱歉。 感谢wangEditor团队的无私奉献，感谢作者的耐心解答与指导，祝wangEditor越来越好！ |
问题描述
我想要修改wangEditor 的颜色（包括背景颜色与字体颜色），根据文档的指引操作，但无法生效。安装wangEditor 是使用的CDN方式
wangEditor 版本
wangEditor V4与wangEditor V5
是否查阅了文档 ？
（文档链接 www.wangeditor.com/doc ）
是
最小成本的复现步骤
（请告诉我们，如何最快的复现该问题？）
wangEditor V4
使用CDN方式进行最小的安装，尝试修改颜色
wangEditor V5
使用CDN方式进行进行最小的安装，尝试修改颜色
The text was updated successfully, but these errors were encountered: