http://blog.sina.com.cn/s/blog_55b0c6470100y8kp.html
第一步:从官网下载相关文件 百度搜索“UEditor”
————————————————————————————————————————————
第二步:将下载的文件解压之后放到自己的项目中。编辑器出问题一般都是和路径有关的,如图:
————————————————————————————————————————————
第三步:配置editor_config.js
URL和imagePath皆使用根目录开始的方式,这样可以避免不同的调用页路径混乱的现象。
URL:编辑器路径,因为这里直接把编辑器放在项目根目录了。
imagePath:用户上传图片时,图片保存的路径,具体在JS文件中的注视已经很清楚了。
————————————————————————————————————————————
这里使用了隐藏控件在后台给编辑器赋值的方式。
样式表和JS的引用如下图:
接下来就让我们看下效果图吧!!!
————————————————————————————————————————————
第五步:上传功能
首先,确保imagePath上传目录的正确后添加Asp.net的上传配置文件,如下图:
【——up.ashx.cs——】
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.IO;
namespace PLA93303MainWebsite.UEditor.server.upload.net
{
}
文件上传功能不仅仅是检测了后缀名,还用C#检测真实文件类型,更确保文件的安全性。
最后,需要修改一下dialogs\image里的image.html文件,修改位置如下图:
【路径】
把上传处理页面修改为刚才配置的功能页面就可以了。
————————————————————————————————————————————
第六步:在根目录下新建一个UserFiles/UEditorUploads路径的文件夹保存上传的图片。到此为止百度编辑器配置完毕。
同时上传3张图片,前两张是不同格式的,后一张是WORD文件修改后缀名为.JPG的文件,程序会成功阻止非图片文件上传,却不影响真实图片上传。
这里需要提到,有些朋友配置Asp.net上传功能的时候使用了WEB应用程序页面,也就是.ASPX,那样也是可以的,但需要注意.ASPX页面不能有前台显示的任何内容,必须为空。如果不为空Response.Write("{'url':'" + retPath + "','title':'" + sFileName + "','state':'" + state + "'}");就输出给用户了,编辑器是无法取到state中的值来判断文件是否上传成功的。所以看到了网上不少人出现了上传图片成功,编辑器不显示图片的效果。
————————————————————————————————————————————
插入图片生成alt标签
1、首先,打开以下路径的editor_all.js文件
细心的朋友已经发现我把行号也截图了,具体的修改代码如下:
4434行:
(ci.title?' title="'+ci.title+'" alt="'+ci.title+'"':'') + ' border="'+ (ci.border||0) + '" hspace = "'+(ci.hspace||0)+'" vspace = "'+(ci.vspace||0)+'" />';
4447行:
(ci.title?' title="'+ci.title+'" alt="'+ci.title+'"':'') + ' /></p>';
3、最后,把修改好的editor_all.js文件文件转成editor_all_min.js文件进行调用就可以了。这里也可以省略此步骤,但需要注意调用文件的改变。相差一倍的大小呢,还是用editor_all_min.js文件对系统更优化。
————————————————————————————————————————————
这里想吐槽一下,刚开始为了省事直接问了ueditor讨论群3里的编辑器二次开发,他居然问我懂不懂title和alt的区别,告诉我:
“title是图片的标题 alt也是图片的标题,只是在极少数的浏览器里不认title,而使用了alt,你完全可以当做这两个没有区别。”
希望大家不要误导,因为在实际项目中不但效果完全不同,用户的需求也会变幻莫测。
首先我们看看效果,如下图:
在图片不能正常显示或用户屏蔽图片加载时,alt标签是明文显示的,起到提示用户当前位置的站位信息。
个别用户反而觉得title标签在鼠标经过时遮盖图片,影响图片效果,降低UEO。
两者的区别是显而易见的,另外喜欢SEO的朋友还比较青睐使用各种标签堆砌关键词。这里不讨论利弊,但用户的需求就是我们吃饭的本钱,做过实际项目的朋友都有体会。
上述方法没有做到将title标签与alt标签分离开,两个标签都调用了图片描述中的值。还属欠缺,希望朋友们提出宝贵意见,由于时间关系这里就不再继续研究了。
希望大家能轻松搞定百度编辑器,同时也期望百度能够完善编辑器的使用功能。