【Odoo Website 替换 Summernote 为第三方富文本编辑器】的更多相关文章

Odoo Website 替换 Summernote 为第三方富文本编辑器

随着用odoo的人越来越多,奇葩的需求也是越来越多.... 这不,有同学就想替换掉website forum里边的summernote控件,花了点时间研究了一下,先说结论:替换是可行的. 先上替换之后的图,这里替换的是kindeditor: 要替换成别的,也是可以的,只不过需要使用odoo的前端开发规则,本模块计划做成一个demo供参考. 替换步骤: 1. 首先将kindeditor的源文件引入到新模块中: 2. 将原来的summernote空间隐藏掉,并用kindeditor替代: $('te…

SummerNote 富文本编辑器 - Rails 集成

使用官方提供的CDN服务 将下面一段加入layout文件中 <link href="http://netdna.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.css" rel="stylesheet"> <script src="http://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.js"></script&…

django的admin或者应用中使用KindEditor富文本编辑器

由于django后台管理没有富文本编辑器,看着好丑,展示出来的页面不美观,无法做到所见即所得的编辑方式,所以我们需要引入第三方富文本编辑器. 之前找了好多文档已经博客才把这个功能做出来,有些博客虽然写的很好,但是毕竟不是自己写的好多地方要么不够全面,要么看不懂,整理了一些大神的 博客,所以这次自己实现就决定写这篇博客记录下,以后如果有需求就不用到处找资料了,同时也分享给大家看看,提供借鉴.这次我使用的是kindeditor 富 文本编辑器.之所以选择这个编辑器主要看是它功能齐全还美观.下面这张图…

Vue富文本编辑器（图片拖拽缩放）

富文本编辑器(图片拖拽缩放) 需求: 根据业务要求,需要能够上传图片,且上传的图片能在移动端中占满屏幕宽度,故需要能等比缩放上传的图片,还需要能拖拽.缩放.改变图片大小.尝试多个第三方富文本编辑器,很难找到一个完美符合自己要求的编辑器.经过多次尝试,最终选择了wangEditor富文本编辑器. 最初使用的是vue2Editor富文本编辑器,vue2Editor本身是不支持图片拖拽的,但是提供了可配置图片拖拽的方法,需要借助Qill.js来实现图片拖拽.虽然满足了业务需求,但是在移动端展示的效果不…

summernote 富文本编辑器限制输入字符长度

项目中需要一个比较简单的富文本编辑器,于是选中了summernote .虽然比较轻量,但是在开发中也遇到了几个问题,在此记录一下. 1:样式和bootstrap冲突,初始化之后显示为: .note-editor .note-toolbar .btn-group { float: none !important; margin: 0 5px; } 加入该样式覆盖解决 2:限制输入长度,查看了官网发现并没有说到这个,经过baidu,Google,也都没有发现解决方案,于是研究了下源码 OK,this…

超好用的富文本编辑器Summernote的使用

官网地址 中文文档 源码下载地址 Summernote依赖于jquery和bootstrap3/4   所以用时记得引入这俩依赖 奉上引入方法(官网说的很清楚,api也很详细): <!-- include libraries(jQuery, bootstrap) --> <link href="http://netdna.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.css" rel="stylesheet&q…

summernote富文本编辑器

下载summernote官方demo,解压,把文件夹中的summernote.js,summernote.css和font整个文件夹都放到服务器对应的项目目录里 引入summernote 所需要的bootstrap,jquery等文件,具体不知道需要引入那些文件,可以去以下网址查看,看不懂英文的话,用谷歌浏览器打开网址,右键翻译 网址:https://summernote.org/getting-started/ 以下是我本地测试正常的demo <!doctype html> <head…

summernote富文本编辑器的使用

最近在开发一个微信公众号的后台,微信公众号编辑的文章一直没有得到很好地适应,大多数人也是在其他的编辑软件中编辑好之后直接去复制到微信公众平台中,考虑到复制后会排版出现问题,所以给大家推荐一款很不错的Web富文本编辑器 (summernote) 官网地址为: https://summernote.org/ 首先看一下编辑器的样子: 接下来就简单的实现这个编辑器. 1.首先需要从官网下载summernote的包(js和css两部分)然后新建一个页面,因为这个是建立在jquery和bootstarp两…

summernote富文本编辑器配合validate表单验证无法进行表单提交的问题

1.使用summernote富文本编辑器提交图片到服务器 在使用bootstrap中,我们用到了summernote富文本编辑器,使用summernote将图片上传到服务器中,参考我的上篇文章http://www.cnblogs.com/jingmin/p/6592325.html 2.在使用summernote编辑完文本,使用validate进行表单验证出现问题的解决方案 小编在使用summernote富文本编辑器编辑完文章内容,并且上传了图片,对于编写的内容使用了validate进行了表单验…

summernote(富文本编辑器)将附件与图片上传到自己的服务器（vue项目）

1.上传图片至自己的服务器(这个官方都有例子,重点介绍附件上传)图片上传官方网址 // onChange callback $('#summernote').summernote({ callbacks: { onChange: function(contents, $editable) { console.log('onChange:', contents, $editable); } } }); // summernote.change $('#summernote').on('summer…