UEditor编辑器可以对接秀米编辑器,新技能 让内容更丰富一些

用户 阿迪 5天前 147

文章内容单调,突然发现秀米可以免费对接到UEditor编辑器,研究了一下确实做到了,测试地址:xx.lx3633.com

但ZB里面的UEditor编辑器是改版后的,代码复杂,看了很久也没办法下手,

有大神试试看吗? 可以做成插件来使用

下面是秀米官方对接教程 以及教程地址:https://ent.xiumi.us/ue/


  1. 下载文件 xiumi-ue-dialog-v5.js和 xiumi-ue-v5.css后,在你的代码里面引用。如图:
  2. 下载文件 xiumi-ue-dialog-v5.html和 internal.js,将其放置于你的UEditor网页的目录内,见下图。 

    如果你将其放置于其他目录,请修改 xiumi-ue-dialog-v5.js中相应的内容:
    iframeUrl: 'xiumi-ue-dialog-v5.html', //将此处的值改为实际的文件路径
  3. 修改UEditor的配置(ueditor.config.js),将其中的“xxs过滤白名单”加上
    section:['class', 'style'],
    修改的内容请参考下图: 
    修改前:  修改后: 
    否则UEditor会修改秀米插入内容中的section格式信息,造成排版错误。 
  4. 做完了前3步,你的UEditor已经可以做到和本页面的示例一样的功能了, 不过,由于秀米提供的图片地址不能直接应用在你的网站中,你需要将秀米的图片通过UEditor 的图片上传功能把图片转存到你自己的服务器上。

    如果你不实现图片转存,图片的地址是这样的: 

    具体怎么做呢?

    1. 首先,你要确保在UEditor的前端设置(ueditor.config.js)中打开了“远程图片抓取到本地保存”, 如下图: 
    2. 其次,你需要正确配置或实现UEditor的图片上传功能。具体实现与你使用的后端语言有关,请参考UEditor的官方文档
    3. 上述配置完成后,UEditor会自动将秀米的图片转存到你的图片存储服务器中,这时你再次查看图片属性对话框中的地址时,可能如下图:
    4. 请注意:可能需要在UEditor的代码里面对某些秀米图片地址的后缀进行处理,去掉?号之后类似?x-oss-process=所有的部分

  5. 恭喜你,你已经完成了秀米插件的全部配置!


最后于 3天前 被阿迪编辑 ,原因:
最新回复 (2)
全部楼主
  • 管理员 zbadmin 3天前 0
    引用 2
    应该没什么变化

    程序使用问题及应用中心问题可直接在论坛发帖。 出现开发者相关问题、应用中心纠纷、Z-Blog官网及各项服务的问题,可发送邮件到contact#rainbowsoft.org,我们每一封邮件都会进行阅读;也可点击这里QQ联系。此QQ不接受程序使用咨询类问题,也请有事直说,不要客套,莫问在不在。

  • 用户 Edipse 3天前 0
    引用 3
    • ZBlogger技术交流中心
      4
          
返回
发新帖