Posted on 16-07-2009
Filed Under (技术) by waterlin

Drupal只是提供了一个高度可定制的系统,并没有附带很多功能。在默认配置下,发布内容时,Drupal是用纯文本编辑器,而大多数情况下,我们需要更方便的所见即所得的编辑工具,以及包括选择、上传图片等更多功能。可以用以下几个步骤来给Drupal安装、配置一个可视化编辑器:

1) 安装Wysiwyg模块,和一般的module的安装方法一样。

安装好了,需要进行适当的配置:

Administer > Site configuration > Wysiwyg

2) Wysiwyg只是Drupal提供给各个可视化编辑器的API引擎,如果你没有安装任何编辑器,则需要安装一个。我这里选择TinyMCE,解压放到Drupal安装根目录下的sites/all/libraries/tinymce目录里。

如果没有libraries目录,则自己创建一个。

这个时候,再到Wysiwyg的设置里,就能选择TinyMCE作为编辑器了。

3) 选择TinyMCE作为编辑器后,需要到Administer –> Site configuration –> Input formats给用户分配适当的编辑器可视化功能选项。

这个时候,你再到Create content里,创建一个Blog entry看看,是不是有富文本编辑器了?

4) 按上面的步骤配好的编辑器,在你需要插入图像的时候,会弹出如下的对话框:

TinyMCE.png

看看,并没有选择图片的按钮!

所以接下来,我们需要添加插入本地图片的功能。我们需要安装下面两个插件:

(1) IMCE模块

安装成功后,记得到Administer –> Site Configuration –> IMCE里,给需要上传图片文件的用户分派IMCE权限。否则,这些用户依然没有办法上传图片。

(2) IMCE Wysiwyg bridge模块

这个模块的功能是桥接IMCE和Wysiwyg,注意,这个是TinyMCE with WYSIWYG API来负责的。

安装好IMCE Wysiwyg bridge以后,记得到在Wysiwyg的配置里对TinyMCE和IMCE进行配置:

Edit_TinyMCE_properties.png

Administer –> site Configuration –> Wysiwyg里,点Edit,进到TinyMCE profile for Filtered HTML页面里,点Buttons and plugins,把IMCE勾上。

现在来测试一下这个上传图片的功能:

在富文本编辑器里点击”选择图片”按钮后,会弹出如下对话框:

insert_image.png

点击红色圆圈里的按钮后,就会弹出上传图片的对话框:

上传完图片后,选择这个图片,再点Send to TinyMCE,这样,就可以在富文本编辑器里看到这张图片了:

上传的文件默认会放在sites/default/files里。

注意:

如果你碰上了Drupal会自动帮你把换行符取消掉,或者你添加进来的图片不能在浏览的时候显示,那很有可能是下面这两个问题。请仔细查一查下面两个地方的Filters:

1) 检查一下Administer –> site Configuration –> Wysiwyg里的相关input format有没有问题。

2) 检查一下Administer –> site Configuration –> Input formats,看看这里面的Filters有没有把图片、换行等标识代码给过滤掉。

© 2009, 浏忙大爆炸. All rights reserved.
除非注明,浏忙大爆炸文章均为原创,转载请以链接形式标明本文地址。

Comments

625662777 on 15 September, 2009 at 8:30 pm #

想请教一下。我也是如你上文所讲装了imce等模块,就是最后一步出问题、解决不了,插入的图片无法显示,变成了[img]图片路径[/img],怎么回事呢?请多指教。

[Reply]


[…] 如果你在Drupal里用IMCE来上传图片,IMCE默认是把图片一股脑的扔到目录sites/default/files/u%uid下面(%uid是指用户的ID编号)。 […]


[…] 根据以前的给Drupal安装所见即所得的编辑工具方法,我们可以给 Drupal 安装一个可视化编辑工具,让发文章更加方便。 […]


Post a Comment
Name:
Email:
Website:
Comments: