網(wǎng)站維護(hù)之Ueditor編輯器深度自定義改造

經(jīng)常做網(wǎng)站編輯，添加新聞，文章，產(chǎn)品，圖片，資料，確實(shí)對(duì)在線網(wǎng)頁編輯器的操作便捷性非?？粗?，總希望編輯器是能高端智能化，傻瓜式，所見即所得能讓完全不懂html css等技術(shù)代碼的文員都能編輯出漂亮的頁面效果是任何網(wǎng)編都?jí)裘乱郧蟮?，但現(xiàn)實(shí)是沒有那么好的。
最近在編輯文章時(shí)偶爾了解到一個(gè)叫Markdown的編輯器，開始不知道是什么工具，后來網(wǎng)上搜索了解到原來次工具是一個(gè)非常簡(jiǎn)單只需要幾個(gè)簡(jiǎn)單快捷鍵就能很好編排出可視性強(qiáng)的文章，對(duì)于專業(yè)博客寫手或作家們做文字編排是福音，然后就在想我能不能找一個(gè)有這樣Markdown一樣方便的編輯器來編輯我的網(wǎng)站內(nèi)容呢？后來發(fā)現(xiàn)是不行的，因?yàn)?a >網(wǎng)站開發(fā)時(shí)程序員就集成了百度開源的一個(gè)編輯器叫Ueditor，沒辦法也只能先用他了，于是動(dòng)起了深入自定義改造此編輯器的想法，先羅列出我在實(shí)際使用ueditor編輯網(wǎng)頁時(shí)遇到的許多不方便整理出來，而且這些問題極大降低了我網(wǎng)編的效率還有編排效果，真的很費(fèi)神！主要問題有以下幾點(diǎn)：
1.不能直接將粘貼的圖片自動(dòng)上傳到網(wǎng)站服務(wù)器（不管是從word里還是網(wǎng)絡(luò)鏈接的圖片，就這點(diǎn)對(duì)圖片的處理是最耗費(fèi)時(shí)間的，平時(shí)我只能一張張的保存到電腦然后再一張張的上傳，可以想象是如果的效率低下！?。。?br/>2.從網(wǎng)絡(luò)拷貝的文章默認(rèn)粘貼到編輯框里無法去除樣式，必須得先點(diǎn)擊一個(gè)“純文本的粘貼”的按鈕（這多了一個(gè)步驟，心想能否默認(rèn)就是純文本粘貼呢？）
3.ueditor竟然過濾樣式代碼，如style 等標(biāo)簽，這問題很嚴(yán)重?。ㄓ袝r(shí)我們已經(jīng)重構(gòu)好的html文件都是有樣式控制效果的，突然因?yàn)楹?jiǎn)單修改保存后竟然頁面樣式全沒了變成了一個(gè)丑的要死的網(wǎng)頁，嚇出一身冷汗）
4.圖片能否批量上傳呢？而且是按照我們選擇的順序來排列呢？（吐槽：這又是一個(gè)難題，為了提高效率我們想批量上傳多張圖片因?yàn)閳D片是有順序的，但是上傳上去后竟然給你順序打亂，這真的是惱火，不得不耗費(fèi)很多時(shí)間去檢查重新拍?。?br/>5.隔十幾秒時(shí)間自動(dòng)能保存已經(jīng)編輯好的內(nèi)容（這個(gè)也很重要，經(jīng)常遇到你在編輯文章過程很久突然斷電或不小心關(guān)閉了頁面抑或時(shí)間久了后臺(tái)自動(dòng)退出這時(shí)悲劇了，前面耗費(fèi)那么多時(shí)間編輯的內(nèi)容竟然全沒了，欲哭無淚！心想有沒有好辦法能讓編輯器可以自動(dòng)保存呢？）
目前我暫時(shí)感覺到這5點(diǎn)是影響大的，于是網(wǎng)上搜索資料在著手對(duì)ueditor編輯器進(jìn)行優(yōu)化改造，希望能提高工作效率，實(shí)在是太急迫了，最后通過堅(jiān)持不懈的努力耗費(fèi)兩晝夜時(shí)間終于給這5個(gè)問題盡可能的給優(yōu)化過來，雖然還有部分使用問題沒有很好的解決但是比起最開始是好了不少。
針對(duì)一點(diǎn)解決方法：這個(gè)沒有對(duì)代碼做任何修改編輯器默認(rèn)有，我的解決方法是將從網(wǎng)絡(luò)里拷貝的圖文文章先拷貝到word然后再從word里的粘貼到編輯器，于是出現(xiàn)了一個(gè)叫“圖片轉(zhuǎn)存”的提示這時(shí)就只能一張張的去給圖片進(jìn)行轉(zhuǎn)存（怎么操作篇幅長(zhǎng)自行搜索，有一個(gè)注意要點(diǎn)就是在生成一個(gè)本地圖片鏈接前面是帶file:///一定要給這個(gè)去掉才能在本地打開圖片），這個(gè)只能一張張的去轉(zhuǎn)存雖然也不太方便但是比起之前的方式是方便不少。網(wǎng)上也搜索過用一個(gè)空間叫wordpaster集合到編輯器里無奈小編不懂js技術(shù)搗鼓了幾個(gè)鐘都未能成功最后只好放棄有懂的朋友可以去試試。
第二點(diǎn)解決方法：https://blog.csdn.net/y18749247391/article/details/79915828 我是從這篇文章里改的。他能實(shí)現(xiàn)默認(rèn)是純文本粘貼然后圖片能做到不屏蔽
第三點(diǎn)解決方法：這個(gè)需要自行網(wǎng)上搜，我自己的貌似技術(shù)有給解決。
第四點(diǎn)解決方法：圖片批量上傳本身是支持的但是順序混亂問題我有在網(wǎng)上找到這篇帖子https://blog.csdn.net/qq_33157666/article/details/79584365嘗試過貌似有問題不確定是我瀏覽器flash插件問題還是什么然后我又還原回來的，可以去試試。
第五點(diǎn)解決方法：對(duì)ueditor.config.js第104行 前面的注釋符號(hào)“//”刪除啟用自動(dòng)保存（,enableAutoSave:true）

標(biāo)題名稱：網(wǎng)站維護(hù)之Ueditor編輯器深度自定義改造
標(biāo)題網(wǎng)址：http://www.bm7419.com/news10/185110.html

網(wǎng)站建設(shè)、網(wǎng)絡(luò)推廣公司-創(chuàng)新互聯(lián)，是專注品牌與效果的網(wǎng)站制作，網(wǎng)絡(luò)營銷seo公司；服務(wù)項(xiàng)目有網(wǎng)站維護(hù)等

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請(qǐng)盡快告知，我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng)，如需處理請(qǐng)聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時(shí)需注明來源： 創(chuàng)新互聯(lián)