没有显示与summernote路轨的象

Question

我跟着 Summernote-rails 官方在我的rails项目中添加了富文本编辑器.

比我的edit.html.erb添加了类place_editor到我的text_area

<%= f.text_area :text, class: "place_editor form-control col-md-7 col-xs-12", rows: "15j ,placeholder: "Text", required: "required"%>

和javascript一样

<script type="text/javascript">
 $(function() {
      $('.place_editor').summernote();
      var edit = function () {
        $('.click2edit').summernote({ focus: true });
      };
      $("#edit").click(function () {
        $('.click2edit').summernote({ focus: true });
      });
      $("#save").click(function () {
        var aHTML = $('.click2edit').code(); //save HTML If you need(aHTML: array).
        $('.click2edit').destroy();
      });
      // Adding Css to give border to text editor
      $(".note-editor").css("border", "solid 1px #e7eaec");

    });
</script>

一切正常,除了ICONS请帮助我.

Answer 1

这很简单

只需下载summernote编译zip文件,请点击此处.

解压缩文件.复制字体文件夹.将它粘贴到summernote.css root.确保您的summernote.css文件保留在font文件夹中.现在使用Ctrl+ 刷新浏览器F5.

文件夹位置演示:

演示输出:

Answer 2

导入字体文件，就可以了。我尝试通过 CSS @font-face 规则导入。您也可以在 javascript 中导入。

@font-face {
font-family: summernote;
src : url('/fonts/summernote.ttf');
src : url('/fonts/summernote.eot'),
      url('/fonts/summernote.woff');
}

Answer 3

我搜索了几个小时，终于解决了。实际上，summernote不会在本地保存图标，而是会下载图标

我在标题中添加了此链接

  <link href="http://netdna.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.css" rel="stylesheet">
  <link href="http://cdnjs.cloudflare.com/ajax/libs/summernote/0.8.1/summernote.css" rel="stylesheet">

如果有人可以进一步详细说明，它就完成了我欢迎的工作