1. 程式人生 > >二.百度UEditor編輯器之配置檔案:ueditor.config.js

二.百度UEditor編輯器之配置檔案:ueditor.config.js

百度UEditor編輯器之配置檔案:ueditor.config.js,可以在這裡配置整個編輯器的特性。

  1. 編輯器資原始檔根路徑配置:window.UEDITOR_HOME_URL = "/xxxx/xxxx/";
    在開發過程中可以配置為如下:
    
    var URL =window.UEDITOR_HOME_URL ="/ProjectName/ueditor/";
    
    在釋出到Internet時,可以配置如下:
    
    var URL =window.UEDITOR_HOME_URL ="/www.65101.cn/ueditor/";
    
    如果你的Internet站點配置了ROOT釋出目錄(省去域名),配置如下:
    
    var URL =window.UEDITOR_HOME_URL ="/ueditor/";
    
    此處直接使用上面的路徑,無需重新定義:
    URL = window.UEDITOR_HOME_URL || (function(){此處程式碼省略...});
  2. 配置項主體。注意,此處所有涉及到路徑的配置別遺漏URL變數。
    圖片上傳配置區:
    
    imageUrl:URL+"jsp/imageUp.jsp"             //圖片上傳提交地址
    或者
    imageUrl : URL +"upload.action"		//圖片上傳提交的Action地址	
    
    此處說明:如果使用status2上傳,則此處應修改為你提交到上傳圖片的Action。
    如果使用status2,但不用自己寫的Action處理上傳圖片,使用編輯器自帶的jar或者原始碼中的Upload類處理,
    則需要配置status2的過濾器,否則你除錯會發現配置都是正確的,上傳失敗了。
    那麼果斷點,修改攔截器,攔截器修改程式碼詳見編輯器中的標題。
    
    

  3. 工具欄上的所有的功能按鈕和下拉框,可以在new編輯器的例項時選擇自己需要的從新定義;
    toolbars:[
    	    ['fullscreen', 'source', '|', 'undo', 'redo', '|',
                'bold', 'italic', 'underline', 'fontborder', 'strikethrough', 'superscript', 'subscript', 'removeformat', 'formatmatch', 'autotypeset', 'blockquote', 'pasteplain', '|', 'forecolor', 'backcolor', 'insertorderedlist', 'insertunorderedlist', 'selectall', 'cleardoc', '|',
                'rowspacingtop', 'rowspacingbottom', 'lineheight', '|',
                'customstyle', 'paragraph', 'fontfamily', 'fontsize', '|',
                'directionalityltr', 'directionalityrtl', 'indent', '|',
                'justifyleft', 'justifycenter', 'justifyright', 'justifyjustify', '|', 'touppercase', 'tolowercase', '|',
                'link', 'unlink', 'anchor', '|', 'imagenone', 'imageleft', 'imageright', 'imagecenter', '|',
                'insertimage', 'emotion', 'scrawl', 'insertvideo', 'music', 'attachment', 'map', 'gmap', 'insertframe','insertcode', 'webapp', 'pagebreak', 'template', 'background', '|',
                'horizontal', 'date', 'time', 'spechars', 'snapscreen', 'wordimage', '|',
                'inserttable', 'deletetable', 'insertparagraphbeforetable', 'insertrow', 'deleterow', 'insertcol', 'deletecol', 'mergecells', 'mergeright', 'mergedown', 'splittocells', 'splittorows', 'splittocols', '|',
                'print', 'preview', 'searchreplace', 'help']
    	]
    
    此處可以根據自己的需要增刪工具按鈕,配置如下:
    
    toolbars:[
                ['source','undo', 'redo', '|',
                    'bold', 'italic', 'underline','removeformat', '|', 'forecolor',
                    'fontfamily', 'fontsize', '|','insertorderedlist', 'insertunorderedlist','insertimage','fullscreen'
                ]
            ]
    
  4. 語言配置項,預設是zh-cn。有需要的話也可以使用如下這樣的方式來自動多語言切換,當然,前提條件是lang資料夾下存在對應的語言檔案:
    lang值也可以通過自動獲取 (navigator.language||navigator.browserLanguage ||navigator.userLanguage).toLowerCase()
    
    語言配置:lang:"zh-cn"(中文)/ lang:"en"(英文)
    
    語言包路徑配置:langPath:URL +"lang/"
  5. 初始化時,是否讓編輯器獲得焦點true或false;
    focus:true

  6. 編輯器層級的基數,預設是900;
    zIndex : 9

  7. 是否預設為純文字貼上。false為不使用純文字貼上,true為使用純文字貼上;
    pasteplain:false
    
    此處如果貼上為非純文字,可以貼上複製的圖片,樣式等內容。
    還可以自定義編寫純文字貼上模式下的過濾規則
    說明:1.如果貼上的圖片不經過轉存,原始檔圖片被刪除後此處釋出的圖片則會找不到。
    2.由於不同瀏覽器較多,貼上的樣式也有不同,如在IE9 下複製的科技資訊,用谷歌和360同樣複製貼上,
    釋出後看到的效果卻不一樣,谷歌和IE相近,360瀏覽器卻相差甚遠。尤其是客戶端釋出的內容在手機端看到的慘不忍睹。當然你也可以通過自己的程式處理。
  8. 編輯器的有序無序選單配置,值留空時支援多語言自動識別,若配置值,則以此值為準:
    說明:此處無序列表編輯器本身有些問題,如:點選空心圓圈,出現的是實心黑點。還有破折號等...
    有序:
    ,'insertorderedlist':{
    	//自定的樣式
    	//'num':'1,2,3...',
    	//'num1':'1),2),3)...',
    	//'num2':'(1),(2),(3)...',
    	//'cn':'一,二,三....',
    	//'cn1':'一),二),三)....',
    	//'cn2':'(一),(二),(三)....',
    	//系統自帶
    	'decimal' : '' ,         //'1,2,3...'
    	'lower-alpha' : '' ,    // 'a,b,c...'
    	'lower-roman' : '' ,    //'i,ii,iii...'
    	'upper-alpha' : '' , lang   //'A,B,C'
    	'upper-roman' : ''      //'I,II,III...'
    	}
    無序:
    ,insertunorderedlist : {
    	//自定的樣式
    	'dash' :'— 破折號',
    	'dot':' 。 小圓圈'
    	//系統自帶
    	'circle' : '',  // '○ 小圓圈'
    	'disc' : '',    // '● 小圓點'
    	'square' : ''   //'■ 小方塊'
    	}
  9. 字號配置:
    'fontsize':[10, 11, 12, 14, 16, 18, 20, 24, 36]
    此處建議使用時取消36,字型太大,會出現一些瀏覽器相容的問題。



相關推薦

.UEditor編輯配置檔案ueditor.config.js

百度UEditor編輯器之配置檔案:ueditor.config.js,可以在這裡配置整個編輯器的特性。 編輯器資原始檔根路徑配置:window.UEDITOR_HOME_URL = "/xxxx/xxxx/";在開發過程中可以配置為如下: var URL =window

文字編輯UEditor新增附件管理功能

最近朋友的一個專案需要一個文字編輯器,讓我突然想起那個百度編輯器UEditor,功能比較齊全而且開源,但也有很多bug和不足。 一年前我就曾經關注過,讓我感到最不能容忍的不足就是,新增的附件的地方,如果檔案和伺服器端重名這樣的錯誤如果能夠容忍,但如果上傳錯了,我想刪除

Java maven專案整合ueditor編輯)外掛詳解

相信很多專案都要用到類似的功能,ueditor是一個非常強大的外掛,當然也有直接整合好的直接引用就行了。在這裡講一下百度編輯器的整合過程,本人是走了好多彎路,在這裡希望各位開發的朋友少走些彎路,節約開發時間。 1,首先需要下載ueditor包  我下載的是  ueditor

怎樣在UMeditor編輯中插入騰訊和愛奇藝網站視訊?

百度UMeditor線上編輯器有插入視訊的功能,但是預設只支援優酷網的視訊智慧分析提取,其它視訊站是不支援的,但是同樣也可以插入。 原理很簡單,就是複製騰訊、愛奇藝等視訊的FLASH地址即可。 在百度UMeditor線上編輯器插入騰訊、愛奇藝等視訊的FLASH地址時,會提

文字編輯在asp.net 中的應用

第一步:下載百度文字編輯器: ueditor1_4_3_3-gbk-net.zip , 並把它拷貝到網站根目錄下面(可以參考下里面Index.html 裡面的呼叫案例) 第二步:在前臺aspx頁面加入程式碼: <script type="text

ueditor編輯上傳檔案超時報錯

文章來自:原始碼線上https://www.shengli.me/php/153.html php 超時等待時間太長;   解決:   php.ini中的max_execution_time為0;(http請求等待時間為永久)    

vscode 編輯go配置檔案

{ "files.autoSave": "afterDelay", "go.buildOnSave": true, "go.lintOnSave": true, "go.vetOnSave": true, "go.buildFlags": [],

獨立使用UEditor編輯圖片和檔案上傳(呼叫內建第三方外掛swfupload)

 最近百度了一下網上的資料並看了一下ueditor的api,整理並測試了一下,發現還真好用,現在和大家分享一下 這裡配置了一個正常的ueditor編輯器和編輯器外面的兩個上傳按鈕。 首先引入js檔案 1 <script src="ueditor/ueditor.

VI編輯檔案多屏操作

1、如何開啟多視窗: (1)不同檔案在不同視窗開啟 開啟方法: (1):e filename_path/filename 此時可以通過Tab鍵查詢目錄下的檔案,此時是重新開啟選定的檔案,前一個開啟的檔案將被關掉;不退出vi情況下開啟另一個檔案,一個視窗只顯示一個檔案。 (2

Shell開發環境vim編輯配置檔案vimrc的引數優化

Linux環境下為了方便Shell的開發,對配置檔案vimrc的引數需要進行一些的優化,vim編輯器的配置檔案預設路徑為:~/.vimrc(全域性路徑為/etc/vimrc)。 引數如下: """"""""""""""""""""""""""""""""" " =>

vscode編輯在php檔案中的html/js格式化解決方案

本人使用laravel框架,因為頁面很多都是用php檔案渲染的,所以很多html和js都是在php檔案中,用prettier外掛不能識別php檔案中的html內容,導致無法執行自動格式化程式碼,如果要我手動去一個個調整的話,想想就可怕 本想問問度量結果,結果沒人有類似的,然後直接看setti

Redis配置檔案快照,複製

################################ SNAPSHOTTING  ################################ # # Save the DB on disk: # #   save <seconds> <changes> # #   W

ueditor編輯asp版本地配置成功伺服器上不能上傳圖片提示500錯誤的解決方法

使用百度開源ueditor編輯器不能上傳圖片並報伺服器500錯誤。 初看是 Uploader.Class 的 fs.CreateFolder( path ) 這條語句不能建立目錄,懷疑許可權問題,提供所有許可權後,依然不行。 最後參考百度官方文件將該程式碼內函式 修改A

頁面插入UEditor編輯

height blog 含義 復制 保留 了解 com mat ext 工作中用到了百度的富文本。以下總結記錄一下,UEditor嵌入網頁的方法。 第一步 到百度UEditor官網下載所需版本:http://ueditor.baidu.com/website 本次下載

Ueditor編輯的Html模式自動替換樣式的解決方法

tor tail classname 功能 lai empty als 包含 emp 百度的Ueditor編輯器出於安全性考慮,用戶在html模式下粘貼進去的html文檔會自動被去除樣式和轉義。雖然安全的,但是非常不方便。 做一下修改把這個功能去掉。 一、打開ueditor

.Net Core 使用UEditor編輯

緩存配置 fix oid format public 管理器 gui proc cti 一、準備文件 1. 下載UEditor官方版本.刪除其中後端文件。保留後端文件夾中的config.json文件 2. 在NuGet管理器中搜索UEditorNetCore,拿到項目地址

ueditor編輯 自動加P最新解決辦法

自動 有時 過時 天發 ueditor min 朋友 tor 百度ueditor 今天有個客戶提出個需求,不讓百度ueditor編輯器在空白文檔自動添加<p><br/><p>,在網上找了一圈,大部分是解決LI裏自動套P,還有一部分也是碰到

編輯使用與常見問題

dialog ont mage arch 參考 問題 spa 常見 圖片   最近,我們後臺使用的編輯器用於需求的變更換成了百度編輯器,在使用的時候碰到了一些問題,總結在此   參考完檔: http://fex.baidu.com/ueditor/   一. 初始化

web編輯——UEditor編輯使用教程與使用方法

  我們在做網站的時候,網站後臺系統一般都會用到 web 編輯器,今天筆者就給大家推薦一款百度 UEditor 編輯器。關於這款百度 UEditor 編輯器官網上也有簡單的教程,不過看著比較費勁,今天筆者就跟大家分享一下百度 UE

UEditor編輯的簡單使用方法

百度UEditor編輯器的官方下載地址: ueditor 官方地址:http://ueditor.baidu.com/website/index.html 開發文件地址:http://ueditor.baidu.com/website/document.html 下載地址: