UEditor編輯器使用方法及文件下載

一、請根據需要到官方網站下載(http://ueditor.baidu.com/build/build_down.php?t=1_2_5_1-utf8-php)(這是PHP服務器端的下載包)。

二、UEditor相關操作

   1、在根目錄下新建文件夾存放相關資源文件,此名爲editor.

   2、把下載的源碼包裏的相關文件拷貝到editor文件中。

   3、在使用編輯器的html頁面導入以下js文件

   <script type="text/javascript" charset="utf-8" src="editor_config.js"></script>

   <script type="text/javascript" charset="utf-8" src="editor_all.js"></script>

   <script type="text/javascript" src="third-party/SyntaxHighlighter/shcore.js">

   </script> <link rel="stylesheet" href="third-party/SyntaxHighlighter/shCoreDefault.css" type="text/css" />

   4、在html頁面創建編輯容器並實例化編輯器,代碼如下:

         <textarea id="editor"></textarea>

           <scripttype="text/javascript">

               //實例化編輯器

              var ue = UE.getEditor('editor');

         </script>

   5、在editor_config.js中查找URL變量,配置編輯器在你項目中的路徑。如果不是放在項目當中使用,URL變量可以不用修改。但是在項目當中使用就一定得修改。

       URL= UEDITOR_HOME_URL || "編輯器在你項目中的路徑";//重要,必須正確配置


三、自定義配置

   1、編輯器工具欄只顯示源代碼,並且初始化的時候進入源碼模式。

    在editor_config.js中查找 ,sourceEditorFirst:true;把前面的註釋去掉,在html當中寫入的代碼如下

       <script type="text/javascript">

       //工具欄的功能

        var editor = new baidu.editor.ui.Editor({

              toolbars:[['source']]  //自定義工具欄顯示的按鈕

       

        });

       editor.render("editor");

       </script>

   

   2、讓編輯器寬自適應

     在editor_config.js中查找

       ,initialFrameWidth:"100%"  //把數值改成百分比

       ,scaleEnabled:true

       ,minFrameWidth:800    //編輯器拖動時最小寬度,默認800

       ,minFrameHeight:320  //編輯器拖動時最小高度,默認320

把前面的註釋去掉就可以了。

    以上的內容是我在項目當中遇到的問題。在網上搜索都沒有找到滿意的答案。自己慢慢研究後做一下總結,方便其他需要用到的朋友使用。

四.更多詳細使用幫助請查看官方解釋

在線文檔:http://ueditor.baidu.com/website/document.html

UEditor論壇:http://www.ueditorbbs.com/forum.php



發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章