如题。

最近需要使用到网页后台富文本编辑器。经过同学推荐,最后决定使用百度家的Ueditor.

官方地址:http://ueditor.baidu.com/website/

贴吧地址:ueditor讨论吧

官方提供了网页上非常方便的自定义工具栏的功能。自定义之后直接下载对应的代码包并按照文档部署到项目中即可。其中主要的问题是路径的配置。

首先是将下载好的代码包发布到我们项目的根目录下面。然后在需要添加富文本编辑器的页面头部添加如下代码:

  1. <script type="text/javascript" src="相对该文档的路径/ueditor/ueditor.config.js"></script>
  2. <script type="text/javascript" src="相对该文档的路径/ueditor/ueditor.all.js"></script>
  3. <script>
  4. <span style="white-space:pre">  </span>window.UEDITOR_HOME_URL = "/项目相对网址池绝对路径/ueditor";
  5. </script>

配置路径这一块是非常重要的。特别是下面的Ueditor的路径,是相对我们整个代码库的目录的。

配置完成之后,直接在我们网页中的<textarea>标签下面添加ueditor的初始化代码:

  1. <script type="text/javascript">
  2. var editor = new UE.ui.Editor({initialFrameHeight:100,initialFrameWidth:400 });
  3. editor.render("actDescribe");
  4. </script>

官方的文档并没有给出如何设置ueditor的宽度和高度的说明。这是我在网上网友那里找到的解决方法。在声明编辑器的变量的时候,在参数列表中添加对initialFrameHeight和initialFrameWidth的设置即可。注意,数值后面不需要添加px。

可是,这种方法有时候奏效有时候也不奏效,因为我碰过一种情况就是无论如何调整initialHeight和initialWidth的数值,编辑器的大小都还是不会改变。这个时候,我发现,可以通过调整editor所跟随的textarea的宽高来撑开editor的大小。这也是一种方法,各位同学在官方说明文档出来之前可以两种方法都尝试一下。

当然,好用的文本编辑器还是有很多的,例如kindeditor,之前准备使用这个的,而其文档方面也比较齐全,同时,整个编辑器的size也比较小,对网页的加载速度比较有利。百度的Ueditor还是有点庞大。加载时会有卡顿的速度。估计是我对底层代码的研究不够,多了很多不必要的内容。慢慢研究或许可以使得Ueditor变小。

Ueditor自定义默认宽度高度的更多相关文章

  1. 百度ueditor上传图片时如何设置默认宽高度

    百度ueditor上传图片时如何设置默认宽高度 一.总结 一句话总结:直接css或者js里面限制一下就好,可以用html全局限制一下图片的最大高度 直接css或者js里面限制一下就好,可以用html全 ...

  2. 富文本编辑器UEditor自定义工具栏(一、基础配置与字体、背景色、行间距、超链接实现)

    导读:UEditor 是由百度「FEX前端研发团队」开发的所见即所得富文本web编辑器,功能强大,可定制,是一款优秀的国产在线富文本编辑器,编辑器内可插入图片.音频.视频等. 一.UEditor自定义 ...

  3. 富文本编辑器UEditor自定义工具栏(二、插入图片、音频、视频个性化功能按钮和弹层及自定义分页符)

    导读:本篇将简单探讨插入图片.音频.视频的功能按钮实现方式 传送门:富文本编辑器UEditor自定义工具栏(一.基础配置与字体.背景色.行间距.超链接实现) 一.效果图 1.UEditor自定义工具栏 ...

  4. 富文本编辑器UEditor自定义工具栏(三、自定义工具栏功能按钮图标及工具栏样式简单修改)

    导读 富文本编辑器UEditor提供丰富了定制配置项,如果想设置个性化的工具栏按钮图标有无办法呢?答案是肯定的!前两篇博文简要介绍了通过将原工具栏隐藏,在自定义的外部按钮上,调用UEditor各命令实 ...

  5. Ueditor设置默认字体、字号、行间距,添加字体种类(转)

    Ueditor默认字体.字号.行间距的修改: ueditor默认字号是16号,默认字体为sans-serif,默认行间距为5px,如下图所示: 首先,修改ueditor.all.js文件中如上图红框中 ...

  6. CSS样式实现溢出超出DIV边框宽度高度的内容自动隐藏方法

    CSS样式实现溢出超出DIV边框宽度高度的内容自动隐藏方法 平时我们布局时候,有的文字内容多了会超过溢出我们限制的高度,有的图片会撑破DIV,让网页错位变乱. 这样我们就需要解决如何使用CSS来超出设 ...

  7. 第一百六十六节,jQuery,基础 DOM 和 CSS 操作,元素内容,元素属性,css和class,元素宽度高度、偏移、滚动条

    jQuery,基础 DOM 和 CSS 操作,元素内容,元素属性,css和class,元素宽度高度.偏移.滚动条 学习要点: 1.DOM 简介 2.设置元素及内容 3.元素属性操作 4.元素样式操作 ...

  8. swiper轮播图设置每组显示的个数及自定义slide宽度

    一.html演示代码: <div class="swiper-container"> <div class="swiper-wrapper"& ...

  9. Django和Ueditor自定义存储上传文件的文件名

    django台后默认上传文件名 在不使用分布式文件存储系统等第三方文件存储时,django使用默认的后台ImageField和FileField上传文件名默认使用原文件名,当出现同名时会在后面追加下随 ...

随机推荐

  1. PHP获得文件的md5并检验是否被修改

    由于需要判断上传的文件是否被修改过,需要记录上传文件的md5值,所以这里说一下一下获取文件md5值的方法.   md5_file() md5_file() 函数计算文件的 MD5 散列.md5() 函 ...

  2. C++默认参数值函数

    1.默认参数值的函数 C++语言允许在定义函数时给其中或某些形式参数(形参)指定默认值,方法就是在相应的形参后面写上“=默认值”,如果省略了对应位置上的实参的值,则在执行被调函数时以该形参的默认值进行 ...

  3. Word两端对齐问题

    主要是有英文的话,选择两端对齐后字符间距变大,这时候可以选择段落-----中文版式----------允许西文在单词中间换行,这个在最左上角的word选项里也有.遇到好几次这样的,主要是在参考文献里.

  4. ALV 行列 颜色

    1)颜色含义 1:海蓝:2:浅清:3:黄色:4:浅蓝:5:青色:6:红色:7:橙色.(1)首位为主颜色:(2)次位为辅助颜色:(3)末位为0时,表示首位数字表为表格的底色:末位为1时,则表示以1为底色 ...

  5. .h头文件、 .lib库文件、 .dll动态链接库文件之间的关系

    转自.h头文件. .lib库文件. .dll动态链接库文件之间的关系 h头文件作用:声明函数接口 dll动态链接库作用:含有函数的可执行代码 lib库有两种: (1)静态链接库(Static Liba ...

  6. duilib入门简明教程 -- VS环境配置(2) Alberl

      既然是入门教程,那当然得基础点,因为搜索duilib相关资料时,发现有些小伙伴到处都是编译错误,以及路径配置错误等等,还有人不知道SVN,然后一个个文件手动下载的.     其实吧,duilib的 ...

  7. Best Practices for Using Alpha

    Alpha是图形界面开发中常用的特效,通常我们会使用以下代码来实现Alpha特效: view.setAlpha(0.5f); View.ALPHA.set(view, 0.5f); ObjectAni ...

  8. SQL中Case When的使用方法

    Case具有两种格式.简单Case函数和Case搜索函数. --简单Case函数 CASE sex ' THEN '男' ' THEN '女' ELSE '其他' END       --Case搜索 ...

  9. 查找mysql数据文件存放路径

    show variables like 'datadir%'; show variables当前的会话,是系统参数 是静态 show global variables全局 show status是系统 ...

  10. JavaScript元素的创建、添加、删除

    <script> var x=document.getElementById("p2"); var obj=document.createElement("p ...