2

我的目标是在文本区域上方设置用户界面文本编辑器。我从同样使用这种技术的 Stack Overflow 中汲取灵感。

我刚刚为 Rails 安装了 TinyMCE gem。

根据 TinyMCE 文档,我创建了一个 config/tinymce.yml 文件

toolbar:
  - styleselect | bold italic | link image | undo redo
  - table | fullscreen
plugins:
  - table
  - fullscreen

在 application.js 中,我添加了这一行

//= require tinymce

这是让我感到困惑的部分。我设置了这样的代码

<p>
  <%= f.label :body, class: 'marker' %>
  <%= f.text_area :body, :class => "tinymce", :rows => "15" %>
  <%= tinymce %>
</p>

根据文档,我应该这样做

<%= f.text_area :content, :class => "tinymce", :rows => 40, :cols => 120 %>

然后调用 tinymce 助手来初始化 TinyMCE:

<%= tinymce %>

我认为他们的意思是我应该把线放在f.text_area线下面。

我认为在 Stack Overflow 上问这个问题会更有礼貌,而不是用问题轰炸他们。

编辑

看起来我设法让它自己工作,但我还有另一个问题。文本区域框现在占据了页面的整个宽度,而我将文本区域元素指定为 500 像素的宽度。

我认为问题出在 CSS 上,所以我要看看我是否能解决这个问题

4

2 回答 2

2

是的,TinyMCE 是要走的路。

有一个易于使用的宝石

gem 'tinymce-rails'

他们在 github 页面https://github.com/spohlenz/tinymce-rails上有关于如何使用和安装的很好的说明

于 2014-09-04T03:50:21.657 回答
0

可以在tinymce.yml文件中为 tinymce-rails 指定 tinymce 编辑框的高度和宽度,如下所示:

width: 600
height: 200
toolbar:
  - styleselect | bold italic | undo redo | alignleft aligncenter alignright
plugins:
  - image
  - link
于 2015-01-16T18:29:40.210 回答